/* Inicio v14: referencia del propietario, aislada de los recorridos. */
@font-face {
  font-family: "Bricolage Grotesque";
  font-style: normal;
  font-weight: 700 800;
  font-display: swap;
  src: url("assets/fonts/bricolage-grotesque-latin.woff2") format("woff2");
}

:root[data-theme] body { background: var(--color-canvas); color: var(--color-text); }

html[data-theme="dark"] {
  --color-canvas: #0f1011;
  --color-surface: #151618;
  --color-surface-subtle: #1d1e21;
  --color-text: #ececee;
  --color-text-muted: #9b9fa7;
  --color-border-subtle: #26282c;
  --color-border-control: #3d4046;
  --ink: var(--color-text);
  --muted: var(--color-text-muted);
  --line: var(--color-border-subtle);
  --control-line: var(--color-border-control);
  --surface: var(--color-surface);
  --canvas: var(--color-canvas);
  --field: var(--color-surface);
  --field-hover: var(--color-surface-subtle);
  --section: var(--color-surface-subtle);
}

body[data-view="home"] #app { display: flex; flex-direction: column; }
body[data-view="home"] .site-footer { display: none; }
body[data-view="home"] .topbar {
  min-height: 60px; padding: 0 clamp(28px, 5vw, 64px); gap: 16px;
  background: var(--color-canvas); color: var(--color-text);
  border-bottom: 1px solid var(--color-border-subtle); box-shadow: none;
  animation: v14-drop .5s cubic-bezier(.2, .7, .2, 1) backwards;
}
body[data-view="home"] .topbar::before { display: none; }
body[data-view="home"] .topbar .brand { gap: 12px; padding: 8px 0; min-width: 0; }
body[data-view="home"] .brand strong {
  font-family: "Bricolage Grotesque", "Segoe UI Variable Display", "Segoe UI", system-ui, sans-serif;
  font-size: .8889rem; font-weight: 700; line-height: 1.25; letter-spacing: 0;
  color: var(--color-text);
}
body[data-view="home"] .brand small { margin-top: 2px; font-size: .7222rem; line-height: 1.25; color: var(--color-text-muted); }
body[data-view="home"] .brand-mark {
  width: 34px; height: 34px; border-radius: 8px;
  animation: v14-pop .6s .15s cubic-bezier(.3, 1.5, .5, 1) backwards;
  transition: transform .25s;
}
body[data-view="home"] .brand-mark i { border-radius: 8px 3px; }
body[data-view="home"] .brand-mark i:first-child { top: 6px; left: 11px; width: 15px; height: 10px; }
body[data-view="home"] .brand-mark i:last-child { bottom: 6px; left: 7px; width: 18px; height: 11px; }
body[data-view="home"] .brand:hover .brand-mark { transform: rotate(-8deg) scale(1.06); }
.appearance-label { display: none; }
body[data-view="home"] .top-actions .appearance-button {
  width: auto; min-width: 0; height: 34px; min-height: 34px; padding: 0 12px 0 10px; gap: 8px;
  border: 1px solid var(--color-border-subtle); border-radius: 8px;
  background: var(--color-surface); color: var(--color-text); font-size: .7778rem; font-weight: 600;
}
body[data-view="home"] .appearance-button .appearance-label { display: inline; }
body[data-view="home"] .appearance-button .guide-icon { width: 16px; height: 16px; color: var(--color-text-muted); }
body[data-view="home"] .top-actions .appearance-button:hover { background: var(--color-surface-subtle); border-color: var(--color-border-control); }

