*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#16213a;line-height:1.55;background:
radial-gradient(circle at top left,#ffe7cf 0,transparent 24%),
radial-gradient(circle at top right,#dff8e8 0,transparent 20%),
radial-gradient(circle at 50% 100%,#e9ddff 0,transparent 24%),
#fffaf4}
a{color:inherit}
.container{max-width:1080px;margin:0 auto;padding:0 18px}
.site-header{position:sticky;top:0;z-index:40;background:rgba(255,250,244,.82);backdrop-filter:blur(12px);border-bottom:1px solid #efe1d6}
.site-header .container{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:68px}
.header-stack{display:flex;flex-direction:column;gap:8px;flex:1 1 auto;min-width:0;width:100%}
.header-top{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0}
.logo{display:inline-flex;align-items:center;gap:8px;font-weight:800;text-decoration:none;color:#18253d;letter-spacing:-.02em;flex:0 0 auto}
.logo:before{content:"✦";display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,#7ee7b7,#60a5fa);color:#0f172a;font-size:13px;box-shadow:0 6px 14px rgba(96,165,250,.25)}
.lang-switch{display:inline-flex;align-items:center;gap:6px;flex:0 0 auto}
.lang-link{display:inline-flex;align-items:center;justify-content:center;min-width:42px;padding:8px 10px;border-radius:999px;text-decoration:none;font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;background:rgba(255,255,255,.86);border:1px solid #ead9ca;color:#5c6678;box-shadow:0 3px 10px rgba(236,165,112,.06);transition:transform .18s ease,filter .18s ease,box-shadow .18s ease}
.lang-link:hover{transform:translateY(-1px)}
.lang-link.active{background:linear-gradient(135deg,#ff7eb3,#ff9f68);border-color:transparent;color:#fff;box-shadow:0 10px 22px rgba(255,126,179,.2)}
.top-nav{flex:1 1 auto;overflow:hidden;min-width:0;padding:3px 0;mask-image:linear-gradient(to right,transparent 0,#000 4%,#000 96%,transparent 100%);-webkit-mask-image:linear-gradient(to right,transparent 0,#000 4%,#000 96%,transparent 100%)}
.nav-track{display:flex;align-items:center;gap:8px;width:max-content;animation:navLoop 18s linear infinite;will-change:transform}
.top-nav a{white-space:nowrap;text-decoration:none;font-size:14px;padding:9px 13px;border-radius:999px;flex:0 0 auto;background:rgba(255,255,255,.8);border:1px solid #ebdfd5;box-shadow:0 3px 10px rgba(236,165,112,.06);color:#4b5563;transition:transform .18s ease,filter .18s ease,box-shadow .18s ease}
.top-nav a:hover{transform:translateY(-1px);filter:saturate(1.03)}
.top-nav .nav-mint{background:linear-gradient(180deg,rgba(236,255,244,.92),rgba(255,255,255,.86));border-color:#d5ecdf;color:#35624c}
.top-nav .nav-sky{background:linear-gradient(180deg,rgba(239,246,255,.92),rgba(255,255,255,.86));border-color:#d8e5f7;color:#3f6292}
.top-nav .nav-lilac{background:linear-gradient(180deg,rgba(246,241,255,.94),rgba(255,255,255,.88));border-color:#e3dbf5;color:#66508c}
.top-nav .nav-lemon{background:linear-gradient(180deg,rgba(255,249,223,.94),rgba(255,255,255,.88));border-color:#efe2b0;color:#7a6720}
.top-nav .nav-coral{background:linear-gradient(180deg,rgba(255,241,234,.94),rgba(255,255,255,.88));border-color:#f1d8cc;color:#8f5a45}
.top-nav .nav-aqua{background:linear-gradient(180deg,rgba(236,252,255,.94),rgba(255,255,255,.88));border-color:#d7eef4;color:#3d6672}
.hero{padding:26px 0 18px}
.hero-shell{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(300px,.82fr);gap:18px;padding:28px;border:1px solid #f0ded0;border-radius:32px;background:linear-gradient(135deg,rgba(255,255,255,.82),rgba(255,245,238,.88));box-shadow:0 18px 40px rgba(236,165,112,.11);align-items:center}
.eyebrow{margin:0 0 10px;color:#8c5570;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
h1{margin:0 0 14px;font-size:clamp(32px,5vw,56px);line-height:1.02;letter-spacing:-.035em;color:#14213d}
h2{margin:0 0 14px;font-size:clamp(24px,3vw,34px);line-height:1.08;letter-spacing:-.03em;color:#14213d}
h3{font-size:20px;line-height:1.15;color:#13213a;margin:0 0 10px}
.lead{margin:0;max-width:760px;font-size:18px;color:#48566e}
.hero-actions,.quick-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.action,.chip,.route-link{display:inline-flex;align-items:center;justify-content:center;padding:11px 15px;border-radius:999px;text-decoration:none;font-weight:700;font-size:14px;border:1px solid transparent;transition:.18s ease}
.action.primary{background:linear-gradient(135deg,#ff7eb3,#ff9f68);color:#fff;box-shadow:0 12px 24px rgba(255,126,179,.24)}
.action.secondary{background:#fff;color:#1f2937;border-color:#edd8ca}
.chip{background:rgba(255,255,255,.76);color:#1f2937;border:1px solid #ead9ca;box-shadow:0 3px 8px rgba(255,170,120,.07)}
.action:hover,.chip:hover,.route-link:hover{transform:translateY(-1px)}
.hero-side{display:grid;gap:12px}
.hero-mascot-side{align-items:center;justify-items:center}
.hero-mascot-frame{position:relative;width:100%;min-height:360px;display:flex;align-items:flex-end;justify-content:center;padding:18px 10px 0;border-radius:28px;overflow:hidden;background:
radial-gradient(circle at 18% 18%,rgba(255,232,206,.9) 0,rgba(255,232,206,0) 26%),
radial-gradient(circle at 85% 20%,rgba(217,244,255,.82) 0,rgba(217,244,255,0) 28%),
linear-gradient(180deg,rgba(255,255,255,.72),rgba(255,248,242,.92));border:1px solid rgba(255,255,255,.72);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 18px 38px rgba(136,112,93,.1)}
.hero-mascot-frame:before{content:"";position:absolute;inset:auto 24px 14px;height:46px;border-radius:999px;background:radial-gradient(ellipse at center,rgba(26,39,61,.16) 0,rgba(26,39,61,0) 72%);filter:blur(6px)}
.hero-mascot{position:relative;display:block;max-width:100%;width:min(430px,100%);height:auto;z-index:1;filter:drop-shadow(0 18px 34px rgba(49,66,92,.14))}
.hero-note{padding:16px 16px 15px;border-radius:22px;border:1px solid rgba(255,255,255,.65);background:rgba(255,255,255,.66);backdrop-filter:blur(10px)}
.hero-note strong{display:block;margin-bottom:6px;font-size:15px;color:#16213a}
.hero-note span{display:block;font-size:14px;color:#556379}
.note-mint{box-shadow:0 10px 22px rgba(126,231,183,.22)}
.note-coral{box-shadow:0 10px 22px rgba(255,159,104,.18)}
.note-lilac{box-shadow:0 10px 22px rgba(169,139,255,.16)}
.section{padding:20px 0}
.section-head{margin-bottom:14px}
.section-kicker{margin:0 0 8px;color:#8c5570;font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.route-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.route-card{position:relative;padding:20px;border-radius:28px;border:1px solid rgba(255,255,255,.55);overflow:hidden;box-shadow:0 16px 32px rgba(94,60,34,.08)}
.route-card p{margin:0 0 16px;color:#44526b}
.route-card a{text-decoration:none}
.route-tag{display:inline-flex;margin-bottom:12px;padding:7px 11px;border-radius:999px;font-size:12px;font-weight:800;letter-spacing:.02em}
.route-link{background:rgba(255,255,255,.78);color:#16213a;border-color:rgba(22,33,58,.08)}
.route-mint{background:linear-gradient(135deg,#e6fff1,#d6fff4)}
.route-mint .route-tag{background:#b9f3d0;color:#165c3f}
.route-sky{background:linear-gradient(135deg,#ebf5ff,#ddf0ff)}
.route-sky .route-tag{background:#cfe6ff;color:#1e4e8a}
.route-lilac{background:linear-gradient(135deg,#f2ebff,#eadfff)}
.route-lilac .route-tag{background:#dfd0ff;color:#5a369a}
.route-lemon{background:linear-gradient(135deg,#fffad9,#fff1ba)}
.route-lemon .route-tag{background:#ffef98;color:#7a5b00}
.route-coral{background:linear-gradient(135deg,#ffe8de,#ffd7c4)}
.route-coral .route-tag{background:#ffc6a9;color:#8a3f1f}
.info-grid{display:grid;grid-template-columns:1.15fr .85fr .85fr;gap:16px}
.info-card{padding:22px;border-radius:28px;border:1px solid rgba(255,255,255,.55);background:rgba(255,255,255,.8);box-shadow:0 14px 30px rgba(94,60,34,.07)}
.info-card p{margin:0;color:#4a5870}
.info-card h3{font-size:18px}
.info-card-wide{background:linear-gradient(135deg,#ffffff,#fff2ec)}
.soft-mint{background:linear-gradient(135deg,#effff4,#dff8e8)}
.soft-lilac{background:linear-gradient(135deg,#f6f1ff,#ece3ff)}
.prose{background:rgba(255,255,255,.82);border:1px solid #f0ded0;border-radius:28px;padding:24px;box-shadow:0 14px 30px rgba(94,60,34,.07)}
.prose h2{margin-top:24px}
.prose h3{margin:18px 0 8px}
.prose p,.prose li{color:#4a5870}
.prose ul{padding-left:18px}
.page-card{background:rgba(255,255,255,.82);border:1px solid #f0ded0;border-radius:22px;padding:18px;box-shadow:0 12px 26px rgba(94,60,34,.06)}
.page-card h3{margin:0 0 8px}
.page-card p{margin:0;color:#4a5870}
.grid{display:grid;gap:16px}
.cards-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.site-footer{margin-top:26px;border-top:1px solid #efe1d6;background:rgba(255,250,244,.68)}
.site-footer .container{padding-top:18px;padding-bottom:28px;font-size:14px;color:#6b7280}
@keyframes navLoop{from{transform:translate3d(0,0,0)}to{transform:translate3d(calc(-33.3333% - 2.6667px),0,0)}}
@media (min-width:641px){
  .site-header .container{display:flex;align-items:flex-start;gap:14px;min-height:auto;padding-top:10px;padding-bottom:10px}
  .header-stack{display:flex;flex-direction:column;gap:10px;flex:1 1 auto;min-width:0;width:100%}
  .header-top{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%}
  .top-nav{width:100%;padding:4px 0 0;mask-image:linear-gradient(to right,transparent 0,#000 6%,#000 94%,transparent 100%);-webkit-mask-image:linear-gradient(to right,transparent 0,#000 6%,#000 94%,transparent 100%)}
  .top-nav:hover .nav-track{animation-play-state:paused}
}
@media (max-width:920px){
  .hero-shell,.info-grid{grid-template-columns:1fr}
  .route-grid,.cards-grid{grid-template-columns:1fr}
  .hero-mascot-frame{min-height:320px;padding-top:8px}
  .hero-mascot{width:min(380px,100%)}
}
@media (max-width:640px){
  .container{padding:0 14px}
  .site-header .container{align-items:flex-start;flex-direction:column;padding-top:10px;padding-bottom:10px}
  .header-stack{width:100%;display:flex;flex-direction:column;gap:8px}
  .header-top{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px}
  .hero{padding:16px 0 14px}
  .hero-shell,.prose,.page-card,.info-card,.route-card{padding:18px;border-radius:22px}
  .lead{font-size:16px}
  .top-nav{width:100%;padding:2px 0 0}
  .nav-track{animation-duration:18s}
  .top-nav a{font-size:13px;padding:8px 11px}
  .lang-link{min-width:40px;padding:7px 9px}
  .hero-actions{flex-direction:column;align-items:stretch}
  .action{width:100%}
  .route-link{width:100%}
  .hero-mascot-frame{min-height:280px;padding:10px 2px 0}
  .hero-mascot{width:min(330px,100%)}
  h1{font-size:36px}
  h2{font-size:26px}
  h3{font-size:18px}
}