/* First-pass visual refinement. Shared by the homepage and release history. */
:root {
  --muted: #62695e;
}
.site-header {
  padding-top: 0;
  background: rgba(248, 247, 242, .94);
  backdrop-filter: blur(16px);
  border-bottom: 1px solid var(--line);
}
.navigation {
  border: 0;
  border-radius: 0;
  background: transparent;
  backdrop-filter: none;
  padding-inline: 0;
  height: 80px;
  gap: 24px;
}
.nav-links { gap: 24px; }
.button,
.nav-download,
.button-outline { border-radius: 6px; }
.release-pill {
  border: 0;
  padding: 0;
  background: transparent;
  font-size: 12px;
  margin-bottom: 27px;
}
.hero-description { max-width: 455px; }
#hero-title em::after { content: none; }
.route-stat {
  transform: none;
  border-radius: 6px;
  box-shadow: 0 8px 24px #23272008;
}
.route-controls { border-radius: 8px; box-shadow: none; }
.preview-shell {
  padding: 0;
  border-radius: 8px;
  background: transparent;
  box-shadow: 0 16px 48px #23272008;
}
#product-preview { border-radius: 7px; }
#product-preview .tp-window { border-radius: 7px; max-width: none; }
.section-rule h2 {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
}
.preview-instruction { font-size: 12px; }
.trust-row { font-size: 12px; margin-top: 26px; gap: 48px; }
.eyebrow {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  margin-bottom: 18px;
}
.section-heading { gap: 40px; }
.section-heading h2,
.journey-heading h2,
.privacy-copy h2,
.download-heading h2,
.faq-heading h2 {
  font-size: clamp(32px, 3.8vw, 48px);
  line-height: 1.13;
  letter-spacing: -.045em;
  font-family: var(--font);
}
.section-heading > p { max-width: 310px; line-height: 1.7; }
.feature-grid { gap: 32px; }
.feature-card {
  border: 0;
  border-radius: 0;
  background: transparent;
  overflow: visible;
}
.feature-visual {
  border: 1px solid var(--line);
  border-radius: 6px;
}
.feature-body { padding: 24px 0 0; }
.feature-body h3 { font-size: 20px; }
.feature-body p { min-height: 0; font-size: 14px; line-height: 1.75; }
.feature-number { display: none; }
/* Keep the interactive illustrations and pointer lighting without lifting
   the entire text column or adding a second card-shaped shadow. */
