/* Third art direction. The original mint and platform palettes remain available. */
html[data-theme="mixed"] {
  --ink: #10374b;
  --blue: #2d5ff3;
  --muted: #577381;
  --cream: #f1faf8;
  --line: #d4e7e8;
  --hero-ink: #f8fdff;
  --hero-muted: #c2d8ec;
  --hero-accent: #a0edda;
  --hp-accent: #166e85;
  --hp-soft: #edf9f7;
  --hp-tint: #c4f1e2;
  --hp-navy: #092c55;
  --hp-muted: #577381;
}
html[data-theme="mixed"] .hero {
  background: radial-gradient(ellipse at 87% 28%, #187ead70, transparent 55%),
    radial-gradient(ellipse at 63% 105%, #41dab744, transparent 55%),
    linear-gradient(125deg, #061d4a 10%, #123a7b 61%, #124b70);
}
html[data-theme="mixed"] .site-header {
  color: #effbff;
  background: #092d59ed;
  border-color: #c4efff30;
  box-shadow: 0 8px 32px #04132d20;
}
html[data-theme="mixed"] .brand > span > span { color: #a2e8e0; }
html[data-theme="mixed"] #main-nav > a:hover { color: #a3f0dd; }
html[data-theme="mixed"] .button-blue { background: #c0f1df; color: #0b344e; }
html[data-theme="mixed"] .button-blue:hover { background: #dcfff0; }
html[data-theme="mixed"] .hero .button-orange {
  color: #102f47; background: #baf1dc; border-color: #d5fff0;
  box-shadow: 0 10px 32px #04183340;
}
html[data-theme="mixed"] h1 > span {
  color: #a4ecdc;
  background: linear-gradient(105deg, #a8d9ff 4%, #b9f3df 84%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
html[data-theme="mixed"] .hero-eyebrow,
html[data-theme="mixed"] .hero-notes { color: #c5e1ed; }
html[data-theme="mixed"] .live-dot { background: #94ebca; box-shadow: 0 0 0 4px #94ebca16; }
html[data-theme="mixed"] .hero-notes .icon { color: #9de8d8; }
html[data-theme="mixed"] .hero-secondary:hover { color: #a9eddd; }
html[data-theme="mixed"] .hero-orbits i { border-color: #abdedb26; }
html[data-theme="mixed"] .art-halo { background-image: radial-gradient(#a1d4ff45 1.2px, transparent 1.2px); }
html[data-theme="mixed"] .hero-aurora span { background: #2b6aff35; }
html[data-theme="mixed"] .hero-aurora span:nth-child(2) { background: #48d6b321; }
html[data-theme="mixed"] .hero-bottom > span,
html[data-theme="mixed"] .motion-toggle,
html[data-theme="mixed"] .art-caption { color: #c0dce8; }
html[data-theme="mixed"] .hero-bottom > a { color: #dbf4f7; border-color: #bedeee44; }
html[data-theme="mixed"] .phone-shell {
  box-shadow: 2px 4px 0 #a5c6dc, 7px 9px 0 #385f85, 14px 35px 50px #00103165, inset 0 0 0 1px #fff;
}
html[data-theme="mixed"] .companion-phone {
  box-shadow: -3px 3px 0 #a0c5cc, -7px 8px 0 #3b6c79, -15px 30px 45px #00113344;
}
html[data-theme="mixed"] .hp-capabilities {
  background: #d1f2e8; border-color: #b9e1d8;
}
html[data-theme="mixed"] .hp-capability-set { color: #225163; }
html[data-theme="mixed"] .hp-capability-set i { color: #2466b8; }
html[data-theme="mixed"] .hp-platform { background: #f1f9fd; }
html[data-theme="mixed"] .hp-publishers { background: #f8fcfa; }
html[data-theme="mixed"] .hp-principles { background: #e6f4fc; }
html[data-theme="mixed"] .hp-integration { background: #f8fbfa; }
html[data-theme="mixed"] .hp-faq { background: #fff; }

/* Mixed intentionally reuses the original Mint & Sky footer without recolouring it. */
html[data-theme="mixed"] .hp-footer {
  --ink: #113749;
  --hp-accent: #087f83;
  --hp-navy: #0b3549;
  --hp-muted: #66818b;
  --hp-soft: #edf7f5;
  --hp-tint: #c6eee1;
  --line: #deeaed;
}

/* Comparison controls are preview-only, keyboard-friendly and fit 320px. */
.hp-footer-nav h3 { font-size: 11px; }
.hp-footer-nav > a { min-height: 44px; font-size: 16px; max-width: 230px; }
.hp-footer-brand > p { font-size: 15px; }
.hp-footer-email { font-size: 14px; }
.theme-dock { padding: 12px; border-radius: 17px; }
.theme-dock-label { font-size: 9px; letter-spacing: 1.3px; margin: 1px 5px 8px; }
.theme-options { gap: 4px; }
.theme-options button { min-height: 43px; padding: 10px 12px; font-size: 12px; }
.theme-options button[aria-pressed="true"] { border-color: #a7c4d0; background: #e6f1f5; }
.mixed-swatch { background: conic-gradient(#204fad 0deg 120deg, #94d5ff 120deg 240deg, #a3e4c8 240deg); }
body:has(.theme-dock:not([hidden])) .hp-footer-bottom { padding-bottom: 110px; }
@media (max-width: 959px) {
  html[data-theme="mixed"] #main-nav { background: #092d59; border-color: #486f8a; }
}
@media (max-width: 699px) {
  /* On mobile, show the product before the longer explanation. */
  .story-product { grid-template-columns: minmax(0, 1fr); }
  .story-product-copy { display: contents; }
  .story-product-copy > *, .story-product .story-wall-stage { grid-column: 1; }
  .story-product .story-tabs { grid-row: 1; margin-bottom: 0; }
  .story-product .story-wall-stage { grid-row: 2; }
  .story-product .story-product-panels { grid-row: 3; }
  .story-product-copy > .story-text-link { grid-row: 4; }
  .theme-dock { right: 10px; bottom: 10px; padding: 9px; max-width: calc(100vw - 20px); }
  .theme-dock-label { font-size: 8px; }
  .theme-options button { padding: 8px 9px; font-size: 10px; gap: 6px; }
  .theme-options i { width: 12px; height: 12px; flex-shrink: 0; }
}
@media (max-width: 359px) {
  .theme-dock { right: 6px; bottom: 6px; max-width: calc(100vw - 12px); padding: 7px; }
  .theme-options { gap: 0; }
  .theme-options button { font-size: 9px; padding-inline: 7px; gap: 4px; }
}