/* Homepage hero: amber action accent + cyan AI highlight.
   Scoped to the homepage only. Amber is reserved for the primary action and
   "confirmed" ticks; it is not part of the shared palette. */
@layer tokens {
body[data-yitm-design-mode="home"] {
  --home-accent-amber: #F5A524;
  --home-accent-amber-hover: #FFB93D;
  --home-ai-cyan: #52DDFF;
  --home-on-amber: #14243E;
}
html:root:root body[data-yitm-design-mode="home"] #main #top .home-assistant-intro h1 .home-ai-accent { color: var(--home-ai-cyan) !important; -webkit-text-fill-color: var(--home-ai-cyan) !important; text-shadow: none !important; }
html:root:root body[data-yitm-design-mode="home"] #main #top .home-hero-actions { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; margin: 22px 0 0 !important; }
html:root:root body[data-yitm-design-mode="home"] #main #top .home-assistant-intro.home-assistant-intro a.home-hero-cta,
html:root:root body[data-yitm-design-mode="home"] #main #top .home-assistant-intro.home-assistant-intro a.home-hero-cta:visited {
  display: inline-block; background: var(--home-accent-amber) !important; color: var(--home-on-amber) !important; -webkit-text-fill-color: var(--home-on-amber) !important;
  font-weight: 700; border: 0 !important; border-radius: 12px; padding: 14px 26px; text-decoration: none !important;
}
html:root:root body[data-yitm-design-mode="home"] #main #top .home-assistant-intro.home-assistant-intro a.home-hero-cta:hover,
html:root:root body[data-yitm-design-mode="home"] #main #top .home-assistant-intro.home-assistant-intro a.home-hero-cta:active { background: var(--home-accent-amber-hover) !important; color: var(--home-on-amber) !important; -webkit-text-fill-color: var(--home-on-amber) !important; text-decoration: none !important; }
html:root:root body[data-yitm-design-mode="home"] #main #top .home-assistant-intro.home-assistant-intro a.home-hero-secondary,
html:root:root body[data-yitm-design-mode="home"] #main #top .home-assistant-intro.home-assistant-intro a.home-hero-secondary:visited {
  display: inline-block; background: transparent !important; color: #fff !important; -webkit-text-fill-color: #fff !important;
  border: 2px solid #52a7c8 !important; border-radius: 12px; padding: 12px 24px; font-weight: 600; text-decoration: none !important;
}
html:root:root body[data-yitm-design-mode="home"] #main #top .home-assistant-intro.home-assistant-intro a.home-hero-secondary:hover,
html:root:root body[data-yitm-design-mode="home"] #main #top .home-assistant-intro.home-assistant-intro a.home-hero-secondary:active { background: rgba(82,221,255,.12) !important; border-color: var(--home-ai-cyan) !important; color: #fff !important; text-decoration: none !important; }
html:root:root body[data-yitm-design-mode="home"] #main #top .home-assistant-intro.home-assistant-intro a.home-hero-cta:focus-visible,
html:root:root body[data-yitm-design-mode="home"] #main #top .home-assistant-intro.home-assistant-intro a.home-hero-secondary:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
html:root:root body[data-yitm-design-mode="home"] #main #top .home-hero-trust {
  list-style: none; margin: 22px 0 0 !important; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 22px;
  color: #EAF4FA !important; font-size: 1rem;
}
html:root:root body[data-yitm-design-mode="home"] #main #top .home-hero-trust li { margin: 0; color: #EAF4FA !important; }
html:root:root body[data-yitm-design-mode="home"] #main #top .home-hero-trust li::before { content: "\2713"; color: var(--home-accent-amber); font-weight: 800; margin-right: 8px; }
@media (max-width: 640px) {
  html:root:root body[data-yitm-design-mode="home"] #main #top .home-hero-actions { flex-direction: column; align-items: stretch; }
  html:root:root body[data-yitm-design-mode="home"] #main #top .home-assistant-intro.home-assistant-intro a.home-hero-cta,
  html:root:root body[data-yitm-design-mode="home"] #main #top .home-assistant-intro.home-assistant-intro a.home-hero-secondary { text-align: center; }
}
html:root:root body[data-yitm-design-mode="home"] .site-header a.nav-cta,
html:root:root body[data-yitm-design-mode="home"] .site-header a.nav-cta:visited {
  background: var(--home-accent-amber) !important; color: var(--home-on-amber) !important;
  -webkit-text-fill-color: var(--home-on-amber) !important; border-color: var(--home-accent-amber) !important; text-decoration: none !important;
}
html:root:root body[data-yitm-design-mode="home"] .site-header a.nav-cta:hover,
html:root:root body[data-yitm-design-mode="home"] .site-header a.nav-cta:active {
  background: var(--home-accent-amber-hover) !important; color: var(--home-on-amber) !important; -webkit-text-fill-color: var(--home-on-amber) !important;
}
html:root:root body[data-yitm-design-mode="home"] .site-header a.nav-cta:focus-visible { outline: 3px solid var(--yitm-navy, #14243E); outline-offset: 3px; }
}