/* kps-shell — SSOT · YG tour–inspired (hairline, tracking, white) */
:root{
  --kps-bg:#ffffff;
  --kps-card:#ffffff;
  --kps-primary:#681DC7;
  --kps-primary-dark:#4d009e;
  --kps-primary-tint:#f7f7f7;
  --kps-primary-soft:#f2f2f2;
  --kps-ink:#111111;
  --kps-muted:#6b6b6b;
  --kps-muted-2:#8a8a8a;
  --kps-line:#e8e8e8;
  --kps-line-soft:#e8e8e8;
  --kps-inverse:#111111;
  --kps-ok:#0f766e;
  --kps-ok-bg:#ecfdf5;
  --kps-err:#b91c1c;
  --kps-err-bg:#fef2f2;
  --kps-on-primary:#ffffff;

  --kps-on-surface:var(--kps-ink);
  --kps-on-surface-variant:var(--kps-muted);
  --kps-outline:var(--kps-line);

  --kps-radius-card:0;
  --kps-radius-img:0;
  --kps-radius-sm:0;
  --kps-radius-md:0;
  --kps-radius-pill:0;

  --kps-space-xs:8px;
  --kps-space-sm:12px;
  --kps-space-md:16px;
  --kps-space-lg:24px;
  --kps-space-xl:32px;
  --kps-space-2xl:48px;

  --kps-motion-fast:150ms;
  --kps-motion-base:220ms;
  --kps-motion-slow:300ms;
  --kps-ease:cubic-bezier(.22,1,.36,1);

  --kps-shadow-card:none;
  --kps-shadow-lift:none;
  --kps-focus-ring:0 0 0 2px rgba(17,17,17,.25);

  --kps-container:1120px;
  --kps-gutter:24px;
  --kps-touch:44px;
}

