/* Standalone interactions and progressive enhancement. */
html { scroll-padding-top: 100px; }
body { overflow-x: hidden; }
[hidden] { display: none !important; }
.reveal { opacity: 1; transform: none; }
.js .reveal:not(.reveal-in) { opacity: 0; transform: translateY(26px); }
.skip-link { position: fixed; top: -70px; left: 20px; z-index: 100; padding: 12px 18px; color: #101010; background: #d1b16b; border-radius: 4px; }
.skip-link:focus { top: 10px; }
:focus-visible { outline: 2px solid hsl(var(--primary)); outline-offset: 5px; }
#mobile-menu { border-top: 1px solid hsl(var(--border)); padding: 12px 24px 24px; background: hsl(var(--background)); }
#mobile-menu a { display: block; padding: 13px 0; color: hsl(var(--foreground)); font-size: 12px; letter-spacing: .2em; text-transform: uppercase; }
#mobile-menu a:last-child { color: hsl(var(--primary)); }
#menu-toggle { min-width: 44px; min-height: 44px; display: flex; align-items: center; justify-content: center; }
[data-feature][aria-expanded="true"] .platform-detail { max-height: 80px; opacity: 1; }
.system-detail { display: grid; grid-template-rows: 0fr; opacity: 0; transition: grid-template-rows .3s, opacity .3s; }
[data-step][aria-expanded="true"] { border-color: hsl(var(--primary) / .7); background: hsl(var(--card)); box-shadow: 0 0 48px -16px hsl(var(--primary) / .4); }
[data-step][aria-expanded="true"] .system-detail { grid-template-rows: 1fr; opacity: 1; }
[data-step][aria-expanded="true"] h3 { color: hsl(var(--foreground)); }
[data-step][aria-expanded="true"] > div:first-child > div > svg { transform: rotate(0); color: hsl(var(--primary)); }
[data-step].flow-related { border-color: hsl(var(--primary) / .35); }
.system-detail a { visibility: hidden; }
[data-step][aria-expanded="true"] .system-detail a { visibility: visible; }
.flow-links p { font-size: 9px; text-transform: uppercase; letter-spacing: .22em; }
.flow-links a { display: inline-block; margin: 8px 6px 0 0; padding: 4px 12px; border: 1px solid hsl(var(--primary) / .3); border-radius: 999px; font-size: 12px; color: hsl(var(--foreground)); }
.flow-links a:hover { border-color: hsl(var(--primary)); color: hsl(var(--primary)); }
[data-card-step][aria-pressed="true"] h3 { color: hsl(var(--primary)); }
[data-card-step][aria-pressed="true"] > div > span { transform: scaleY(1) !important; }
.native-select { display: block; appearance: auto; color: hsl(var(--foreground)); color-scheme: dark; padding-right: 8px; }
.native-select option { color: hsl(var(--foreground)); background: hsl(var(--background)); }
#field-phone { min-width: 0; }
#form-status { color: hsl(var(--primary)); font-size: 13px; line-height: 1.6; }
#form-status[data-error="true"] { color: #ffb6a3; }
@media (min-width: 768px) { #mobile-menu, #menu-toggle { display: none !important; } }
@media (max-width: 639px) {
  #field-phoneCountry { width: 42%; max-width: 180px; font-size: 12px; }
  #system [data-step] { padding: 18px 14px; }
  #system [data-step] > div:first-child { gap: 12px; }
  #system h3 { font-size: 15px; }
  #top h1 { font-size: clamp(2rem, 8vw, 3rem); }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .js .reveal:not(.reveal-in) { opacity: 1; transform: none; }
}