/* Homepage hero: subtle moving background + clearer "Continue" action row.
   Scoped to the homepage (data-yitm-design-mode="home"). Blue/navy/teal palette only.
   Motion uses transform only, is decorative (aria-hidden) and stops for reduced motion.
   The button rules use normal (unlayered) declarations so they beat the older
   transparent-link rule in yitm-home-quoteme-entry-a0019736.css; colours still come
   from the shared action tokens in yitm-core.css. */

/* ---------- 1. Moving hero background ---------- */

html:root body[data-yitm-design-mode="home"] #main #top.home-core-hero > .home-hero-motion {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

/* Soft drifting glows (cyan = AI, teal = local help). */
html:root body[data-yitm-design-mode="home"] #main #top.home-core-hero > .home-hero-motion::before {
  content: "";
  position: absolute;
  inset: -25%;
  background:
    radial-gradient(38% 34% at 24% 30%, rgba(82, 221, 255, .22), transparent 70%),
    radial-gradient(34% 30% at 80% 68%, rgba(42, 167, 181, .20), transparent 70%),
    radial-gradient(28% 24% at 62% 14%, rgba(96, 165, 250, .14), transparent 70%);
  animation: yitm-hero-drift 26s ease-in-out infinite alternate;
  will-change: transform;
}

/* Faint diagonal lines that slide slowly. The 48px stripe period along a 115deg
   gradient is (43.5px, 20.3px), so the loop has no visible jump. */
html:root body[data-yitm-design-mode="home"] #main #top.home-core-hero > .home-hero-motion::after {
  content: "";
  position: absolute;
  inset: -50%;
  background: repeating-linear-gradient(115deg, transparent 0 46px, rgba(82, 221, 255, .07) 46px 48px);
  -webkit-mask-image: radial-gradient(70% 60% at 50% 40%, #000 30%, transparent 85%);
          mask-image: radial-gradient(70% 60% at 50% 40%, #000 30%, transparent 85%);
  animation: yitm-hero-lines 40s linear infinite;
  will-change: transform;
}

@keyframes yitm-hero-drift {
  0%   { transform: translate3d(-3%, -2%, 0) scale(1); }
  50%  { transform: translate3d(3%, 2%, 0) scale(1.06); }
  100% { transform: translate3d(-2%, 3%, 0) scale(1.02); }
}

@keyframes yitm-hero-lines {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(43.5px, 20.3px, 0); }
}

/* Phones: keep the glow, drop the lines to save battery and keep text calm. */
@media (max-width: 640px) {
  html:root body[data-yitm-design-mode="home"] #main #top.home-core-hero > .home-hero-motion::after { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  html:root body[data-yitm-design-mode="home"] #main #top.home-core-hero > .home-hero-motion::before,
  html:root body[data-yitm-design-mode="home"] #main #top.home-core-hero > .home-hero-motion::after { animation: none; }
}

/* ---------- 2. "Continue in the full assistant" action row ---------- */

html:root body[data-yitm-design-mode="home"] .yhq .yhq__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 18px;
  margin: 12px 0 14px;
}

html:root body[data-yitm-design-mode="home"] .yhq .yhq__actions > form {
  display: flex;
  margin: 0;
}

/* Primary action: a real button, with padding and no link underline. */
html:root body[data-yitm-design-mode="home"] .yhq .yhq__actions > form .yhq__message-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 48px;
  margin: 0;
  padding: 12px 24px;
  border-radius: 12px;
  font-weight: 800;
  line-height: 1.2;
  text-decoration: none;
  white-space: nowrap;
  box-shadow: 0 6px 16px rgba(7, 26, 51, .22);
  transition: transform .15s ease, box-shadow .15s ease;
}

html:root body[data-yitm-design-mode="home"] .yhq .yhq__actions > form .yhq__message-cta::after {
  content: "\2192";
  transition: transform .15s ease;
}

html:root body[data-yitm-design-mode="home"] .yhq .yhq__actions > form .yhq__message-cta:hover,
html:root body[data-yitm-design-mode="home"] .yhq .yhq__actions > form .yhq__message-cta:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(7, 26, 51, .3);
}

html:root body[data-yitm-design-mode="home"] .yhq .yhq__actions > form .yhq__message-cta:hover::after,
html:root body[data-yitm-design-mode="home"] .yhq .yhq__actions > form .yhq__message-cta:focus-visible::after { transform: translateX(3px); }

html:root body[data-yitm-design-mode="home"] .yhq .yhq__actions > form .yhq__message-cta:focus-visible {
  outline: 3px solid var(--yitm-navy, #14243E);
  outline-offset: 3px;
}

/* Secondary action (resume previous request) stays a quiet link with a proper tap target. */
html:root body[data-yitm-design-mode="home"] .yhq .yhq__actions > .yhq__resume-task {
  min-height: 44px;
  margin: 0;
  padding: 8px 4px;
}

/* Phones: full-width primary button, text may wrap, links stack under it. */
@media (max-width: 700px) {
  html:root body[data-yitm-design-mode="home"] .yhq .yhq__actions { flex-direction: column; align-items: stretch; }
  html:root body[data-yitm-design-mode="home"] .yhq .yhq__actions > form { width: 100%; }
  html:root body[data-yitm-design-mode="home"] .yhq .yhq__actions > form .yhq__message-cta { width: 100%; white-space: normal; }
  html:root body[data-yitm-design-mode="home"] .yhq .yhq__actions > .yhq__resume-task { text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
  html:root body[data-yitm-design-mode="home"] .yhq .yhq__actions > form .yhq__message-cta,
  html:root body[data-yitm-design-mode="home"] .yhq .yhq__actions > form .yhq__message-cta::after { transition: none; }
}