/* Isolated preview overrides; the original homepage and first draft keep their styles. */
@font-face {
  font-family: next-sass-site;
  src: url('/fonts/next-sass-site.woff2') format('woff2');
  font-display: block;
}
.evolution-home :is([class^="ns-"], [class*=" ns-"]) { font-family: next-sass-site !important; }
.evolution-home { color-scheme: light; }
/* Preview the approved brand without changing the shared header/footer assets. */
.evolution-home :is(header, footer) img[src="/assets/oscova-mark.svg"] { content: url('/assets/oscova-mark-violet.svg'); }
.dark .evolution-home { background: var(--color-background-8); color: var(--color-accent); color-scheme: dark; }
.dark .evolution-home [class~="bg-background-12"] { background-color: var(--color-background-5); border-color: var(--color-stroke-6); }
.dark .evolution-home [class~="bg-white"] { background-color: var(--color-background-7); }
.dark .evolution-home [class~="text-secondary"] { color: var(--color-accent); }
.dark .evolution-home [class~="text-secondary/60"],
.dark .evolution-home [class~="text-secondary/40"] { color: #a7afba; }
.dark .evolution-home [class~="bg-stroke-3"] { background-color: var(--color-stroke-6); }
.dark .evolution-home [class~="border-background-12"],
.dark .evolution-home [class~="border-t-stroke-2"] { border-color: var(--color-stroke-6); }
.dark .evolution-home .badge-white,
.dark .evolution-home .badge-white-v2,
.dark .evolution-home .badge-gray-light-v2 { background: var(--color-background-7); color: var(--color-accent); }
.dark .evolution-home .header-one { background: rgb(24 29 38 / 94%); border: 1px solid var(--color-stroke-7); }
.dark .evolution-home .header-one .btn-secondary-v2 { background: var(--color-accent); color: var(--color-secondary); }
.dark .evolution-home .header-one .btn-secondary-v2 svg { fill: var(--color-secondary); }
.evolution-home section[id] { scroll-margin-top: 140px; }
/* These setup panels stay light even when the surrounding page is dark. */
.evolution-home #how-it-works :is(.bg-ns-green, .bg-background-3) :is(h3, [class~="text-secondary"]) { color: var(--color-secondary); }
.evolution-home #how-it-works :is(.bg-ns-green, .bg-background-3) p { color: #3c444f; }
/* Keep the template's light buttons paired with dark labels in either theme. */
.evolution-home [aria-label="Documentation overview"] .group > a,
.dark .evolution-home [aria-label="Documentation overview"] .group > a { background: var(--color-accent); color: var(--color-secondary); }
.evolution-home [aria-label="Documentation overview"] .group > a:is(:hover, :focus-visible),
.dark .evolution-home [aria-label="Documentation overview"] .group > a:is(:hover, :focus-visible) { background: var(--color-secondary); color: var(--color-accent); }
.evolution-home [aria-label="Documentation overview"] .group > a path { fill: currentColor; }
.evolution-art { overflow: hidden; border-radius: 16px; background: var(--color-background-2); }
.evolution-feature-card { display: grid; grid-template-rows: auto 1fr auto; gap: 24px; }
.evolution-capability-card { display: flex; flex-direction: column; gap: 12px; padding: 24px; height: 100%; min-width: 0; }
.evolution-home #whats-inside .evolution-feature-art { margin-top: auto; padding-top: 8px; }
.evolution-home #whats-inside .evolution-feature-art img { height: 170px; }
.evolution-compact-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin-top: 24px; }
@media (max-width: 1199px) {
  .evolution-compact-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  .evolution-compact-grid { grid-template-columns: minmax(0, 1fr); }
  .evolution-home #whats-inside .evolution-feature-art img { height: 150px; }
}
.evolution-feature-art { background: transparent; }
.evolution-feature-art img { width: 100%; height: 250px; object-fit: contain; }
.evolution-art img { width: 100%; height: 236px; object-fit: contain; }
.dark .evolution-art { background: var(--color-background-5); }
.evolution-home #features h3, .evolution-home #whats-inside h3 { font-size: 1.5rem; line-height: 1.3; }
.evolution-routines { display: grid; grid-template-columns: 1fr 1fr; gap: 68px; align-items: start; }
.evolution-routines-intro { position: sticky; top: 140px; }
.evolution-routines-intro .text-center { text-align: left; }
.evolution-routine-stack { display: grid; gap: 32px; }
.evolution-routine-card { padding: 6px; border-radius: 20px; background: linear-gradient(135deg, #864ffe, #83e7ee); }
.evolution-routine-body { display: flex; flex-direction: column; gap: 24px; padding: 32px; border-radius: 14px; background: white; }
.dark .evolution-routine-body { background: var(--color-background-7); }
@media (max-width: 991px) {
  .evolution-routines { grid-template-columns: 1fr; gap: 24px; }
  .evolution-routines-intro, .evolution-routine-card { position: static; }
  .evolution-routines-intro .text-center { text-align: center; }
  .evolution-routine-body { padding: 24px; }
}
@media (prefers-reduced-motion: reduce), (max-height: 760px) {
  .evolution-routine-card { position: static; }
}
.evolution-home .evolution-chat { height: auto; border-radius: 28px 28px 0 0; }
.evolution-media-caption { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; padding: 16px 22px; border-radius: 0 0 24px 24px; background: white; color: var(--color-secondary); font-size: .875rem; }
.dark .evolution-media-caption { background: var(--color-background-7); color: var(--color-accent); }
.evolution-media-caption button { cursor: pointer; font-weight: 500; }
.evolution-header-controls { display: flex; align-items: center; gap: 8px; margin-left: 12px; }
.evolution-github-link, .evolution-theme-toggle { display: grid; place-items: center; flex-shrink: 0; width: 48px; height: 48px; border-radius: 50%; background: var(--color-background-4); color: var(--color-secondary); cursor: pointer; }
.evolution-github-link { text-decoration: none; }
.evolution-github-link:hover, .evolution-github-link:focus { background: white; color: var(--color-secondary); text-decoration: none; }
.dark .evolution-github-link { background: var(--color-background-9); }
.dark .evolution-github-link:hover, .dark .evolution-github-link:focus { background: var(--color-background-7); }
.evolution-github-mark { width: 32px; height: 32px; }
.evolution-github-mark--white, .dark .evolution-github-mark--black { display: none; }
.dark .evolution-github-mark--white { display: block; }
.dark .evolution-theme-toggle { background: var(--color-background-9); color: var(--color-accent); }
.evolution-theme-toggle:hover { background: var(--color-ns-green); color: var(--color-secondary); }
.evolution-theme-sun, .dark .evolution-theme-moon { display: none; }
.dark .evolution-theme-sun { display: block; }
.evolution-home :is(button, a):focus-visible { outline: 3px solid var(--color-primary-500); outline-offset: 5px; }
.evolution-dialog { margin: auto; padding: 40px; border: 1px solid var(--color-stroke-3); border-radius: 28px; background: white; color: var(--color-secondary); width: min(860px,calc(100% - 32px)); max-height: calc(100vh - 32px); overflow: auto; }
.dark .evolution-dialog { background: var(--color-background-5); color: var(--color-accent); border-color: var(--color-stroke-7); }
.evolution-dialog::backdrop { background: #000b; }
.evolution-dialog form button { float: right; width: 44px; height: 44px; font-size: 28px; cursor: pointer; }
.evolution-dialog h2 { font-size: 2rem; margin-bottom: 18px; }
.evolution-dialog p { margin-bottom: 24px; }
.evolution-video-stage { aspect-ratio: 16/9; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; border-radius: 20px; background: var(--color-background-8); color: var(--color-accent); }
.evolution-video-stage span:first-child { font-size: 52px; }
@media (max-width: 640px) {
  .evolution-home .evolution-chat { border-radius: 18px 18px 0 0; }
  .evolution-media-caption { font-size: .8125rem; justify-content: center; }
  .evolution-dialog { padding: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .evolution-home [data-ns-animate] { opacity: 1 !important; transform: none !important; }
  .evolution-home * { transition: none !important; animation: none !important; }
}