/* Direct website route shell. Bypasses UMKM Digital OS boot for /website routes. */
:root { color-scheme: light; }
* { box-sizing: border-box; }
html { min-height: 100%; scroll-behavior: smooth; }
body.direct-site-body { margin: 0; min-height: 100vh; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #0f172a; background: linear-gradient(180deg, #f8fbff 0%, #eef6ff 100%); }
.direct-site-shell { min-height: 100vh; display: flex; flex-direction: column; }
.direct-site-header { position: sticky; top: 0; z-index: 10; min-height: 72px; padding: 0 clamp(14px, 3vw, 34px); display: flex; align-items: center; justify-content: space-between; gap: 18px; background: rgba(255,255,255,.86); border-bottom: 1px solid rgba(15,23,42,.08); backdrop-filter: blur(18px) saturate(145%); }
.direct-site-header .site-brand-mini { min-width: auto; text-decoration: none; }
.direct-site-content { width: 100%; flex: 1; padding: clamp(16px, 3vw, 34px); overflow: visible; }
.direct-site-content .website-page { width: min(1120px, 100%); }
.direct-site-loading { min-height: 56vh; display: grid; place-items: center; color: rgba(15,23,42,.58); font-weight: 800; }
.direct-site-footer { padding: 18px clamp(16px, 3vw, 34px) 28px; color: rgba(15,23,42,.55); font-size: 13px; text-align: center; }
.direct-site-footer a { color: #2563eb; text-decoration: none; font-weight: 850; }
@media (max-width: 820px) {
  .direct-site-header { align-items: flex-start; flex-direction: column; padding: calc(14px + env(safe-area-inset-top)) 14px 12px; }
  .direct-site-header .site-chrome-nav { width: 100%; justify-content: flex-start; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 2px; }
  .direct-site-header .site-chrome-nav a { flex: 0 0 auto; }
  .direct-site-content { padding: 14px; }
  .direct-site-content .site-hero-panel { min-height: 390px; border-radius: 24px; padding: 24px; }
  .direct-site-content .site-hero-panel h1 { font-size: clamp(34px, 13vw, 48px); }
  .direct-site-content .site-metric-grid,
  .direct-site-content .service-grid,
  .direct-site-content .portfolio-grid,
  .direct-site-content .pricing-grid { grid-template-columns: 1fr; }
  .direct-site-content .contact-panel { align-items: stretch; flex-direction: column; }
}