/* GUAN Partners visual refresh — shared across the public site and calculator. */
:root {
  --vp-ink: #f3f0e9;
  --vp-muted: #b4afa5;
  --vp-faint: #868177;
  --vp-canvas: #171715;
  --vp-surface: #201f1c;
  --vp-surface-2: #272622;
  --vp-line: rgba(232, 224, 210, .13);
  --vp-line-strong: rgba(232, 224, 210, .23);
  --vp-sand: #c8b79d;
  --vp-sand-soft: #39342d;
  --vp-shadow: 0 24px 70px rgba(0,0,0,.22);
  --vp-radius: 22px;
  --vp-sans: 'Manrope', Inter, system-ui, sans-serif;
  --paper: var(--vp-canvas);
  --paper-deep: var(--vp-surface);
  --ink: var(--vp-ink);
  --muted: var(--vp-muted);
  --line: var(--vp-line);
  --acid: var(--vp-sand);
  --acid-soft: var(--vp-sand-soft);
  --graphite: #25241f;
  --graphite-soft: #302e28;
  --shadow: var(--vp-shadow);
  color-scheme: dark;
}
html[data-theme='light'] {
  --vp-ink: #292824;
  --vp-muted: #6f6b63;
  --vp-faint: #928d82;
  --vp-canvas: #f0ede6;
  --vp-surface: #faf8f3;
  --vp-surface-2: #e8e3d9;
  --vp-line: rgba(45,42,36,.12);
  --vp-line-strong: rgba(45,42,36,.22);
  --vp-sand: #a38c6c;
  --vp-sand-soft: #e9e1d5;
  --vp-shadow: 0 24px 70px rgba(54,48,38,.09);
  --graphite: #2b2924;
  --graphite-soft: #39362f;
  color-scheme: light;
}
html, body, body.site-body { background-color: var(--vp-canvas); color: var(--vp-ink); }
body.site-body {
  background-image: radial-gradient(ellipse at 83% 3%, rgba(200,183,157,.085), transparent 34rem),
    radial-gradient(ellipse at 0 46%, rgba(200,183,157,.035), transparent 28rem),
    linear-gradient(180deg, var(--vp-canvas), var(--vp-canvas));
  font-family: var(--vp-sans);
}
html[data-theme='light'] body.site-body {
  background-image: radial-gradient(ellipse at 87% 2%, rgba(163,140,108,.13), transparent 34rem),
    linear-gradient(180deg, #f3f0e9, var(--vp-canvas));
}
body:not(.site-body) { background: var(--vp-canvas); color: var(--vp-ink); }
.site-shell, .app.guan-shell { color: var(--vp-ink); }
.site-header {
  max-width: 1500px; padding: 16px clamp(22px, 4.3vw, 66px);
  margin: 10px auto 0; border: 1px solid var(--vp-line); border-radius: 18px;
  background: color-mix(in srgb, var(--vp-surface) 78%, transparent);
  box-shadow: 0 8px 32px rgba(0,0,0,.08); backdrop-filter: blur(18px);
}
.site-nav { gap: clamp(12px, 1.65vw, 25px); color: var(--vp-muted); }
.site-nav a { transition: color .2s ease, opacity .2s ease; }
.site-nav a:hover, .site-nav a.is-active { color: var(--vp-ink); }
.nav-calculator, .theme-toggle {
  border: 1px solid var(--vp-line-strong); border-radius: 999px;
  background: var(--vp-surface-2); color: var(--vp-ink) !important;
}
.nav-calculator { padding: 11px 16px; font: 600 11px/1 var(--vp-sans); }
.nav-calculator:hover, .theme-toggle:hover { border-color: var(--vp-sand); background: var(--vp-sand-soft); }
.site-body .site-logo, .site-body .footer-logo {
  width: clamp(172px, 16vw, 205px) !important; height: 44px !important;
  padding: 5px 8px; border-radius: 7px; background: #fff;
}
.site-body .site-logo::before, .site-body .footer-logo::before {
  background-image: url('/assets/guan-partners.png') !important;
  filter: none !important; inset: 5px 8px; width: calc(100% - 16px); height: calc(100% - 10px);
}
.site-body .footer-logo { width: 188px !important; height: 42px !important; }
.site-main { max-width: 1500px; }
.section-frame { margin-left: clamp(22px, 5.3vw, 80px); margin-right: clamp(22px, 5.3vw, 80px); }
.hero { border-top: 1px solid var(--vp-line); gap: clamp(34px, 5vw, 78px); }
.hero-copy h1, .page-hero h1, .not-found h1 {
  font-family: var(--vp-sans); font-weight: 600; letter-spacing: -.065em;
}
.hero-copy h1 em, .page-hero h1 em, .not-found h1 em { color: var(--vp-sand); }
.hero-lead, .page-hero > p, .section-intro p { color: var(--vp-muted); }
.eyebrow, .micro-label, .footer-label, .visual-label { color: var(--vp-sand); }
.hero-visual, .page-visual, .service-map, .request-form, .account-card,
.legal-sheet, .case-placeholder, .contact-card, .about-surface,
.process-board, .brief-device, .business-screen, .faq-index,
.scenario-card, .scenario-aside, .calc-teaser-card, .proof-item,
.access-cards article, .legal-document, .brief-paper {
  border: 1px solid var(--vp-line); border-radius: var(--vp-radius);
  background: linear-gradient(145deg, var(--vp-surface-2), var(--vp-surface));
  box-shadow: var(--vp-shadow);
}
.hero-visual { overflow: hidden; }
.hero-visual::after { opacity: .24; }
.button { border-radius: 999px; font-family: var(--vp-sans); font-size: 12px; font-weight: 650; }
.button-dark { background: var(--vp-ink); color: var(--vp-canvas); }
.button-dark:hover { background: var(--vp-sand); color: #211f1b; }
.button-acid { background: var(--vp-sand); color: #25221d; }
.button-acid:hover { background: #dccbb0; }
.button-quiet { border-color: var(--vp-line-strong); color: var(--vp-ink); }
.button-quiet:hover { border-color: var(--vp-sand); background: var(--vp-sand-soft); }
.service-card, .client-flow article, .business-grid article,
.principle-grid article, .case-placeholder, .faq-list details,
.private-notes > div, .process-row, .proof-item, .case-sheet,
.account-integration, .contact-aside, .legal-meta, .step-card {
  border-color: var(--vp-line); border-radius: 18px;
  background: linear-gradient(140deg, color-mix(in srgb, var(--vp-surface-2) 82%, transparent), var(--vp-surface));
}
.service-card h3, .client-flow h3, .business-grid h3,
.section-intro h2, .service-map h2, .split-cta h2,
.account-card h2, .contact-card h2 { font-family: var(--vp-sans); letter-spacing: -.04em; }
.service-card:hover, .client-flow article:hover, .business-grid article:hover,
.principle-grid article:hover, .case-placeholder:hover { border-color: var(--vp-line-strong); }
.site-footer { border-top-color: var(--vp-line); background: color-mix(in srgb, var(--vp-surface) 70%, transparent); }
.site-footer a:hover { color: var(--vp-sand); }
.footer-bottom { border-top-color: var(--vp-line); color: var(--vp-faint); }
.site-body :is(input, select, textarea) {
  border-color: var(--vp-line-strong); background: var(--vp-canvas); color: var(--vp-ink);
}
.site-body :is(input, select, textarea):focus { border-color: var(--vp-sand); box-shadow: 0 0 0 4px color-mix(in srgb, var(--vp-sand) 18%, transparent); }
.site-body :is(.form-status, .legal-status) { border-radius: 14px; }
.site-body .signal-dot { background: var(--vp-sand); box-shadow: 0 0 0 5px color-mix(in srgb, var(--vp-sand) 16%, transparent); }

/* Calculator: calmer workspace, clearer hierarchy and warm focus states. */
.topbar {
  margin: 10px auto 0; width: calc(100% - 44px); max-width: 1500px;
  padding: 10px clamp(14px, 2.7vw, 36px); border: 1px solid var(--vp-line);
  border-radius: 18px; background: color-mix(in srgb, var(--vp-surface) 84%, transparent);
  box-shadow: 0 8px 32px rgba(0,0,0,.08); backdrop-filter: blur(18px);
}
.brand-button::before { border-radius: 7px; }
.app.guan-shell .global-links .nav,
.app.guan-shell .theme-toggle { border-radius: 999px; }
.global-links .nav.active { background: var(--vp-sand-soft); border-color: var(--vp-line-strong); }
.app.guan-shell :is(.panel, .visual-studio, .module-context, .workspace-visual,
  .historyitem, .settingcard, .visual-card, .resultcard) {
  border-color: var(--vp-line); border-radius: var(--vp-radius);
  box-shadow: var(--vp-shadow);
}
.app.guan-shell :is(.panel, .visual-studio, .module-context, .workspace-visual,
  .historyitem, .settingcard, .visual-card, .resultcard) { background: var(--vp-surface); }
.app.guan-shell :is(.panelhead, .panel-header) { border-color: var(--vp-line); }
.app.guan-shell :is(.primary, .secondary, .danger, .upload, .backup-upload,
  .server-check, .quick button, .rounding button, .deliverychoices button) { border-radius: 13px; }
.app.guan-shell :is(.inputwrap, input, select, textarea, .sourcebox,
  .source-input input, .mode select, .mode input, .mini, .textarea,
  .scalar-input input, .catalog-toolbar input, .catalog-toolbar select) {
  border-radius: 12px; transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.app.guan-shell :is(input, select, textarea):focus { border-color: var(--vp-sand); box-shadow: 0 0 0 4px color-mix(in srgb, var(--vp-sand) 16%, transparent); }
.app.guan-shell .primary { background: var(--vp-sand); color: #24221e; }
.app.guan-shell .primary:hover { background: #ddcbb0; transform: translateY(-1px); }
.app.guan-shell .secondary { border-color: var(--vp-line-strong); }
.app.guan-shell .secondary:hover { border-color: var(--vp-sand); }
.app.guan-shell .step, .app.guan-shell .progress-step { border-color: var(--vp-line); }
.app.guan-shell .saved, .app.guan-shell .muted, .app.guan-shell .field > span { color: var(--vp-muted); }
.app.guan-shell :is(.recognized, .manual-card, .snapshot, .empty,
  .delivery, .calcpreview, .ratebar, .historyitem, .settingline) { border-color: var(--vp-line); }
.app.guan-shell .toast { border: 1px solid var(--vp-line-strong); border-radius: 14px; box-shadow: var(--vp-shadow); }

/* Small, purposeful motion on route entry and hover. Honors reduced-motion settings. */
@keyframes guan-rise { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.site-body .hero-copy, .site-body .hero-visual, .site-body .page-hero,
.site-body .page-standard > section, .app.guan-shell .pagehead,
.app.guan-shell .panel, .app.guan-shell .visual-studio { animation: guan-rise .55s both; }
.site-body .hero-visual, .site-body .page-standard > section:nth-child(2),
.app.guan-shell .panel { animation-delay: .06s; }
.site-body :is(.service-card, .case-placeholder, .faq-list details, .button),
.app.guan-shell :is(.panel, .visual-card, .historyitem, .settingcard, button) {
  transition-timing-function: cubic-bezier(.2,.7,.25,1);
}
@media (max-width: 920px) {
  .site-header { margin: 8px 12px 0; width: auto; }
  .topbar { width: calc(100% - 24px); margin-top: 8px; }
}
@media (max-width: 720px) {
  .site-header { padding: 12px 14px; border-radius: 15px; }
  .site-body .site-logo { width: 158px !important; height: 38px !important; }
  .site-nav { background: var(--vp-surface); border: 1px solid var(--vp-line); border-radius: 16px; box-shadow: var(--vp-shadow); }
  .section-frame { margin-left: 18px; margin-right: 18px; }
  .hero { gap: 30px; }
  .topbar { padding: 8px 10px; border-radius: 14px; }
  .site-body :is(.service-card, .client-flow article, .business-grid article,
    .principle-grid article, .case-placeholder, .request-form, .legal-sheet,
    .account-card, .contact-card, .scenario-card, .scenario-aside) { border-radius: 17px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-delay: 0ms !important; transition-duration: .01ms !important; }
}
