:root{--blue: #2570A6;--blue-deep: #174E76;--blue-soft: #D6E7F3;--bg: #EDF2F6;--card: #FFFFFF;--ink: #14212C;--muted: #60758A;--line: #D5DFE8;--latin: "Familjen Grotesk", -apple-system, sans-serif;--cjk: -apple-system, "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", sans-serif;--ease: cubic-bezier(.16, 1, .3, 1);--spring: cubic-bezier(.34, 1.56, .64, 1);--bouncy: linear(0, .056, .203, .408, .638, .865, 1.063, 1.217, 1.319, 1.367, 1.367, 1.327, 1.259, 1.177, 1.09, 1.011, .945, .897, .87, .861, .87, .89, .919, .951, .982, 1.009, 1.031, 1.044, 1.051, 1.051, 1.045, 1.036, 1.024, 1.012, 1.001, .992, .986, .982, .981, .982, .985, .989, .993, .998, 1.001, 1.004, 1.006, 1.007, 1);--snappy: linear(0, .029, .105, .217, .351, .496, .641, .779, .903, 1.009, 1.095, 1.159, 1.203, 1.227, 1.234, 1.226, 1.208, 1.182, 1.15, 1.116, 1.082, 1.05, 1.021, .997, .977, .962, .952, .947, .945, .947, .952, .958, .965, .973, .981, .989, .995, 1.001, 1.006, 1.009, 1.011, 1.012, 1.013, 1.012, 1.011, 1.01, 1.008, 1.006, 1)}*{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--ink);font-family:var(--cjk);line-height:1.6;min-height:100dvh;overflow-x:hidden}#root{min-height:100dvh;display:flex;flex-direction:column;position:relative;z-index:1}a{color:inherit;text-decoration:none}img{display:block}body:before{content:"";position:fixed;inset:-40%;z-index:0;pointer-events:none;background:repeating-linear-gradient(-35deg,transparent 0 44px,rgba(37,112,166,.035) 44px 50px)}.top,.hero,.grid,.foot{width:100%;max-width:1000px;margin:0 auto;padding-left:20px;padding-right:20px}.top{padding-top:24px;padding-bottom:24px;display:flex;align-items:center}.mark{display:inline-flex;align-items:center;gap:10px;color:var(--blue)}.mark-logo{width:28px;height:28px}.mark span{font-family:var(--latin);font-weight:700;letter-spacing:.08em;font-size:13px}main{flex:1}.hero{padding-top:56px;padding-bottom:44px;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:40px}.hop{position:relative;display:grid;place-items:center}.hero-logo{width:clamp(140px,22vw,220px);height:auto;color:var(--blue);overflow:visible}.hop-shadow{position:absolute;left:50%;bottom:2%;width:64%;height:5%;margin-left:-32%;border-radius:50%;background:#174e7624;pointer-events:none}.wordmark{font-family:var(--latin);font-weight:700;letter-spacing:-.03em;line-height:.95;font-size:clamp(34px,7.4vw,88px);color:var(--blue-deep);white-space:nowrap}.tagline{margin-top:16px;font-size:17px;color:var(--muted)}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding-bottom:16px}.card{position:relative;display:block;padding:6px;background:var(--card);border:1px solid var(--line);border-radius:22px;box-shadow:0 1px #2570a60a,0 24px 48px -32px #174e7640;transition:transform .5s var(--ease),box-shadow .5s var(--ease);-webkit-tap-highlight-color:transparent}.card-in{display:block}.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 10px 14px 14px}.card h2{font-size:18px;font-weight:700;letter-spacing:-.01em;line-height:1.3}.go{flex:none;width:36px;height:36px;border-radius:999px;display:grid;place-items:center;background:var(--bg);color:var(--blue);transition:background .3s,color .3s,transform .5s var(--spring)}.arrow{width:14px;height:14px}.card-shot{display:block;overflow:hidden;border-radius:16px;background:var(--blue-soft);aspect-ratio:1200 / 630}.card-shot img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}@media (hover: hover){.card:hover{transform:translateY(-4px);box-shadow:0 1px #2570a60a,0 32px 56px -30px #174e7659}.card:hover .go{background:var(--blue);color:#fff;transform:rotate(45deg)}.card:hover .card-shot img{transform:scale(1.04)}}.card:active{transform:scale(.975);transition-duration:.15s}.foot{padding-top:72px;padding-bottom:40px;display:flex;flex-direction:column;align-items:center;gap:20px}.threads{position:relative;width:48px;height:48px;border-radius:999px;display:grid;place-items:center;color:var(--ink);background:var(--card);border:1px solid var(--line);transition:transform .3s var(--ease),color .3s}.threads-icon{width:22px;height:22px}.threads:hover{color:var(--blue);transform:translateY(-2px)}.brand{display:flex;align-items:center;gap:8px;color:var(--blue);font-family:var(--latin);font-weight:700;letter-spacing:.1em;font-size:12px}.brand-logo{width:18px;height:18px}@media (prefers-reduced-motion: no-preference){.hero>*,.card,.foot>*{opacity:0;transform:translateY(14px);animation:up .9s var(--ease) forwards}.hero>:nth-child(2){animation-delay:.1s}.card{animation-delay:calc(.2s + var(--i) * .08s)}.foot>*{animation-delay:.5s}@keyframes up{to{opacity:1;transform:none}}.hero-logo .drop{animation:drop 4.2s infinite backwards}.hero-logo .drop:nth-child(3){animation-delay:0s}.hero-logo .drop:nth-child(2){animation-delay:.1s}.hero-logo .drop:nth-child(1){animation-delay:.2s}@keyframes drop{0%{transform:translateY(-300px);opacity:0;animation-timing-function:cubic-bezier(.5,0,1,.6)}1%{opacity:1;animation-timing-function:cubic-bezier(.5,0,1,.6)}7.6%{transform:translateY(0);animation-timing-function:cubic-bezier(.2,.6,.4,1)}8.8%{transform:translateY(16px);animation-timing-function:var(--snappy)}20.2%,84.5%{transform:none;opacity:1;animation-timing-function:cubic-bezier(.5,0,.9,.3)}91.7%{transform:translateY(70px);opacity:0}to{transform:translateY(-300px);opacity:0}}.hero-logo{transform-origin:50% 88%;animation:hop 4.2s infinite}@keyframes hop{0%,29.8%{transform:none;animation-timing-function:cubic-bezier(.3,0,.4,1)}34.5%{transform:scale(1.1,.86);animation-timing-function:cubic-bezier(.2,.8,.3,1)}41%{transform:translateY(-16%) scale(.93,1.08);animation-timing-function:cubic-bezier(.6,0,.9,.4)}46.4%{transform:scale(1.14,.82);animation-timing-function:var(--bouncy)}59.5%,to{transform:none}}.hop-shadow{animation:hop-shadow 4.2s infinite}@keyframes hop-shadow{0%{transform:scaleX(.4);opacity:0;animation-timing-function:var(--ease)}20.2%,29.8%{transform:none;opacity:1;animation-timing-function:cubic-bezier(.3,0,.4,1)}34.5%{transform:scaleX(1.08);animation-timing-function:cubic-bezier(.2,.8,.3,1)}41%{transform:scaleX(.62);opacity:.5;animation-timing-function:cubic-bezier(.6,0,.9,.4)}46.4%{transform:scaleX(1.12);opacity:1;animation-timing-function:var(--bouncy)}59.5%,84.5%{transform:none;opacity:1;animation-timing-function:cubic-bezier(.5,0,.9,.3)}91.7%,to{transform:scaleX(.4);opacity:0}}.hero-logo .dash{transform-box:fill-box;transform-origin:left center;animation:dash 4.2s infinite}.hero-logo .drop:nth-child(2) .dash{animation-delay:.07s}.hero-logo .drop:nth-child(3) .dash{animation-delay:.14s}@keyframes dash{0%,61.9%{transform:none;animation-timing-function:cubic-bezier(.55,0,.8,.2)}65.7%{transform:translate(34px) scaleX(1.12);animation-timing-function:var(--bouncy)}77.6%,to{transform:none}}body:before{animation:drift 9s linear infinite}@keyframes drift{to{transform:translate(-28.7px,-41px)}}.card-in{animation:bob 5.4s ease-in-out infinite;animation-delay:calc(1.2s + var(--i) * .9s)}.card:hover .card-in{animation-play-state:paused}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-4px)}}.arrow{animation:nudge 4.2s var(--spring) infinite;animation-delay:calc(1.6s + var(--i) * .6s)}@keyframes nudge{0%,88%,to{transform:translate(0)}91%{transform:translate(2px,-2px)}95%{transform:translate(-.5px,.5px)}}.shine{background:linear-gradient(100deg,var(--blue-deep) 42%,#4E93C7 50%,var(--blue-deep) 58%);background-size:300% 100%;background-position:100% 0;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 7s var(--ease) infinite}@keyframes shine{0%,70%{background-position:100% 0}to{background-position:0 0}}}@media (max-width: 960px){.grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 640px){.hero{grid-template-columns:1fr;gap:20px;padding-top:36px;padding-bottom:32px}.hero-logo{width:120px}.grid{grid-template-columns:1fr;gap:14px}.card h2{font-size:17px}.foot{padding-top:56px}}