.home-v14 {
  --v14-canvas: var(--color-canvas);
  --v14-surface: var(--color-surface);
  --v14-soft: var(--color-surface-subtle);
  --v14-line: var(--color-border-subtle);
  --v14-control: var(--color-border-control);
  --v14-text: var(--color-text);
  --v14-muted: var(--color-text-muted);
  --v14-footer-bg: var(--v14-canvas);
  --v14-footer-text: var(--v14-text);
  --v14-footer-muted: var(--v14-muted);
  --v14-footer-surface: var(--v14-surface);
  --v14-footer-line: var(--v14-line);
  --v14-footer-control: var(--v14-control);
  display: flex; flex: 1; flex-direction: column; width: 100%; min-width: 0;
  min-height: calc(100dvh - 60px); background: var(--v14-canvas); color: var(--v14-text);
  font-family: "Segoe UI", system-ui, sans-serif; line-height: 1.5;
}
.v14-main { flex: 1; display: flex; flex-direction: column; gap: 30px; padding: 44px clamp(28px, 5vw, 64px) 40px; }
.v14-main h1, .v14-card-title, .v14-footer h2 {
  font-family: "Bricolage Grotesque", "Segoe UI Variable Display", "Segoe UI", system-ui, sans-serif;
}
.v14-main h1 {
  margin: 0; font-size: 1.6667rem; font-weight: 700; line-height: 1.1; letter-spacing: -.015em;
  color: var(--v14-text); animation: v14-rise .55s .12s cubic-bezier(.2, .7, .2, 1) backwards;
}
.v14-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 24px; }
.v14-card {
  cursor: pointer;
  --v14-step-size: 38px;
  --v14-step-gap: 14px;
  --v14-card-bg: var(--v14-surface);
  --v14-card-text: var(--v14-text);
  --v14-card-muted: var(--v14-muted);
  --v14-card-line: var(--v14-line);
  --v14-card-control: var(--v14-control);
  --v14-accent: var(--color-link);
  --v14-first-bg: var(--color-action);
  --v14-first-ink: var(--color-on-action);
  --v14-go-bg: var(--color-action);
  --v14-go-ink: var(--color-on-action);
  position: relative; grid-row: span 4; display: grid; grid-template-rows: subgrid; row-gap: 24px;
  min-width: 0; padding: clamp(26px, 3.4vw, 40px); border: 1px solid var(--v14-card-line); border-radius: 12px;
  background: var(--v14-card-bg); color: var(--v14-card-text);
  transition: border-color .2s, box-shadow .25s, transform .25s;
  animation: v14-rise .6s cubic-bezier(.2, .7, .2, 1) backwards;
}
.v14-card:nth-child(1) { animation-delay: .22s; }
.v14-card:nth-child(2) { animation-delay: .32s; }
.v14-count {
  position: absolute; top: 24px; right: 24px; padding: 4px 10px;
  border: 1px solid var(--v14-card-line); border-radius: 6px;
  background: var(--v14-soft); color: var(--v14-card-muted); font-size: .6944rem; font-weight: 600; letter-spacing: .02em;
}
.v14-card-heading { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.v14-eyebrow {
  display: flex; align-items: center; padding-right: 76px;
  color: var(--v14-card-muted); font-size: .6944rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
}
.v14-eyebrow::before { content: ""; flex: 0 0 8px; width: 8px; height: 8px; margin-right: 10px; border-radius: 50%; background: var(--v14-accent); }
.v14-card-title { margin: 0; font-size: clamp(1.6667rem, 3.3vw, 2.5556rem); line-height: 1.05; font-weight: 700; letter-spacing: -.025em; color: inherit; }
.v14-description { margin: 0; max-width: 38ch; color: var(--v14-card-muted); font-size: 1rem; line-height: 1.45; }
.v14-path { align-self: end; display: grid; grid-template-columns: repeat(var(--step-count), var(--v14-step-size)); gap: 14px var(--v14-step-gap); width: max-content; max-width: 100%; min-width: 0; }
.v14-steps { grid-column: 1 / -1; display: grid; grid-template-columns: subgrid; gap: var(--v14-step-gap); margin: 2px 0 0; padding: 0; list-style: none; }
.v14-steps > li { position: relative; min-width: 0; }
.v14-step {
  display: grid; place-items: center; width: 100%; height: var(--v14-step-size);
  border: 1px solid var(--v14-card-control); border-radius: 7px; background: transparent;
  color: var(--v14-card-muted); font-size: .7778rem; font-weight: 600; line-height: 1; cursor: default;
  transition: border-color .2s, color .2s, transform .15s;
  animation: v14-pop .4s cubic-bezier(.3, 1.4, .5, 1) backwards; animation-delay: calc(.5s + var(--i) * 45ms);
}
.v14-steps > li + li::before {
  content: ""; position: absolute; right: 100%; top: 50%; width: var(--v14-step-gap); height: 2px;
  background: var(--v14-card-muted); opacity: .35; transform-origin: right;
  animation: v14-draw .3s backwards; animation-delay: calc(.5s + var(--i) * 45ms);
}
.v14-step.is-first { background: var(--v14-first-bg); border-color: var(--v14-first-bg); color: var(--v14-first-ink); }
.v14-step.is-last { border-color: var(--v14-accent); color: var(--v14-accent); }
.v14-card:hover .v14-step { border-color: var(--v14-accent); color: var(--v14-accent); transition-delay: calc(var(--i) * 40ms); }
.v14-card:hover .v14-step.is-first { color: var(--v14-first-ink); }
.v14-step:hover { border-color: var(--v14-card-text); color: var(--v14-card-text); }
.v14-tooltip {
  position: absolute; bottom: calc(100% + 10px); left: 0; z-index: 5;
  width: max-content; max-width: min(320px, calc(100vw - 56px)); padding: 7px 12px;
  border: 1px solid var(--v14-control); border-radius: 8px; background: var(--v14-soft); color: var(--v14-text);
  font-size: .7222rem; font-weight: 600; line-height: 1.3; text-align: left;
  opacity: 0; pointer-events: none; transition: opacity .12s;
}
.v14-steps > li:nth-last-child(-n+3) .v14-tooltip { left: auto; right: 0; }
.v14-steps > li:hover .v14-tooltip, .v14-steps > li:focus-within .v14-tooltip { opacity: 1; }
.v14-endpoints { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) max-content; gap: 22px; color: var(--v14-card-muted); font-size: .7778rem; line-height: 1.35; animation: v14-rise .5s .85s backwards; }
.v14-endpoints > span { display: block; min-width: 0; }
.v14-endpoints > span:last-child { text-align: right; }
.v14-endpoints b { display: block; font-size: .6389rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; opacity: .75; }
.v14-go {
  position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 12px;
  width: 100%; min-height: 46px; padding: 10px 18px; border: 0; border-radius: 8px;
  background: var(--v14-go-bg); color: var(--v14-go-ink); font: inherit; font-size: .8611rem; font-weight: 650; line-height: 1.3; text-align: left;
  transition: filter .15s; animation: v14-rise .5s .85s backwards;
}
.v14-go:hover { filter: brightness(1.1); }
.v14-go::after { content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, transparent 30%, rgba(255, 255, 255, .4) 50%, transparent 70%); transform: translateX(-130%); pointer-events: none; }
.v14-go:hover::after { animation: v14-shine .75s ease; }
.v14-arrow { flex: none; width: 22px; height: 22px; transition: transform .2s; }
.v14-card:hover .v14-arrow { transform: translateX(6px); }