.feature-card:hover { transform: none; }
body:not(.motion-paused) .feature-visual.playground-card:hover { box-shadow: none; }
.journey-section { background: #f0f1e9; }
.journey-heading { gap: 40px; }
.journey-heading p { max-width: 310px; font-size: 14px; line-height: 1.7; }
.journey-example { font-size: 10px; letter-spacing: .07em; }
.journey-readout { border-radius: 6px; box-shadow: none; }
.journey-readout-label { font-size: 10px; letter-spacing: .06em; }
.journey-detail { font-size: 12px; }
.journey-checkpoints strong { font-size: 16px; }
.journey-checkpoints small { font-size: 12px; }
.journey-hint { font-size: 12px; }
.privacy-copy p { font-size: 15px; max-width: 440px; }
.privacy-copy .text-link { font-size: 13px; }
.privacy-copy .eyebrow { color: #bdc9b0; }
.download-section {
  padding: 48px 0 32px;
  background: transparent;
  border-inline: 0;
  border-radius: 0;
}
.download-heading { text-align: left; }
.download-heading > p { max-width: 520px; }
.download-grid { gap: 24px; }
.download-card { border-radius: 6px; padding: 26px; background: #f1f2ea; }
.download-card.is-recommended { background: #f7f1e8; }
.download-alternative { font-size: 11px; }
.recommended { font-size: 8px; }
.installation-note { font-size: 12px; }
.version-link { font-size: 12px; }
.release-teaser {
  background: #f3f3ed;
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 30px;
}
.release-teaser:hover { background: #f5f1e9; }
.contributor-card,
.contributor-invitation {
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #f3f3ed;
  padding: 28px;
  transition: border-color .25s, background .25s;
}
.contributor-card:hover,
.contributor-invitation:hover { border-color: #d8c8b8; background: #f5f1e9; }
.invitation-plus { display: none; }
.contributor-invitation h3 { margin-top: 0; }
/* Lighting follows these understated panels. The same surface exists before,
   during, and after hover; a large floating shadow would break that continuity. */
body:not(.motion-paused) .contributor-card.playground-card:hover,
body:not(.motion-paused) .contributor-invitation.playground-card:hover,
body:not(.motion-paused) .release-teaser.playground-card:hover { box-shadow: none; }
.contribution-link { border-radius: 0; background: transparent; }
.footer-top > span {
  font-family: var(--font);
  font-size: 12px;
  color: var(--muted);
}
.footer-bottom { color: var(--muted); }
.mobile-download-note { display: none; }
.mobile-device .download-heading > p:not(.mobile-download-note) { display: none; }
.mobile-device .mobile-download-note { display: block; }
/* Release history uses the same quiet borders and useful type hierarchy. */
.release-page .release-hero h1 {
  font-size: clamp(46px, 6vw, 76px);
  font-family: var(--font);
  line-height: 1.05;
}
.release-entry,
.history-empty,
.release-search,
.history-expand,
.release-downloads a { border-radius: 6px; }
@media (max-width: 1100px) {
  .nav-links { gap: 18px; font-size: 12px; }
  .feature-grid { gap: 22px; }
  .feature-body h3 { font-size: 18px; }
  .feature-body p { font-size: 13px; }
  .download-card { padding: 22px 18px; }
}
@media (max-width: 800px) {
  .navigation { height: 68px; }
  .release-pill { font-size: 11px; }
  .hero-description { font-size: 14px; }
  .platform-note { font-size: 10px; }
  .trust-row { gap: 24px; font-size: 11px; }
  .section-heading { gap: 28px; }
  .section-heading > p { font-size: 13px; }
  .feature-grid { grid-template-columns: 1fr; gap: 32px; }
  .feature-card { display: grid; grid-template-columns: 1fr 1.15fr; gap: 28px; }
  .feature-body { padding: 8px 0; }
  .feature-body h3 { font-size: 20px; }
  .feature-body p { font-size: 14px; }
  .feature-visual { height: 185px; }
  .journey-heading p { max-width: 260px; }
  .download-grid { gap: 12px; }
  .os-download { padding-inline: 10px; }
  .recommended { font-size: 7px; }
  .download-alternative { font-size: 10px; }
}
@media (max-width: 640px) {
  .site-header { padding-top: 0; }
  .navigation { height: 66px; gap: 12px; }
  .hero { padding-top: 40px; }
  .release-pill { margin-bottom: 24px; }
  .hero-description { font-size: 14px; padding-inline: 0; }
  .hero-description,
  .platform-note { max-width: 355px; }
  .platform-note { margin-inline: auto; }
  .section-rule h2 { font-size: 10px; }
  .section-rule > span { font-size: 9px; }
  .preview-instruction { font-size: 11px; padding-inline: 12px; }
  .trust-row { font-size: 10px; gap: 14px 20px; }
  .eyebrow { font-size: 10px; }
  .section-heading > p { margin-top: 16px; }
  .feature-card { display: block; max-width: none; }
  .feature-body { padding: 20px 0 0; }
  .feature-visual { height: 182px; }
  .journey-heading { display: block; }
  .journey-heading p { max-width: none; margin-top: 16px; font-size: 13px; }
  .journey-checkpoints { gap: 10px; }
  .journey-checkpoints strong { font-size: 13px; }
  .journey-checkpoints small { font-size: 10px; line-height: 1.5; }
  .journey-hint { font-size: 11px; }
  .journey-example { font-size: 8px; }
  .privacy-copy p { font-size: 14px; }
  .privacy-copy .text-link { font-size: 12px; }
  .download-heading > p { padding-inline: 0; font-size: 14px; }
  .download-grid { gap: 14px; }
  .download-card { padding: 24px; }
  .release-teaser,
  .contributor-card,
  .contributor-invitation { padding: 22px; }
  .installation-note { text-align: left; font-size: 12px; }
  .recommended { font-size: 8px; }
  .download-alternative { font-size: 12px; }
  .footer-top > span { font-size: 12px; }
}
/* Shared phone controls stay easy to tap, including on the release page. */
@media (max-width: 1000px) {
  .menu-toggle { width: 44px; height: 44px; flex-shrink: 0; }
  .nav-links.is-open { gap: 4px; }
  .nav-links a { display: flex; align-items: center; min-height: 44px; width: 100%; }
}
@media (max-width: 640px) {
  .navigation { padding-inline: 0; gap: 8px; }
  .nav-download { min-height: 44px; font-size: 11px; padding-inline: 12px; }
  .hero-actions { flex-wrap: wrap; gap: 12px 18px; }
  .hero-actions .button { font-size: 12px; }
  .hero-actions .text-link { min-height: 44px; font-size: 12px; }
  .platform-note { font-size: 12px; line-height: 1.5; }
  .section-rule { flex-wrap: wrap; gap: 8px; }
  .section-rule h2,
  .section-rule > span { font-size: 11px; }
  .preview-instruction { font-size: 12px; }
  .preview-instruction > span { display: none; }
  body:not(.motion-paused) .preview-shell { transform: none; }
  .trust-row { font-size: 12px; }
  .route-controls { width: min(280px, 100%); padding: 8px; gap: 10px; }
  .route-play { width: 44px; height: 44px; }
  .route-scrub label { font-size: 11px; }
  .route-scrub label > span { display: none; }
  .route-scrub input { height: 28px; }
  .route-stat { bottom: 72px; }
  .journey-checkpoints small,
  .journey-hint { font-size: 12px; }
  .journey-example { font-size: 10px; }
  .mobile-download-note { display: block; }
  .download-heading > p:not(.mobile-download-note) { display: none; }
  .footer-bottom { font-size: 11px; line-height: 1.6; }
}
@media (max-width: 360px) {
  .nav-download { font-size: 10px; padding-inline: 9px; }
  .hero-actions .button { font-size: 12px; }
}
/* Bound decorative artwork so a landscape phone cannot zoom out the page. */
@media (min-width: 641px) and (max-width: 1100px) {
  .hero-art .terrain-art { width: 100%; height: auto; left: 0; top: 0; }
  .privacy-art { overflow: clip; }
}
@media (hover: none) and (pointer: coarse) {
  .route-play { width: 44px; height: 44px; }
  .route-scrub input { height: 28px; }
  #product-preview .tp-sidebar nav button,
  #product-preview .tp-filter-row button { min-height: 44px; }
}