body.kps-shell-page{
  font-family:"Plus Jakarta Sans",system-ui,sans-serif;
  color:var(--kps-ink);
  background:var(--kps-bg);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
.kps-shell-main{padding-top:88px;min-height:50vh}
.kps-shell-wrap{max-width:var(--kps-container);margin:0 auto;padding:0 var(--kps-gutter)}

:focus-visible{
  outline:2px solid var(--kps-ink);
  outline-offset:2px;
}
:focus:not(:focus-visible){outline:none}

.glass,.glass-card{
  background:#fff;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  border:1px solid var(--kps-line);
  border-radius:0;
  box-shadow:none;
  transition:opacity var(--kps-motion-fast) var(--kps-ease);
}
.glass-card:hover{
  transform:none;
  box-shadow:none;
  opacity:.92;
}
.ambient-shadow,.hero-shadow{box-shadow:none !important}
.material-symbols-outlined{font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24}

/* ── Shared components ── */
.kps-card{
  background:var(--kps-card);
  border:1px solid var(--kps-line);
  border-radius:0;
  box-shadow:none;
  overflow:hidden;
}
.kps-chip,.fg-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 16px;
  border-radius:0;
  border:1px solid var(--kps-line);
  color:var(--kps-muted);
  font-size:11px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  text-decoration:none;
  background:transparent;
  cursor:pointer;
  white-space:nowrap;
  flex-shrink:0;
  transition:color var(--kps-motion-fast) ease,border-color var(--kps-motion-fast) ease,background var(--kps-motion-fast) ease;
}
.kps-chip:hover,.fg-chip:hover{
  border-color:var(--kps-ink);
  color:var(--kps-ink);
}
.kps-chip.is-active,.fg-chip.is-active{
  background:var(--kps-ink);
  border-color:var(--kps-ink);
  color:#fff;
}
.kps-chip.is-active:hover,.fg-chip.is-active:hover{color:#fff}

.kps-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:44px;
  padding:12px 18px;
  font-size:11px;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  line-height:1.25;
  text-decoration:none;
  border-radius:0;
  cursor:pointer;
  transition:background var(--kps-motion-fast) ease,border-color var(--kps-motion-fast) ease,color var(--kps-motion-fast) ease;
}
.kps-btn-solid{
  background:var(--kps-ink);
  color:#fff;
  border:1px solid var(--kps-ink);
  box-shadow:none;
}
.kps-btn-solid:hover{background:#fff;color:var(--kps-ink);filter:none}
.kps-btn-ghost{
  background:#fff;
  color:var(--kps-ink);
  border:1px solid var(--kps-ink);
}
.kps-btn-ghost:hover{
  border-color:var(--kps-ink);
  color:var(--kps-ink);
  background:#f7f7f7;
}

/* LIVE dual CTA */
.kps-dual-cta{align-items:stretch}
.kps-cta-stay,.kps-cta-ticket{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:48px;padding:14px 20px;font-weight:700;font-size:11px;
  letter-spacing:.14em;text-transform:uppercase;text-decoration:none;line-height:1.25;text-align:center;
  border-radius:0;
  transition:background var(--kps-motion-fast) ease,border-color var(--kps-motion-fast) ease,color var(--kps-motion-fast) ease;
}
.kps-cta-stay{
  flex:1.15;
  background:var(--kps-ink);
  color:#fff;border:1px solid var(--kps-ink);box-shadow:none;
}
.kps-cta-stay::before{content:"home";font-family:"Material Symbols Outlined";font-weight:400;font-size:1.1rem;opacity:.9;text-transform:none;letter-spacing:0}
.kps-cta-stay:hover{background:#fff;color:var(--kps-ink);transform:none;box-shadow:none}
.kps-cta-ticket{
  flex:1;background:#fff;color:var(--kps-ink);
  border:1px solid var(--kps-ink);box-shadow:none;
}
.kps-cta-ticket::before{content:"confirmation_number";font-family:"Material Symbols Outlined";font-weight:400;font-size:1.05rem;color:var(--kps-ink);text-transform:none;letter-spacing:0}
.kps-cta-ticket::after{content:"↗";font-size:.85rem;opacity:.55;margin-left:2px}
.kps-cta-ticket:hover{border-color:var(--kps-ink);background:#f7f7f7;color:var(--kps-ink)}
@media(max-width:639px){
  .kps-cta-stay,.kps-cta-ticket{width:100%}
}

@media (prefers-reduced-motion: reduce){
  .glass-card:hover,.kps-cta-stay:hover{transform:none}
  .kps-chip,.fg-chip,.kps-btn,.kps-cta-stay,.kps-cta-ticket,.glass,.glass-card{
    transition:none !important;
  }
}

/* header chrome */
.kps-chrome-header{position:fixed;top:0;left:0;width:100%;z-index:50;background:#fff;backdrop-filter:none;border-bottom:1px solid var(--kps-line)}
.kps-chrome-header.is-scrolled{box-shadow:none}
.kps-chrome-nav{max-width:var(--kps-container);margin:0 auto;padding:16px var(--kps-gutter);display:flex;justify-content:space-between;align-items:center;gap:16px}
.kps-chrome-brand{font-size:1.15rem;font-weight:800;color:var(--kps-ink);letter-spacing:.18em;text-transform:uppercase;text-decoration:none}
.kps-chrome-links{display:none;align-items:center;gap:28px}
@media(min-width:768px){.kps-chrome-links{display:flex}}
.kps-chrome-link,.kps-nav-link{
  display:inline-flex;align-items:center;height:28px;box-sizing:border-box;
  font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;line-height:20px;
  color:var(--kps-muted);text-decoration:none;
  border-bottom:1px solid transparent;padding:0 0 2px;
  transition:color var(--kps-motion-fast) ease,border-color var(--kps-motion-fast) ease;
}
.kps-chrome-link:hover,.kps-nav-link:hover{color:var(--kps-ink)}
.kps-chrome-link.is-active,.kps-nav-link.is-active{color:var(--kps-ink);border-bottom-color:var(--kps-ink)}
.kps-chrome-actions{display:flex;align-items:center;gap:12px}
.kps-chrome-cta{display:none;background:var(--kps-ink);color:#fff;padding:10px 18px;border-radius:0;border:1px solid var(--kps-ink);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;transition:background var(--kps-motion-fast) ease,color var(--kps-motion-fast) ease}
@media(min-width:640px){.kps-chrome-cta{display:inline-flex}}
.kps-chrome-cta:hover{background:#fff;color:var(--kps-ink);box-shadow:none}
.kps-chrome-menu-btn{display:inline-flex;padding:8px;border-radius:0;border:1px solid var(--kps-line);background:#fff;cursor:pointer;min-width:var(--kps-touch);min-height:var(--kps-touch);align-items:center;justify-content:center}
@media(min-width:768px){.kps-chrome-menu-btn{display:none}}

#nav-lang{position:relative}
#lang-dropdown{display:none;position:absolute;right:0;top:calc(100% + 8px);min-width:140px;background:#fff;border:1px solid var(--kps-line);border-radius:0;box-shadow:none;padding:6px;z-index:60}
#lang-dropdown.open{display:block}
#lang-dropdown .lang-option{display:block;width:100%;text-align:left;padding:8px 12px;border:0;background:transparent;border-radius:0;font-size:12px;font-weight:600;color:var(--kps-ink);cursor:pointer;font-family:inherit}
#lang-dropdown .lang-option:hover{background:#f7f7f7;color:var(--kps-ink)}
.kps-lang-trigger{font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--kps-muted);background:none;border:0;cursor:pointer;padding:4px 8px;font-family:inherit}

#mobile-menu{display:none;position:fixed;inset:72px 0 auto 0;background:#fff;border-bottom:1px solid var(--kps-line);padding:16px 24px 24px;z-index:40;flex-direction:column;gap:4px}
#mobile-menu.open{display:flex}
#mobile-menu .mobile-link{display:block;padding:14px 4px;font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--kps-ink);text-decoration:none;border-radius:0;border-bottom:1px solid var(--kps-line)}
#mobile-menu .mobile-link:hover{background:transparent;color:var(--kps-muted)}
#mobile-menu .mobile-link.is-active{color:var(--kps-ink)}

/* footer */
.kps-chrome-footer{background:var(--kps-inverse);color:#fff;padding:64px 0;border-top:1px solid rgba(255,255,255,.08);margin-top:0}
.kps-chrome-footer a{color:rgba(255,255,255,.55);text-decoration:none}
.kps-chrome-footer a:hover{color:#fff}
.kps-footer-grid{max-width:var(--kps-container);margin:0 auto;padding:0 var(--kps-gutter);display:grid;grid-template-columns:1fr;gap:40px}
@media(min-width:768px){.kps-footer-grid{grid-template-columns:1.4fr 1fr 1fr 1fr}}
.kps-footer-brand{font-size:1.1rem;font-weight:800;color:#fff;letter-spacing:.18em;text-transform:uppercase;display:block;margin-bottom:16px;text-decoration:none}
.kps-footer-blurb{font-size:12px;line-height:1.5;opacity:.6;max-width:280px;margin-bottom:12px}
.kps-footer-disc{font-size:12px;line-height:1.5;opacity:.4;max-width:320px}
.kps-footer-col h4{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;margin:0 0 16px;color:#fff}
.kps-footer-col ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.kps-footer-col li a{font-size:12px}
.kps-footer-bottom{max-width:var(--kps-container);margin:48px auto 0;padding:24px var(--kps-gutter) 0;border-top:1px solid rgba(255,255,255,.08);display:flex;flex-direction:column;gap:8px;font-size:11px;letter-spacing:.06em;opacity:.4}
@media(min-width:768px){.kps-footer-bottom{flex-direction:row;justify-content:space-between}}

/* content tone helpers */
.kps-shell-page .wrap{max-width:var(--kps-container);margin:0 auto;padding:0 var(--kps-gutter)}
.kps-shell-page .hub-card,
.kps-shell-page .guide-cta,
.kps-shell-page .guide-step,
.kps-shell-page .arch-card,
.kps-shell-page .guide-sticky{
  border-radius:0 !important;
  box-shadow:none !important;
  border-color:var(--kps-line) !important;
}
.kps-shell-page .story.is-active,
.kps-shell-page .story[aria-current="page"]{
  border-color:var(--kps-ink) !important;
  color:var(--kps-ink) !important;
  background:#f7f7f7 !important;
}
.kps-shell-page a.hub-card .go,
.kps-shell-page .guide-step-link,
.kps-shell-page .arch-link{color:var(--kps-ink) !important}
.kps-shell-page .guide-sticky-btn,
.kps-shell-page .btn-accent,
.kps-shell-page .hero-search-btn{
  background:var(--kps-ink) !important;
  border-radius:0 !important;
  box-shadow:none !important;
}

/* Tailwind / utility overrides on shell pages */
.kps-shell-page .rounded-full,
.kps-shell-page .rounded-xl,
.kps-shell-page .rounded-lg,
.kps-shell-page .rounded-2xl,
.kps-shell-page .rounded-\[2rem\],
.kps-shell-page [class*="rounded-"]{
  border-radius:0 !important;
}
.kps-shell-page .shadow-xl,
.kps-shell-page .shadow-md,
.kps-shell-page .shadow-lg,
.kps-shell-page .ambient-shadow,
.kps-shell-page .hero-shadow{
  box-shadow:none !important;
}
.kps-shell-page .bg-primary\/5,
.kps-shell-page .bg-primary\/10,
.kps-shell-page .bg-secondary\/10{
  background:#f7f7f7 !important;
}
.kps-shell-page .text-primary,
.kps-shell-page .text-secondary{
  color:var(--kps-ink) !important;
}
.kps-shell-page .border-outline-variant\/20,
.kps-shell-page .border-outline-variant\/30,
.kps-shell-page .border-outline\/70{
  border-color:var(--kps-line) !important;
}
.kps-shell-page .bg-primary,
.kps-shell-page .hover\:bg-primary:hover,
.kps-shell-page .hover\:bg-primary-container:hover{
  background:var(--kps-ink) !important;
}
.kps-shell-page .text-on-primary{color:#fff !important}

/* hide legacy sticky nav when chrome present */
.kps-shell-page > nav.nav-inner,
.kps-shell-page > nav:not(.kps-chrome-nav){display:none !important}

.kps-chrome-header nav.kps-chrome-nav,
header.kps-chrome-header > nav{
  position:relative !important;
  top:auto !important;
  height:auto !important;
  min-height:0 !important;
  background:transparent !important;
  backdrop-filter:none !important;
  border:none !important;
  border-bottom:none !important;
  display:flex !important;
  max-width:var(--kps-container) !important;
  margin:0 auto !important;
  padding:16px var(--kps-gutter) !important;
  z-index:auto !important;
}
.kps-chrome-header{
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  width:100% !important;
  z-index:1000 !important;
  height:auto !important;
}
