/* ==========================================================================
   HOSTPOKA — Design tokens, theme switch, utilities
   Brand colour: HOSTPOKA Orange · Developer: RAHAT
   ========================================================================== */
:root{
  --hp-brand:#f97316; --hp-brand-rgb:249,115,22; --hp-brand-600:#ea580c; --hp-brand-700:#c2410c; --hp-brand-300:#fdba74; --hp-brand-100:#ffedd5;
  --hp-accent-2:#f59e0b; --hp-grad-from:#fb923c; --hp-grad-to:#ea580c;
  --hp-hero-a:#1a0f08; --hp-hero-b:#2b1608; --hp-hero-c:#431e08; --hp-footer-a:#140c07; --hp-footer-b:#0a0604;
  --hp-logo-h:40px;
  --hp-glow:rgba(var(--hp-brand-rgb),.38);
  --hp-grad:linear-gradient(135deg,var(--hp-grad-from) 0%,var(--hp-brand) 45%,var(--hp-grad-to) 100%);
  --hp-grad-text:linear-gradient(100deg,var(--hp-grad-from),var(--hp-brand) 40%,var(--hp-accent-2) 75%,var(--hp-brand-600));
  --hp-radius:22px; --hp-radius-sm:14px;
  --hp-font:'Plus Jakarta Sans','Hind Siliguri',system-ui,-apple-system,'Segoe UI',sans-serif;
  --hp-display:'Sora','Hind Siliguri','Plus Jakarta Sans',system-ui,sans-serif;
  --hp-ease:cubic-bezier(.22,.8,.24,1);
  /* semantic (light) */
  --hp-bg:#fffaf5; --hp-surface:#ffffff; --hp-surface-2:#fff4e8;
  --hp-ink:#1c120b; --hp-muted:#76665a; --hp-line:rgba(var(--hp-brand-rgb),.18);
  --hp-shadow:0 1px 2px rgba(80,40,10,.05),0 14px 40px -12px rgba(120,53,15,.16);
  --hp-shadow-lg:0 30px 70px -24px rgba(194,65,12,.38);
  /* legacy variable bridge for page stylesheets */
  --primary:var(--hp-brand); --primary-hover:var(--hp-brand-600); --accent:var(--hp-brand-300);
  --bg-body:var(--hp-bg); --border-color:var(--hp-line);
}
html[data-theme="dark"]{
  --hp-bg:#0b0806; --hp-surface:#15100c; --hp-surface-2:#1e1610;
  --hp-ink:#fff4ea; --hp-muted:#b9a797; --hp-line:rgba(var(--hp-brand-rgb),.22);
  --hp-shadow:0 1px 0 rgba(255,255,255,.03) inset,0 18px 50px -18px rgba(0,0,0,.7);
  --hp-shadow-lg:0 30px 80px -20px rgba(var(--hp-brand-rgb),.35);
  --text-main:#f4e7da; --text-muted:#b9a797;
  color-scheme:dark;
}
html[data-theme="light"]{color-scheme:light}

/* ---- theme toggle ---- */
.hp-header-theme-slot{display:inline-flex;align-items:center;margin-left:12px;flex-shrink:0}
.hp-theme-toggle{display:inline-flex;gap:2px;padding:4px;border-radius:999px;background:var(--hp-surface-2);border:1px solid var(--hp-line)}
.hp-theme-toggle button{width:34px;height:34px;border:0;border-radius:50%;background:transparent;color:var(--hp-muted);cursor:pointer;display:grid;place-items:center;font-size:14px;transition:.3s var(--hp-ease)}
.hp-theme-toggle button:hover{color:var(--hp-brand)}
.hp-theme-toggle button.hp-active{background:var(--hp-grad);color:#fff;box-shadow:0 6px 16px -4px var(--hp-glow)}

/* ---- shared utilities ---- */
.hp-lock{overflow:hidden}
.skip-link{position:absolute;left:-9999px;top:8px;z-index:100000;background:var(--hp-brand);color:#fff;padding:10px 18px;border-radius:10px;font-weight:700}
.skip-link:focus{left:12px}
.hp-progress{position:fixed;inset:0 0 auto 0;height:3px;z-index:100001;background:var(--hp-grad);transform:scaleX(0);transform-origin:0 50%;pointer-events:none}
.hp-to-top{position:fixed;left:20px;bottom:24px;z-index:900;width:46px;height:46px;border-radius:14px;border:1px solid var(--hp-line);background:var(--hp-surface);color:var(--hp-brand);cursor:pointer;display:grid;place-items:center;box-shadow:var(--hp-shadow);opacity:0;transform:translateY(14px);pointer-events:none;transition:.35s var(--hp-ease)}
.hp-to-top.show{opacity:1;transform:none;pointer-events:auto}
.hp-to-top:hover{background:var(--hp-grad);color:#fff}
.hp-reveal{opacity:0;transform:translateY(26px);transition:opacity .8s var(--hp-ease) var(--hp-delay,0ms),transform .8s var(--hp-ease) var(--hp-delay,0ms)}
.hp-reveal.hp-in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.hp-reveal{opacity:1;transform:none}}
