* { box-sizing: border-box; }
html, body { margin: var(--radius); min-height: var(--full); }
body { overflow: hidden; background: var(--void); color: var(--ink); font-family: var(--font-body); }
a { color: inherit; }
.entry { position: relative; display: flex; width: var(--full); height: var(--viewport); overflow: hidden; }
.entry-panel { position: relative; display: grid; width: var(--panel-even); min-width: var(--radius); place-items: center; overflow: hidden; text-decoration: none; transition: width var(--duration) var(--ease); }
.entry:hover .entry-panel:hover { width: var(--panel-selected); }
.entry:hover .entry-panel:not(:hover) { width: var(--panel-rest); }
.entry-panel--atlas { background: var(--void); color: var(--paper); }
.entry-panel--store { background: var(--paper); color: var(--ink); }
.entry-atlas-still { position: absolute; inset: var(--radius); width: var(--full); height: var(--full); object-fit: cover; opacity: var(--opacity-image); }
.entry-content { position: relative; z-index: var(--rule); width: min(var(--full), var(--max-content)); padding: var(--space-52); text-align: center; }
.entry-kicker, .entry-cta { font-size: var(--size-11); font-weight: var(--weight-semibold); letter-spacing: var(--line-label); text-transform: uppercase; }
.entry-title { display: block; margin: var(--space-12) var(--radius) var(--space-20); font: var(--weight-regular) var(--size-76)/var(--line-tight) var(--font-display); font-variation-settings: "opsz" 144; }
.entry-description { display: block; max-width: 34rem; margin: var(--radius) auto; font-size: var(--size-15); line-height: var(--line-body); }
.entry-cta { display: inline-block; margin-top: var(--space-32); padding-bottom: var(--space-4); border-bottom: var(--rule) solid var(--clay); opacity: var(--radius); transform: translateY(var(--space-8)); transition: opacity var(--duration-fast) var(--ease), transform var(--duration-fast) var(--ease); }
.entry-panel:hover .entry-cta, .entry-panel:focus-visible .entry-cta { opacity: var(--full); transform: translateY(var(--radius)); }
.entry-panel:focus-visible { outline: var(--focus) solid var(--clay); outline-offset: calc(var(--focus) * -1); }
.entry-seam { position: absolute; z-index: 3; top: var(--half); left: var(--radius); width: var(--full); display: flex; align-items: center; pointer-events: none; transform: translateY(calc(var(--half) * -1)); }
.entry-seam::before, .entry-seam::after { content: ""; flex: 1; height: var(--rule); background: var(--ash); opacity: var(--opacity-muted); }
.entry-wordmark { padding: var(--space-8) var(--space-20); background: var(--paper); color: var(--ink); font: var(--weight-semibold) var(--size-13)/1 var(--font-display); letter-spacing: var(--line-label); }
@media (max-width: 720px) {
  .entry { flex-direction: column; }
  .entry-panel { width: var(--full); height: var(--half); }
  .entry:hover .entry-panel:hover, .entry:hover .entry-panel:not(:hover) { width: var(--full); }
  .entry-content { padding: var(--space-20); }
  .entry-title { font-size: var(--size-52); }
  .entry-description { font-size: var(--size-13); }
  .entry-cta { margin-top: var(--space-20); opacity: var(--full); transform: none; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; } }