/* ============================================================
   Arvo 官网首页 —— 与程序主页（motio / tool）同一套深蓝排版体系
   复用 program-site.css 的 --ps-* 令牌，覆盖共享组件的默认外观
   ============================================================ */

html:has(body.home-site) { scroll-behavior: smooth; }

/* ---------- 页面基底：深蓝氛围光 ---------- */
body.home-site {
  background:
    radial-gradient(circle at 82% -4%, color-mix(in srgb, #8b73ff 13%, transparent), transparent 34%),
    radial-gradient(circle at 8% 22%, color-mix(in srgb, #42d6c7 8%, transparent), transparent 30%),
    radial-gradient(circle at 50% 108%, color-mix(in srgb, #4d8dff 10%, transparent), transparent 36%),
    var(--ps-bg);
}

/* ---------- 顶部导航：页内分区高亮 ---------- */
.home-site .ps-nav a[aria-current="page"] {
  color: var(--ps-text);
  background: var(--ps-pill-bg-hover);
  box-shadow: inset 0 0 0 1px var(--ps-line);
}

/* ---------- Hero：双程序入口卡 ---------- */
.home-site .home-hero-card {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
  align-items: center;
  gap: clamp(28px, 4vw, 56px);
}

.home-site .home-hero-actions { flex-wrap: wrap; }

.home-site .home-button-motio {
  background: linear-gradient(135deg, #8b73ff, #6a55e8);
  border-color: transparent;
  color: #fff;
}

.home-site .home-button-tool {
  border-color: color-mix(in srgb, #42d6c7 46%, var(--ps-line));
  color: var(--ps-text);
}

.home-site .home-button-tool:hover { border-color: #42d6c7; }

.home-site .ps-hero-actions .ps-button svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.home-hero-marks { display: grid; gap: 14px; }

.home-hero-mark {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 18px 20px;
  border: 1px solid var(--ps-line);
  border-radius: var(--ps-radius-md);
  background: color-mix(in srgb, var(--ps-surface) 72%, transparent);
  box-shadow: var(--ps-card-shadow);
  transition: transform 0.3s var(--ps-ease), border-color 0.3s var(--ps-ease), box-shadow 0.3s var(--ps-ease);
}

.home-hero-mark:hover {
  transform: translateY(-3px);
  border-color: color-mix(in srgb, var(--home-mark-accent, #8b73ff) 55%, var(--ps-line));
  box-shadow: 0 18px 44px color-mix(in srgb, var(--home-mark-accent, #8b73ff) 16%, transparent);
}

.home-hero-mark img {
  width: 46px;
  height: 46px;
  border-radius: 13px;
  flex: 0 0 46px;
}

.home-hero-mark strong { display: block; font-size: 16px; letter-spacing: -0.01em; }

.home-hero-mark small {
  display: block;
  margin-top: 3px;
  font-size: 12.5px;
  color: var(--ps-text-secondary);
}

/* ---------- 程序总览：快速选择台 ---------- */
.home-product-stage { margin-bottom: 26px; }

.home-site .family-stage-tabs {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.home-site .family-stage-tabs a {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 64px;
  padding: 12px 18px;
  border: 1px solid var(--ps-line);
  border-radius: var(--ps-radius-md);
  color: var(--ps-text-secondary);
  background: color-mix(in srgb, var(--ps-surface) 62%, transparent);
  backdrop-filter: blur(14px);
  transition: color 0.25s var(--ps-ease), border-color 0.25s var(--ps-ease), background 0.25s var(--ps-ease), transform 0.25s var(--ps-ease);
}

.home-site .family-stage-tabs a:hover {
  color: var(--ps-text);
  border-color: color-mix(in srgb, var(--tab-accent, #8b73ff) 52%, var(--ps-line));
  transform: translateY(-2px);
}

.home-site .family-stage-tabs a span {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.1em;
  color: var(--tab-accent, #8b73ff);
}

.home-site .family-stage-tabs a strong { font-size: 16px; letter-spacing: -0.01em; }

/* ---------- 程序卡片（app.js 渲染） ---------- */
.home-program-grid { display: grid; gap: 26px; }

.home-site .program-card {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1.28fr) minmax(340px, 0.72fr);
  overflow: hidden;
  min-height: 0;
  border: 1px solid var(--ps-line);
  border-radius: var(--ps-radius-lg);
  color: var(--ps-text);
  background:
    radial-gradient(circle at 88% 0%, color-mix(in srgb, var(--program-accent, #8b73ff) 12%, transparent), transparent 42%),
    color-mix(in srgb, var(--ps-surface) 84%, transparent);
  box-shadow: var(--ps-card-shadow);
  backdrop-filter: blur(18px);
  transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.3s var(--ps-ease), box-shadow 0.4s var(--ps-ease);
  scroll-margin-top: 96px;
}

.home-site .program-card:hover {
  transform: translateY(-4px);
  border-color: color-mix(in srgb, var(--program-accent, #8b73ff) 46%, var(--ps-line));
  box-shadow: 0 32px 80px color-mix(in srgb, var(--program-accent, #8b73ff) 14%, rgba(0, 2, 12, 0.35));
}

.home-site .cinema-program-reverse { grid-template-columns: minmax(340px, 0.72fr) minmax(0, 1.28fr); }

.home-site .cinema-program-reverse .program-preview { order: 2; }

/* 预览区：MacBook 实机截图 */
.home-site .program-preview {
  position: relative;
  display: grid;
  place-items: center;
  padding: clamp(26px, 3.6vw, 46px);
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 118%, color-mix(in srgb, var(--program-accent, #8b73ff) 16%, transparent), transparent 58%),
    color-mix(in srgb, var(--ps-bg-deep) 88%, var(--ps-surface));
}

/* 装饰伪元素不拦截点击（否则盖住截图切换圆点），子元素抬到装饰层之上 */
.home-site .program-preview::before,
.home-site .program-preview::after { z-index: 0; pointer-events: none; }
.home-site .program-preview > * { position: relative; z-index: 1; }

.home-site .cinema-program-number {
  position: absolute;
  top: 18px;
  left: 24px;
  z-index: 2;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.16em;
  color: color-mix(in srgb, var(--program-accent, #8b73ff) 80%, #fff);
}

.home-site .program-device-stage { position: relative; width: min(100%, 560px); }

.home-site .program-device-glow {
  position: absolute;
  inset: 12% -8% -16%;
  border-radius: 50%;
  background: radial-gradient(circle, color-mix(in srgb, var(--device-accent, #8b73ff) 26%, transparent), transparent 68%);
  filter: blur(10px);
  pointer-events: none;
}

.home-site .product-macbook { position: relative; margin: 0; }

.home-site .product-macbook-lid {
  padding: 3.2% 3% 4%;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-bottom: 0;
  border-radius: 18px 18px 0 0;
  background: linear-gradient(160deg, #3a4152, #171b26 58%, #232838);
  box-shadow: 0 24px 60px rgba(0, 2, 12, 0.5);
}

.home-site .product-macbook-bezel {
  position: relative;
  padding: 3.4% 2.6% 2.8%;
  border-radius: 10px;
  background: #05070d;
}

.home-site .product-macbook-camera {
  position: absolute;
  top: 1.3%;
  left: 50%;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #1d2636;
  box-shadow: inset 0 0 0 1.5px #0a0f18;
  transform: translateX(-50%);
}

.home-site .product-screen-viewport {
  overflow: hidden;
  border-radius: 6px;
  aspect-ratio: 16 / 10;
  background: #0b1220;
}

.home-site .product-screen-viewport img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

.home-site .product-macbook-hinge {
  height: 7px;
  background: linear-gradient(180deg, #4c5568, #232838);
  border-radius: 0 0 4px 4px;
}

.home-site .product-macbook-base {
  position: relative;
  height: 13px;
  margin-inline: -6%;
  border-radius: 0 0 14px 14px;
  background: linear-gradient(180deg, #585f73, #2a3040 62%, #3d4457);
}

.home-site .product-macbook-base span {
  position: absolute;
  top: 0;
  left: 50%;
  width: 17%;
  height: 4px;
  border-radius: 0 0 8px 8px;
  background: #191e2b;
  transform: translateX(-50%);
}

.home-site .program-device-meta {
  margin-top: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-size: 12.5px;
  color: var(--ps-text-secondary);
}

.home-site .program-device-meta i {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 6px;
  border-radius: 50%;
  background: var(--device-accent, #8b73ff);
  box-shadow: 0 0 8px var(--device-accent, #8b73ff);
}

.home-site .program-device-meta strong { color: var(--ps-text); font-weight: 600; }

.home-site .program-device-meta b { font-weight: 600; opacity: 0.72; }

.home-site .program-shot-strip {
  margin-top: 12px;
  display: flex;
  justify-content: center;
  gap: 10px;
}

.home-site .program-shot-dot {
  position: relative;
  width: 30px;
  min-width: 0;
  /* 扩大可点热区：视觉仍是小胶囊，但 30×26 区域都能命中，避免点不中无法切换 */
  height: 26px;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  cursor: pointer;
}

.home-site .program-shot-dot::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 26px;
  height: 8px;
  transform: translate(-50%, -50%);
  border-radius: 999px;
  background: color-mix(in srgb, var(--ps-text-secondary) 32%, transparent);
  transition: background 0.25s var(--ps-ease), width 0.25s var(--ps-ease);
}

.home-site .program-shot-dot span:not(.sr-only) { display: none; }

.home-site .program-shot-dot:hover::before { background: color-mix(in srgb, var(--device-accent, #8b73ff) 60%, transparent); }

.home-site .program-shot-dot.active::before {
  width: 40px;
  background: var(--device-accent, #8b73ff);
}

/* 信息区：紧凑排版，减少拥挤感 */
.home-site .program-body {
  display: flex;
  flex-direction: column;
  gap: 13px;
  padding: clamp(22px, 2.8vw, 32px) clamp(22px, 3vw, 36px);
}

.home-site .program-kicker {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.14em;
  color: var(--program-accent, #8b73ff);
}

.home-site .program-identity { display: flex; align-items: center; gap: 12px; }

.home-site .program-identity img { width: 40px; height: 40px; border-radius: 12px; }

.home-site .program-identity span {
  display: block;
  font-size: 12.5px;
  color: var(--ps-text-secondary);
}

.home-site .program-identity h3 { margin: 2px 0 0; font-size: 20px; letter-spacing: -0.02em; }

.home-site .program-identity h3 a:hover { color: var(--program-accent, #8b73ff); }

.home-site .program-body > p {
  margin: 0;
  font-size: 13.5px;
  line-height: 1.72;
  color: var(--ps-text-secondary);
}

.home-site .program-features { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }

.home-site .program-features span {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 11px;
  border: 1px solid var(--ps-line);
  border-radius: var(--ps-radius-sm);
  background: var(--ps-pill-bg);
  font-size: 12.5px;
}

.home-site .program-features i {
  font-style: normal;
  font-size: 11px;
  font-weight: 800;
  color: var(--program-accent, #8b73ff);
}

.home-site .program-footer {
  margin-top: auto;
  padding-top: 13px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: nowrap;
  gap: 14px;
  border-top: 1px solid var(--ps-line);
}

.home-site .program-footer > div:first-child { min-width: 0; }

.home-site .program-footer strong {
  display: block;
  font-size: 13.5px;
  /* 平台文案完整显示：不再用省略号截断 */
  white-space: normal;
  line-height: 1.45;
}

.home-site .program-footer > div > span {
  display: block;
  margin-top: 3px;
  font-size: 12.5px;
  color: var(--ps-text-secondary);
  white-space: normal;
  line-height: 1.45;
}

/* 底部操作区强制一行：文本 + 两个按钮同一行显示 */
.home-site .program-card-actions {
  display: flex;
  gap: 10px;
  flex: none;
  flex-wrap: nowrap;
}

.home-site .program-card-actions .button { white-space: nowrap; }

/* 卡片按钮统一为 ps 按钮观感（紧凑版） */
.home-site .program-card .button {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 9px 16px;
  border: 1px solid var(--ps-line-strong);
  border-radius: 999px;
  color: var(--ps-text);
  background: var(--ps-pill-bg);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.25s var(--ps-ease), border-color 0.25s var(--ps-ease), transform 0.25s var(--ps-ease);
}

.home-site .program-card .button:hover { background: var(--ps-pill-bg-hover); transform: translateY(-1px); }

.home-site .program-card .button-primary {
  border-color: transparent;
  color: #fff;
  background: linear-gradient(135deg, var(--program-accent, #8b73ff), color-mix(in srgb, var(--program-accent, #8b73ff) 72%, #020a22));
}

.home-site .program-card .button-primary:hover { filter: brightness(1.08); }

/* 下载保障条 */
.home-site .home-assurances {
  margin-top: 30px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.home-site .assurance-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 15px 18px;
  border: 1px solid var(--ps-line);
  border-radius: var(--ps-radius-md);
  background: color-mix(in srgb, var(--ps-surface) 70%, transparent);
  box-shadow: none;
  backdrop-filter: blur(14px);
}

.home-site .assurance-icon {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  flex: 0 0 40px;
  border-radius: 12px;
  color: var(--ps-text);
  background: var(--ps-pill-bg);
}

.home-site .assurance-icon svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.home-site .assurance-copy strong { display: block; font-size: 14px; }

.home-site .assurance-copy > span { display: block; margin-top: 2px; font-size: 12.5px; color: var(--ps-text-secondary); }

/* ---------- ClawKyNex 在线工具 ---------- */
.home-online-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  align-items: center;
  gap: clamp(28px, 4vw, 52px);
}

.home-online-actions { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }

/* ClawKyNex 主按钮收窄，避免过大 */
.home-online-actions .ps-button-primary { padding: 11px 24px; font-size: 15px; }

/* ps 按钮内联图标：限制尺寸并跟随文字颜色（修复默认黑色填充图标） */
.home-site .ps-button svg {
  width: 17px;
  height: 17px;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.home-online-hint { font-size: 13px; color: var(--ps-text-secondary); }

.home-online-platforms { margin-top: 22px; display: flex; flex-wrap: wrap; gap: 10px; }

.home-online-platforms span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  border: 1px solid var(--ps-line);
  border-radius: 999px;
  background: var(--ps-pill-bg);
  font-size: 13px;
}

.home-online-platforms b {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #42d6c7;
  box-shadow: 0 0 8px rgba(66, 214, 199, 0.8);
}

.home-online-preview { min-width: 0; }

.home-online-features {
  margin-top: 34px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.home-online-card {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 14px;
  min-height: 128px;
  padding: 20px;
  overflow: hidden;
  border: 1px solid var(--ps-line);
  border-radius: 22px;
  background: color-mix(in srgb, var(--ps-surface) 68%, transparent);
  backdrop-filter: blur(14px);
  transition: transform 0.3s var(--ps-ease), border-color 0.3s var(--ps-ease), background 0.3s var(--ps-ease);
}

.home-online-card:hover {
  transform: translateY(-3px);
  border-color: color-mix(in srgb, #42d6c7 46%, var(--ps-line));
}

.home-online-card strong { display: block; font-size: 14.5px; letter-spacing: -0.01em; }

.home-online-card p { margin: 6px 0 0; font-size: 12.5px; line-height: 1.6; color: var(--ps-text-secondary); }

.feature-glyph {
  position: relative;
  display: block;
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  border-radius: 13px;
  overflow: hidden;
}

.feature-glyph::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, var(--glyph-a), var(--glyph-b));
  opacity: 0.92;
}

.feature-glyph::after {
  content: "";
  position: absolute;
  inset: 11px;
  border: 2px solid rgba(255, 255, 255, 0.85);
  border-radius: 8px;
  mask-image: var(--glyph-mask, none);
  mask-size: contain;
  mask-repeat: no-repeat;
}

.feature-glyph-chat { --glyph-a: #42d6c7; --glyph-b: #2f9dff; --glyph-mask: linear-gradient(#000, #000); }
.feature-glyph-video { --glyph-a: #8b73ff; --glyph-b: #5a48e0; --glyph-mask: linear-gradient(60deg, #000 55%, transparent 56%); }
.feature-glyph-image { --glyph-a: #ff9d6b; --glyph-b: #ff5e7e; --glyph-mask: radial-gradient(circle at 32% 32%, #000 22%, transparent 23%), linear-gradient(135deg, transparent 42%, #000 43%); }
.feature-glyph-agent { --glyph-a: #5ce1a6; --glyph-b: #2fb7d8; --glyph-mask: radial-gradient(circle at 50% 38%, #000 30%, transparent 31%); }

/* ---------- 联系与服务入口 ---------- */
.home-contact-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.home-site .contact-card {
  align-items: center;
  padding: 22px 24px;
  border: 1px solid var(--ps-line);
  border-radius: var(--ps-radius-md);
  color: var(--ps-text);
  background: color-mix(in srgb, var(--ps-surface) 70%, transparent);
  backdrop-filter: blur(14px);
  box-shadow: var(--ps-card-shadow);
}

.home-site .contact-card::after { display: none; }

.home-site .contact-card:hover {
  transform: translateY(-3px);
  border-color: var(--ps-line-strong);
}

.home-site .contact-icon {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  flex: 0 0 46px;
  border-radius: 14px;
  color: var(--ps-text);
  border: 1px solid var(--ps-line);
  background: var(--ps-pill-bg);
}

.home-site .contact-icon svg {
  width: 23px;
  height: 23px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.home-site .contact-card h3 { margin: 0; font-size: 16.5px; letter-spacing: -0.01em; }

.home-site .contact-card p { margin: 5px 0 0; font-size: 13px; color: var(--ps-text-secondary); }

.home-site .contact-card > div > span {
  display: inline-block;
  margin-top: 10px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--program-accent, #8b73ff);
}

/* 社交平台卡：沿用共享网格，统一为深蓝玻璃 */
.home-site .home-social-grid { margin-top: 16px; }

.home-site .social-contact-card {
  border: 1px solid var(--ps-line);
  border-radius: 18px;
  color: var(--ps-text);
  background: color-mix(in srgb, var(--ps-surface) 70%, transparent);
  backdrop-filter: blur(14px);
  box-shadow: none;
}

.home-site .social-contact-card:hover { border-color: var(--ps-line-strong); transform: translateY(-2px); }

.home-site .social-contact-card[aria-pressed="true"] {
  border-color: color-mix(in srgb, var(--social-border, #8b73ff) 65%, var(--ps-line));
  background: color-mix(in srgb, var(--ps-surface) 86%, transparent);
}

.home-site .social-letter {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  border-radius: 13px;
  background: var(--ps-pill-bg);
}

.home-site .social-letter img { width: 26px; height: 26px; object-fit: contain; }

.home-site .social-contact-card strong { display: block; font-size: 14.5px; }

.home-site .social-contact-card small { display: block; margin-top: 3px; font-size: 12px; color: var(--ps-text-secondary); }

/* ---------- 快捷工具栏与工具弹窗：融入深蓝背景（修复浅色玻璃与深色页面割裂） ---------- */
.home-site .quick-toolbar {
  border-color: var(--ps-line);
  background: color-mix(in srgb, var(--ps-surface) 82%, transparent);
  box-shadow: var(--ps-card-shadow);
  backdrop-filter: blur(22px) saturate(140%);
}

.home-site .quick-toolbar button { color: var(--ps-text-secondary); }

.home-site .quick-toolbar button + button { border-top-color: var(--ps-line); }

.home-site .quick-toolbar button:hover,
.home-site .quick-toolbar button:focus-visible {
  color: var(--ps-text);
  background: var(--ps-pill-bg-hover);
}

.home-site .tool-dialog { color: var(--ps-text); background: transparent; }

.home-site .tool-dialog-shell {
  border: 1px solid var(--ps-line);
  color: var(--ps-text);
  background: linear-gradient(150deg, color-mix(in srgb, var(--ps-surface) 94%, transparent), color-mix(in srgb, var(--ps-bg) 92%, transparent));
  backdrop-filter: blur(20px);
}

.home-site .tool-dialog-heading h2 { color: var(--ps-text); }

.home-site .tool-dialog-heading p,
.home-site .site-search-empty { color: var(--ps-text-secondary); }

.home-site .site-search-field { background: var(--ps-pill-bg); border-color: var(--ps-line); color: var(--ps-text); }

.home-site .site-search-field input { color: var(--ps-text); }

.home-site .site-search-results a { color: var(--ps-text); border-color: var(--ps-line); }

.home-site .site-search-results a:hover { background: var(--ps-pill-bg-hover); }

.home-site .creator-contact-card { border-color: var(--ps-line); background: var(--ps-pill-bg); color: var(--ps-text); }

.home-site .creator-contact-card span { color: var(--ps-text-secondary); }

.home-site .creator-feedback-link { color: #42d6c7; }

/* ---------- 页脚产品入口（app.js 注入）与整体融合 ---------- */
.home-site .ps-footer .footer-product-hub a {
  border-color: var(--ps-line);
  background: color-mix(in srgb, var(--ps-surface) 72%, transparent);
  backdrop-filter: blur(12px);
}

/* ---------- 响应式 ---------- */
@media (max-width: 960px) {
  .home-site .home-hero-card { grid-template-columns: 1fr; }

  .home-site .program-card,
  .home-site .cinema-program-reverse { grid-template-columns: 1fr; }

  .home-site .cinema-program-reverse .program-preview { order: 0; }

  .home-online-grid { grid-template-columns: 1fr; }

  .home-online-features { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .home-site .home-assurances { grid-template-columns: 1fr; }

  .home-contact-grid { grid-template-columns: 1fr; }

  .home-site .program-features { grid-template-columns: 1fr; }

  .home-site .program-footer { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 560px) {
  .home-online-features { grid-template-columns: 1fr; }

  .home-site .family-stage-tabs { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  html:has(body.home-site) { scroll-behavior: auto; }

  .home-site .program-card,
  .home-site .home-online-card,
  .home-site .contact-card,
  .home-site .social-contact-card,
  .home-hero-mark { transition: none; }
}