/* Partigo landing — page-level CSS: keyframes, smooth-scroll, base link/selection.
   Section + scene styles are INLINE in template.html (they read engine CSS vars).
   style-hover/style-active are applied at runtime by main.js via data-hover/active. */

html { scroll-behavior: smooth; background: var(--bg); }
  body { margin: 0; background: var(--bg); color: var(--text); font-family: var(--font-ui); -webkit-font-smoothing: antialiased; }
  a { color: var(--accent); text-decoration: none; }
  a:hover { color: var(--accent-press); }
  ::selection { background: var(--accent-weak); }
  @keyframes pg-drain { 0%,100% { opacity: 1 } 50% { opacity: .25 } }
  @keyframes pg-sweep { 0% { transform: translateY(-110%) } 100% { transform: translateY(110%) } }
  @keyframes pg-pulse-ring { 0% { transform: scale(1); opacity: .55 } 100% { transform: scale(2.1); opacity: 0 } }
  @keyframes pg-bob { 0%,100% { transform: translateY(0) } 50% { transform: translateY(-7px) } }
  @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto } }

#pg-root:empty{min-height:100vh}

/* ── runtime-built components (replace the design's DS <x-import>s) ── */
.pg-chip{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 9px;border-radius:var(--r-pill);
  font-family:var(--font-ui);font-size:11px;font-weight:600;letter-spacing:.02em;line-height:1;white-space:nowrap;
  background:var(--surface-2);color:var(--text-muted);border:1px solid var(--border)}
.pg-chip-dot{width:6px;height:6px;border-radius:50%;background:currentColor}
.pg-chip-accent{background:var(--accent-weak);color:var(--accent);border-color:transparent}
.pg-chip-success{background:var(--success-weak);color:var(--success);border-color:transparent}
.pg-chip-warning{background:var(--warning-weak);color:var(--on-warning);border-color:transparent}
.pg-chip-danger{background:var(--danger-weak);color:var(--danger);border-color:transparent}
.pg-chip-info{background:var(--info-weak);color:var(--info);border-color:transparent}
.pg-chip-neutral{background:var(--surface-2);color:var(--text-muted)}

.pg-tabbar{height:64px;display:flex;align-items:center;justify-content:space-around;
  border-top:1px solid var(--border);background:var(--surface);color:var(--text-faint)}
.pg-tab{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:var(--r-14)}
.pg-tab-active{color:var(--accent);background:var(--accent-weak)}

.pg-vcard{display:flex;align-items:center;gap:12px;background:var(--surface);border:1px solid var(--accent);
  border-radius:var(--r-14);padding:12px 14px;box-shadow:var(--shadow-card)}
.pg-vcard-badge{flex:0 0 auto;width:34px;height:34px;border-radius:var(--r-8);background:var(--accent);color:var(--on-accent);
  display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:700}
.pg-vcard-body{display:flex;flex-direction:column;gap:2px;flex:1 1 auto;min-width:0}
.pg-vcard-title{font-size:14px;font-weight:700;color:var(--text)}
.pg-vcard-sub{font-size:12px;color:var(--text-muted)}
.pg-vcard-plate{font-size:12px;font-weight:600;color:var(--text-muted);background:var(--surface-2);
  border:1px solid var(--border);border-radius:var(--r-8);padding:3px 8px}

/* screenshot slots — uploaded image or branded placeholder */
.pg-shot{overflow:hidden}
.pg-shot:not(.pg-shot-empty) img{width:100%;height:100%;object-fit:cover;display:block}
.pg-shot-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;
  background:linear-gradient(160deg,var(--surface-2),var(--surface));border:1px dashed var(--border-strong);
  padding:24px;text-align:center}
.pg-shot-mark{width:40px;height:40px;opacity:.5}
.pg-shot-cap{font-size:12px;font-weight:600;letter-spacing:.04em;color:var(--text-faint);max-width:20ch;line-height:1.4}

/* ── responsive: the marketing nav has no hamburger; hide the center links on
   small screens so the logo + language/theme toggles + CTA stay on one row. */
@media (max-width: 820px){
  header[data-chrome="nav"] nav{display:none !important}
  /* nav spacer is gone — push the language/theme/CTA cluster to the far end */
  header[data-chrome="nav"] > div > div:last-child{margin-inline-start:auto}
}
@media (max-width: 520px){
  /* the header CTA is redundant with the hero CTA on phones */
  header[data-chrome="nav"] > div > div:last-child > a[href]{display:none}
}

/* ── contact form ── */
.pg-fld{display:flex;flex-direction:column;gap:6px}
.pg-fld>span{font-size:13px;font-weight:600;color:var(--text-muted)}
.pg-in{width:100%;box-sizing:border-box;height:44px;padding:0 14px;border-radius:var(--r-14);
  border:1px solid var(--border-strong);background:var(--surface-2);color:var(--text);
  font-size:15px;font-family:var(--font-ui)}
textarea.pg-in{height:auto;padding:12px 14px;line-height:1.5;resize:vertical}
.pg-in:focus{outline:none;border-color:var(--accent);box-shadow:var(--ring)}
[data-contact-submit]:disabled{opacity:.6;cursor:default}