.v14-footer {
  margin-top: auto; padding: 30px clamp(28px, 5vw, 64px) 22px;
  border-top: 1px solid var(--v14-footer-line); background: var(--v14-footer-bg); color: var(--v14-footer-text);
}
.v14-footer h2 { margin: 0 0 22px; font-size: .9444rem; line-height: 1.3; font-weight: 700; letter-spacing: -.02em; color: inherit; }
.v14-shortcuts { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.v14-shortcut {
  position: relative; display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; gap: 14px;
  min-width: 0; min-height: 92px; padding: 16px; border: 1px solid var(--v14-footer-line); border-radius: 10px;
  background: var(--v14-footer-surface); color: var(--v14-footer-text); font: inherit; font-size: .8333rem; font-weight: 600; line-height: 1.2; text-align: left;
  transition: transform .2s, border-color .2s, background .2s;
  animation: v14-rise .5s backwards; animation-delay: calc(.75s + var(--i) * 60ms);
}
.v14-shortcut > .guide-icon { flex: none; width: 22px; height: 22px; color: var(--v14-footer-muted); }
.v14-shortcut:hover { transform: translateY(-3px); border-color: var(--v14-footer-control); background: var(--v14-soft); }
.v14-shortcut:hover > .guide-icon { color: #ffed00; }
.v14-shortcut-arrow {
  position: absolute; top: 14px; right: 14px; width: 16px; height: 16px;
  opacity: 0; transform: translate(-4px, 4px); transition: opacity .18s, transform .18s;
}
.v14-shortcut:hover .v14-shortcut-arrow { opacity: 1; transform: none; color: #ffed00; }
.v14-footer-bottom { display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: center; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--v14-footer-line); color: var(--v14-footer-muted); }
.v14-privacy { display: flex; align-items: flex-start; gap: 14px; }
.v14-privacy > .guide-icon { flex: none; width: 22px; height: 22px; margin-top: 2px; color: #4cc38a; }
.v14-privacy strong { display: block; margin-bottom: 2px; font-size: .8333rem; font-weight: 700; }
.v14-privacy span { display: block; max-width: 74ch; font-size: .75rem; line-height: 1.5; }
.v14-credits { display: grid; grid-template-columns: auto auto; justify-content: end; align-items: center; gap: 8px 14px; max-width: 100%; font-size: .75rem; }
.v14-credits > span:last-child { grid-column: 1 / -1; text-align: right; }
.v14-version { justify-self: start; padding: 3px 9px; border: 1px solid var(--v14-footer-line); border-radius: 6px; background: var(--v14-soft); color: var(--v14-footer-text); font: inherit; font-size: .6944rem; font-weight: 700; white-space: nowrap; }
.v14-changelog { min-height: 32px; padding: 5px 10px; border: 1px solid var(--v14-footer-line); border-radius: 6px; background: var(--v14-footer-surface); color: var(--v14-footer-text); font: inherit; font-size: .75rem; font-weight: 600; }
.v14-changelog:hover { border-color: var(--v14-footer-control); background: var(--v14-soft); }
.home-v14 :is(button, .v14-step):focus-visible { outline: 3px solid var(--color-focus); outline-offset: 3px; }

/* Paleta oscura de la referencia; el contraste refuerza esta misma identidad. */
html[data-theme="dark"] body[data-view="home"] .topbar { background: rgba(15, 16, 17, .82); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
html[data-theme="dark"] body[data-view="home"] .topbar::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; opacity: .9;
  background: linear-gradient(90deg, #ffed00 0, #ffed00 18%, #3aa7e0 55%, transparent 85%);
  transform-origin: left; animation: v14-draw 1.2s .35s cubic-bezier(.2, .7, .2, 1) backwards;
}
html[data-theme="dark"] .v14-card[data-kind="reclamos"] {
  --v14-accent: #ffed00; --v14-first-bg: #ffed00; --v14-first-ink: #0f1011; --v14-go-bg: #ffed00; --v14-go-ink: #0f1011;
  background-image: radial-gradient(110% 70% at 0 0, rgba(255, 237, 0, .07), transparent 60%);
}
html[data-theme="dark"] .v14-card[data-kind="sar"] {
  --v14-accent: #3aa7e0; --v14-first-bg: #006ea8; --v14-first-ink: #fff;
  background-image: radial-gradient(110% 70% at 0 0, rgba(0, 140, 214, .2), transparent 60%);
}
html[data-theme="dark"] .v14-card[data-kind="reclamos"]:hover { transform: translateY(-3px); border-color: rgba(255, 237, 0, .55); box-shadow: 0 18px 48px -18px rgba(255, 237, 0, .28); }
html[data-theme="dark"] .v14-card[data-kind="sar"]:hover { transform: translateY(-3px); border-color: rgba(60, 170, 230, .6); box-shadow: 0 18px 48px -18px rgba(0, 140, 214, .5); }

/* Claro: captura del propietario, con cabecera blanca y superficies suaves. */
html[data-theme="light"] body[data-view="home"] .topbar { background: #fff; border-bottom-color: #dce1e6; box-shadow: 0 2px 8px rgba(16, 24, 32, .03); }
html[data-theme="light"] body[data-view="home"] .topbar::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; opacity: .6;
  background: linear-gradient(90deg, #ffed00 0, #ffed00 18%, #3aa7e0 55%, transparent 85%);
  transform-origin: left; animation: v14-draw 1.2s .35s cubic-bezier(.2, .7, .2, 1) backwards;
}
html[data-theme="light"] body[data-view="home"] .brand strong { color: #101820; }
html[data-theme="light"] body[data-view="home"] .brand small { color: #526276; }
html[data-theme="light"] body[data-view="home"] .top-actions .appearance-button { background: #fff; color: #101820; border-color: #dce1e6; }
html[data-theme="light"] body[data-view="home"] .appearance-button .guide-icon { color: #526276; }
html[data-theme="light"] body[data-view="home"] .top-actions .appearance-button:hover { background: #eef1f4; border-color: #8e9dac; }
html[data-theme="light"] .home-v14 {
  --v14-canvas: #f6f7f8; --v14-text: #101820; --v14-muted: #526276; --v14-soft: #eef1f4;
  --v14-line: #d3d9df; --v14-control: #8e9dac;
  --v14-footer-bg: #edf0f3; --v14-footer-text: #101820; --v14-footer-muted: #526276;
  --v14-footer-surface: #fff; --v14-footer-line: #d3d9df; --v14-footer-control: #8e9dac;
  background-image: radial-gradient(#d8dfe5 .8px, transparent .8px); background-size: 22px 22px;
}
html[data-theme="light"] .v14-card { box-shadow: 0 1px 2px rgba(16, 24, 32, .08); }
html[data-theme="light"] .v14-card:hover { transform: translateY(-3px); box-shadow: 0 6px 12px rgba(16, 24, 32, .1); }
html[data-theme="light"] .v14-card[data-kind="reclamos"] {
  --v14-card-bg: #fffdf1; --v14-card-text: #101820; --v14-card-muted: #526276;
  --v14-card-line: #d3d9df; --v14-card-control: #8e9dac; --v14-accent: #101820;
  --v14-first-bg: #ffed00; --v14-first-ink: #101820; --v14-go-bg: #ffed00; --v14-go-ink: #101820;
  background-image: radial-gradient(110% 70% at 0 0, rgba(255, 237, 0, .22), transparent 60%);
}
html[data-theme="light"] .v14-card[data-kind="sar"] {
  --v14-card-bg: #f5faff; --v14-card-text: #101820; --v14-card-muted: #526276;
  --v14-card-line: #d3d9df; --v14-card-control: #8e9dac; --v14-accent: #006ea8;
  --v14-first-bg: #006ea8; --v14-first-ink: #fff; --v14-go-bg: #006ea8; --v14-go-ink: #fff;
  background-image: radial-gradient(110% 70% at 0 0, rgba(0, 110, 168, .13), transparent 60%);
}
html[data-theme="light"] .v14-card[data-kind="reclamos"] .v14-eyebrow::before { background: #ffed00; border: 1px solid #c4b800; }
html[data-theme="light"] .v14-card[data-kind="sar"] .v14-eyebrow::before { background: #3aa7e0; border: 1px solid #8e9dac; }
html[data-theme="light"] .v14-count { background: #eef1f4; border-color: #dce1e6; }
html[data-theme="light"] .v14-step:not(.is-first) { background: #fff; }
html[data-theme="light"] .v14-card[data-kind="reclamos"] .v14-step.is-first { border-color: #101820; }
html[data-theme="light"] .v14-tooltip { background: #fff; border-color: #d3d9df; }
html[data-theme="light"] .v14-go { border: 1px solid #006ea8; box-shadow: 0 4px 8px rgba(0, 110, 168, .16); }
html[data-theme="light"] .v14-card[data-kind="reclamos"] .v14-go { border-color: #c4b800; box-shadow: 0 4px 8px rgba(147, 136, 0, .18); }
html[data-theme="light"] .v14-shortcut { box-shadow: 0 1px 2px rgba(16, 24, 32, .06); }
html[data-theme="light"] .v14-shortcut > .guide-icon { width: 40px; height: 40px; padding: 9px; border-radius: 10px; background: #eef1f4; color: #435160; }
html[data-theme="light"] .v14-shortcut:hover { background: #fff; }
html[data-theme="light"] .v14-shortcut:hover .v14-shortcut-arrow { color: #006ea8; }
html[data-theme="light"] .v14-privacy > .guide-icon { color: #00a96c; }
html[data-theme="light"] .v14-version { border-color: #ffed00; background: #ffed00; color: #101820; }

/* Contraste reforzado: colores de marca intactos, textos y contornos más claros. */
html[data-theme="dark"][data-contrast="high"] {
  --color-canvas: #0f1011;
  --color-surface: #151618;
  --color-surface-subtle: #232529;
  --color-info-soft: #23272d;
  --color-text: #fff;
  --color-text-muted: #d9dde2;
  --color-border-subtle: #8c939d;
  --color-border-control: #b6bec8;
}
html[data-theme="light"][data-contrast="high"] {
  --color-text: #101820;
  --color-text-muted: #263b4a;
  --color-border-subtle: #526473;
  --color-border-control: #344c5c;
}
html[data-theme="light"][data-contrast="high"] .home-v14 {
  --v14-muted: #263b4a;
  --v14-line: #526473;
  --v14-control: #344c5c;
  --v14-footer-muted: #263b4a;
  --v14-footer-line: #526473;
  --v14-footer-control: #344c5c;
}
html[data-theme="light"][data-contrast="high"] .v14-card {
  --v14-card-muted: var(--v14-muted);
  --v14-card-line: var(--v14-line);
  --v14-card-control: var(--v14-control);
}
html[data-theme][data-contrast="high"] .v14-card[data-kind="sar"] { --v14-first-bg: #005b8e; --v14-go-bg: #005b8e; }
html[data-theme="light"][data-contrast="high"] body[data-view="home"] .topbar { border-bottom-color: #526473; }
html[data-theme="light"][data-contrast="high"] body[data-view="home"] .brand small { color: #263b4a; }
html[data-theme="light"][data-contrast="high"] body[data-view="home"] .top-actions .appearance-button { color: #101820; border-color: #526473; }
html[data-theme="light"][data-contrast="high"] body[data-view="home"] .appearance-button .guide-icon { color: #263b4a; }
html[data-theme="light"][data-contrast="high"] body[data-view="home"] .top-actions .appearance-button:hover { border-color: #344c5c; }
html[data-theme="light"][data-contrast="high"] .v14-count { border-color: var(--v14-card-line); }
html[data-theme="light"][data-contrast="high"] .v14-card .v14-eyebrow::before { border-color: var(--v14-card-control); }
html[data-theme="light"][data-contrast="high"] .v14-tooltip { border-color: var(--v14-control); }
html[data-theme="light"][data-contrast="high"] .v14-go { border-color: #101820; }
html[data-theme="light"][data-contrast="high"] .v14-card[data-kind="reclamos"] .v14-go { border-color: #101820; }
html[data-theme="light"][data-contrast="high"] .v14-shortcut > .guide-icon { color: var(--v14-footer-muted); }
html[data-theme="light"][data-contrast="high"] .v14-privacy > .guide-icon { color: #007a4b; }
html[data-theme="dark"][data-contrast="high"] .v14-go { box-shadow: inset 0 0 0 1px currentColor; }
html[data-theme="dark"][data-contrast="high"] .v14-privacy > .guide-icon { color: #7fe2b0; }
html[data-contrast="high"] .home-v14 .v14-version { border-color: var(--v14-footer-control); }
html[data-theme][data-contrast="high"] .v14-card:hover { border-color: var(--v14-card-control); }
html[data-contrast="high"] .v14-step.is-first { border-color: var(--v14-first-ink); }
html[data-contrast="high"] .v14-steps > li + li::before { opacity: .85; }
html[data-contrast="high"] .v14-endpoints b { opacity: 1; }

@keyframes v14-rise { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@keyframes v14-drop { from { opacity: 0; transform: translateY(-100%); } to { opacity: 1; transform: none; } }
@keyframes v14-pop { from { opacity: 0; transform: scale(.55); } to { opacity: 1; transform: none; } }
@keyframes v14-draw { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes v14-shine { from { transform: translateX(-130%); } to { transform: translateX(130%); } }

@supports not (grid-template-rows: subgrid) {
  .v14-card { grid-row: auto; display: flex; flex-direction: column; gap: 24px; }
  .v14-path { margin-top: auto; }
  .v14-steps { grid-template-columns: repeat(var(--step-count), minmax(0, 1fr)); }
}
@media (min-width: 1001px) and (max-height: 850px) {
  .v14-main { gap: 24px; padding-top: 28px; padding-bottom: 28px; }
  .v14-card { padding: 28px; row-gap: 18px; }
  .v14-card-heading { gap: 10px; }
  .v14-card-title { font-size: clamp(1.6667rem, 3.1vw, 2.3333rem); }
  .v14-footer { padding-top: 20px; padding-bottom: 18px; }
  .v14-footer h2 { margin-bottom: 16px; }
  .v14-footer-bottom { margin-top: 18px; padding-top: 16px; }
}
@media (max-width: 1150px) and (min-width: 1001px) {
  .v14-card { --v14-step-size: 34px; --v14-step-gap: 10px; padding-inline: 24px; }
  .v14-credits { gap: 6px 14px; }
}
@media (max-width: 1000px) {
  .v14-cards { grid-template-columns: 1fr; gap: 24px; }
  .v14-card { grid-row: auto; grid-template-rows: auto; row-gap: 24px; }
  .v14-card-title { font-size: 2.3333rem; }
  .v14-shortcuts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .v14-footer-bottom { grid-template-columns: 1fr; gap: 18px; }
  .v14-credits { justify-content: start; }
  .v14-credits > span:last-child { text-align: left; }
}
@media (max-width: 600px) {
  body[data-view="home"] .topbar { flex-direction: row; align-items: center; padding-inline: 18px; }
  body[data-view="home"] .brand strong { font-size: .7778rem; }
  body[data-view="home"] .brand small { display: block; font-size: .6389rem; }
  body[data-view="home"] .topbar .top-actions { width: auto; }
  body[data-view="home"] .appearance-button .appearance-label { display: none; }
  body[data-view="home"] .top-actions .appearance-button { min-width: 34px; padding: 0 8px; }
  .v14-main { gap: 24px; padding: 28px 18px; }
  .v14-main h1 { font-size: 1.5rem; }
  .v14-card { --v14-step-size: 32px; --v14-step-gap: 6px; padding: 24px 18px; row-gap: 20px; }
  .v14-count { top: 18px; right: 18px; }
  .v14-card-title { font-size: 1.8889rem; }
  .v14-description { font-size: .9444rem; }
  .v14-path { grid-template-columns: repeat(var(--step-count), minmax(0, 1fr)); width: 100%; }
  .v14-step { font-size: .7222rem; }
  .v14-endpoints { font-size: .7222rem; }
  .v14-footer { padding: 24px 18px 22px; }
  .v14-shortcuts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .v14-credits { font-size: .6944rem; }
}

html[data-reduced-motion="true"] body[data-view="home"] .brand:hover .brand-mark,
html[data-reduced-motion="true"] body[data-view="home"] :is(.v14-card, .v14-shortcut):hover,
html[data-reduced-motion="true"] .v14-card:hover .v14-arrow,
html[data-reduced-motion="true"] .v14-shortcut:hover .v14-shortcut-arrow { transform: none !important; }
@media (prefers-reduced-motion: reduce) {
  html:not([data-reduced-motion]) body[data-view="home"] .brand:hover .brand-mark,
  html:not([data-reduced-motion]) body[data-view="home"] :is(.v14-card, .v14-shortcut):hover,
  html:not([data-reduced-motion]) .v14-card:hover .v14-arrow,
  html:not([data-reduced-motion]) .v14-shortcut:hover .v14-shortcut-arrow { transform: none !important; }
}
@media print {
  .home-v14 { min-height: 0; }
  .v14-card, .v14-shortcut { break-inside: avoid; }
}