:root { color-scheme: dark; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft JhengHei", "Noto Sans TC", sans-serif; color: #f2f7fa; background: #071522; }
* { box-sizing: border-box; }
body { margin: 0; min-width: 280px; min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; background: radial-gradient(ellipse at 50% 38%, #143849 0%, #0b2233 35%, #071522 72%); }
.atmosphere { position: fixed; inset: 0; overflow: hidden; pointer-events: none; }
.atmosphere::before { content: ""; position: absolute; width: 70vw; height: 70vw; left: -45vw; top: -25vw; border-radius: 50%; background: radial-gradient(circle, #1b687138, transparent 68%); }
.orbit { position: absolute; width: 74vmax; height: 74vmax; border: 1px solid #70b9cd0b; border-radius: 50%; right: -42vmax; bottom: -46vmax; }
.orbit-two { width: 94vmax; height: 94vmax; right: -52vmax; bottom: -56vmax; }
main { position: relative; flex: 1; display: grid; place-items: center; padding: 64px 24px 48px; }
.entry { width: min(100%, 780px); text-align: center; }
.logo { display: block; width: 250px; max-width: 100%; height: auto; margin: 0 auto; }
.accent { width: 32px; height: 2px; background: #70d4d6; margin: 34px auto 28px; }
h1 { font-family: "Segoe UI", Arial, sans-serif; font-size: clamp(44px, 8vw, 88px); line-height: 1.08; font-weight: 600; letter-spacing: .1em; padding-left: .1em; margin: 0; }
.brand-name { margin: 19px 0 0; padding-left: .28em; font-size: 19px; font-weight: 500; letter-spacing: .28em; color: #d3e7ee; }
.description { margin: 31px 0 30px; font-size: 15px; line-height: 1.95; color: #adbecb; }
.mobile-break { display: none; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 34px; min-height: 54px; padding: 14px 26px; border: 1px solid #ace9e9; border-radius: 7px; color: #082433; background: #b9eeea; font-weight: 600; font-size: 15px; text-decoration: none; transition: background-color .18s, transform .18s; }
.button span { font-size: 23px; line-height: 1; font-weight: 400; }
.button:hover { background: #d4faf5; transform: translateY(-2px); }
.button:focus-visible { outline: 3px solid #fff; outline-offset: 6px; }
.destination { margin: 14px 0 0; color: #8ea9b9; font-size: 12px; letter-spacing: .04em; }
footer { position: relative; display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap; padding: 20px 24px 28px; color: #879daa; font-size: 11px; letter-spacing: .04em; }
.footer-dot { color: #597485; }
@media (max-width: 480px) {
  main { padding: 40px 20px 36px; }
  .logo { width: 230px; }
  .accent { margin-top: 30px; margin-bottom: 27px; }
  h1 { font-size: clamp(38px, 11.6vw, 55px); }
  .brand-name { margin-top: 17px; font-size: 17px; }
  .description { max-width: 290px; margin: 27px auto; font-size: 14px; line-height: 1.9; text-wrap: pretty; }
  .mobile-break { display: inline; }
  footer { gap: 10px; font-size: 10px; padding-bottom: 22px; }
}
@media (prefers-reduced-motion: reduce) { .button { transition: none; } }