/* Cross-site resilience, accessibility, and responsive fixes. */

/* Preserve the original Amity visual system. This file loads last, so keep
   resilience fixes from accidentally recoloring the site. */
:root{
  --bg:#f5f0e8;
  --paper:#fffdf9;
  --ink:#181313;
  --muted:#6f665f;
  --line:rgba(24,19,19,.13);
  --panel:#24131f;
  --accent:#ff6b55;
}
body{background:var(--bg)!important;color:var(--ink)}
header{background:rgba(245,240,232,.86)!important}
nav a{color:#514943}
.pill-btn.dark{border-color:var(--ink)!important;background:var(--ink)!important;color:#fff!important}

/* Reference-matched Amity mark. Keep CSS and HTML on the same asset so the
   last-loaded stylesheet cannot silently replace the header logo. */
.mark-image{
  background-image:url("/amity-logo-20261001.svg?v=20261001-ref-2")!important;
  background-size:contain!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
}
.logo img.mark,
.demo-mark{
  display:block;
  object-fit:contain;
  content:url("/amity-logo-20261001.svg?v=20261001-ref-2")!important;
}

:where(a,button,input,select,textarea,summary):focus-visible{
  outline:3px solid rgba(255,107,85,.48);
  outline-offset:3px;
}

.skip-link{
  position:fixed;
  left:14px;
  top:10px;
  z-index:1000;
  padding:10px 14px;
  border-radius:10px;
  background:#181313;
  color:#fff;
  font-size:13px;
  font-weight:750;
  text-decoration:none;
  transform:translateY(-160%);
  transition:transform .16s ease;
}
.skip-link:focus{transform:translateY(0)}

.pill-btn{
  min-height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

button:disabled{
  cursor:wait;
  opacity:.68;
}

.hp-field{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  clip:rect(0 0 0 0)!important;
  clip-path:inset(50%)!important;
  white-space:nowrap!important;
}

.status[data-state="success"]{font-weight:700}
.status[data-state="error"]{font-weight:700}

/* Keep the waitlist as the large, saturated color moment in the page. */
.wait{
  background:linear-gradient(135deg,#ff6b55 0%,#ff8067 58%,#ff9a78 100%)!important;
}
.wait .eyebrow.light{color:#fff!important}
.wait p{color:rgba(255,255,255,.94)!important}

.footer-note{
  color:#6f655e!important;
  font-size:12px!important;
}

/* Keep the full site navigable on phones instead of hiding every page link. */
@media(max-width:900px){
  header .nav{
    height:auto;
    min-height:72px;
    padding:10px 0 8px;
    flex-wrap:wrap;
    row-gap:7px;
  }
  header .nav>nav{
    width:100%;
    gap:8px;
    overflow-x:auto;
    overscroll-behavior-inline:contain;
    scrollbar-width:none;
    padding:1px 0 3px;
    white-space:nowrap;
  }
  header .nav>nav::-webkit-scrollbar{display:none}
  header .nav>nav a,
  header .nav>nav a:not(.pill-btn){
    display:inline-flex!important;
    flex:0 0 auto;
    align-items:center;
    min-height:38px;
    padding:8px 10px;
    border-radius:999px;
  }
  header .nav>nav a:not(.pill-btn){
    background:rgba(255,255,255,.42);
    border:1px solid rgba(24,19,19,.08);
  }
  header .nav>nav .pill-btn{min-height:38px;padding:8px 12px}
}

/* Mobile performance: don't make first paint wait for reveal JS, and avoid
   expensive compositing effects on lower-power phone GPUs. */
@media(max-width:720px){
  header{
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
  .reveal{
    opacity:1!important;
    transform:none!important;
    transition:none!important;
  }
  .trajectory-shell,
  .thesis-panel,
  .preview-card{
    box-shadow:none!important;
  }
  .trajectory-shell::before{filter:none!important}
}

@media(max-width:620px){
  .section{padding:72px 0}
  .footer{align-items:flex-start;flex-direction:column;gap:10px}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
  .reveal{opacity:1!important;transform:none!important}
}
