/* Product marketing — warm welcoming light layout, static footer, separate trial page */

.pm-page {

  margin: 0;

  min-height: 100vh;

  font-family: var(--pm-font-body, 'DM Sans', system-ui, sans-serif);

  background-color: var(--pm-bg, #f0ebe3);

  background-image:

    radial-gradient(ellipse 90% 55% at 50% -8%, var(--pm-wash, #ebe6de) 0%, transparent 62%),

    linear-gradient(180deg, var(--pm-bg, #f0ebe3) 0%, color-mix(in srgb, var(--pm-bg, #f0ebe3) 88%, var(--pm-accent, #7d6528) 12%) 100%);

  color: var(--pm-text, #2c2824);

  line-height: 1.55;

  -webkit-font-smoothing: antialiased;

}

.pm-page * { box-sizing: border-box; }

.pm-skin { position: relative; z-index: 1; }



/* Nav — warm parchment bar */

.pm-nav {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  justify-content: space-between;

  gap: 12px;

  padding: 14px 24px;

  border-bottom: 1px solid var(--pm-border-soft, #e0d9cf);

  position: sticky;

  top: 0;

  z-index: 50;

  background: var(--pm-nav-bg, rgba(250, 247, 242, 0.94));

  backdrop-filter: blur(10px);

  box-shadow: 0 1px 0 rgba(44, 40, 36, 0.04);

}

.pm-nav--trial { justify-content: flex-start; }

.pm-logo-link { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: inherit; font-weight: 700; }

.pm-logo-img { border-radius: 8px; object-fit: contain; }

.pm-nav-actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }



/* Buttons */

.pm-btn {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  padding: 11px 20px;

  border-radius: 10px;

  font-weight: 600;

  font-size: 14px;

  text-decoration: none;

  border: none;

  cursor: pointer;

  transition: transform .12s, box-shadow .12s, background .12s;

}

.pm-btn:hover { transform: translateY(-1px); box-shadow: 0 4px 14px rgba(44, 40, 36, 0.1); }

.pm-btn-primary { background: var(--pm-accent, #7d6528); color: var(--pm-btn-text, #fff); }

.pm-btn-primary:hover { filter: brightness(1.05); }

.pm-btn-secondary { background: var(--pm-surface, #faf7f2); color: var(--pm-text); border: 1px solid var(--pm-border, #d4cbc0); }

.pm-btn-ghost { background: transparent; color: var(--pm-text); border: 1px solid var(--pm-border, #d4cbc0); }

.pm-btn-lg { padding: 14px 28px; font-size: 16px; }

.pm-btn-block { width: 100%; margin-top: 8px; }



/* Hero & content */

.pm-hero {

  position: relative;

  z-index: 2;

  background: linear-gradient(180deg, color-mix(in srgb, var(--pm-wash, #ebe6de) 55%, transparent) 0%, transparent 100%);

}

.pm-hero h1 { font-family: var(--pm-font-display, sans-serif); margin: 0 0 16px; font-size: clamp(1.75rem, 4vw, 2.75rem); line-height: 1.18; color: var(--pm-text); letter-spacing: -0.01em; }

.pm-hero-lead { font-size: 17px; line-height: 1.65; color: var(--pm-muted, #6b645c); max-width: 640px; }

.pm-kicker { font-size: 12px; text-transform: uppercase; letter-spacing: .12em; color: var(--pm-accent); font-weight: 700; margin-bottom: 10px; }

.pm-hero-cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }

.pm-competitive { font-size: 15px; color: var(--pm-muted, #6b645c); max-width: 560px; margin-top: 12px; line-height: 1.6; }

.pm-video-mount { min-height: 200px; border-radius: 14px; overflow: hidden; border: 1px solid var(--pm-border-soft, #e0d9cf); background: var(--pm-surface, #faf7f2); box-shadow: 0 6px 28px rgba(44, 40, 36, 0.07); }



.pm-stats { position: relative; z-index: 2; }

.pm-stat {

  background: var(--pm-surface, #faf7f2);

  border: 1px solid var(--pm-border-soft, #e0d9cf);

  border-radius: 14px;

  padding: 20px;

  text-align: center;

  box-shadow: 0 2px 8px rgba(44, 40, 36, 0.04);

}

.pm-stat strong { display: block; font-size: 26px; color: var(--pm-accent); font-family: var(--pm-font-display, sans-serif); }

.pm-stat span { font-size: 13px; color: var(--pm-muted, #6b645c); }



.pm-section { max-width: 1080px; margin: 0 auto; padding: 48px 24px; position: relative; z-index: 2; }

.pm-section h2 { font-family: var(--pm-font-display, sans-serif); font-size: 26px; margin: 0 0 8px; color: var(--pm-text); letter-spacing: -0.01em; }

.pm-section-sub { color: var(--pm-muted, #6b645c); margin-bottom: 24px; max-width: 600px; line-height: 1.6; }

.pm-section--steps,

.pm-faq {

  background: var(--pm-surface-alt, #e5dfd4);

  max-width: none;

  border-top: 1px solid var(--pm-border-soft, #e0d9cf);

  border-bottom: 1px solid var(--pm-border-soft, #e0d9cf);

}

.pm-section--steps > *,

.pm-faq > * { max-width: 1080px; margin-left: auto; margin-right: auto; }

.pm-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }

.pm-card {

  background: var(--pm-surface, #faf7f2);

  border: 1px solid var(--pm-border-soft, #e0d9cf);

  border-radius: 14px;

  padding: 22px;

  box-shadow: 0 2px 6px rgba(44, 40, 36, 0.04);

  transition: box-shadow .15s, border-color .15s;

}

.pm-card:hover { box-shadow: 0 6px 20px rgba(44, 40, 36, 0.07); border-color: color-mix(in srgb, var(--pm-accent) 22%, var(--pm-border-soft, #e0d9cf)); }

.pm-card-icon { font-size: 28px; margin-bottom: 10px; }

.pm-card h3 { margin: 0 0 8px; font-size: 17px; color: var(--pm-text); }

.pm-card p { margin: 0; font-size: 15px; line-height: 1.6; color: var(--pm-muted, #6b645c); }



.pm-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }

@media (max-width: 800px) { .pm-steps { grid-template-columns: 1fr; } }

.pm-step { background: var(--pm-surface, #faf7f2); border: 1px solid var(--pm-border-soft, #e0d9cf); border-radius: 14px; padding: 22px; }

.pm-step-num { width: 32px; height: 32px; border-radius: 50%; background: var(--pm-accent); color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; margin-bottom: 12px; font-size: 14px; }

.pm-tags { display: flex; flex-wrap: wrap; gap: 8px; }

.pm-tag {

  padding: 8px 14px;

  border-radius: 999px;

  font-size: 13px;

  background: color-mix(in srgb, var(--pm-wash, #ebe6de) 70%, var(--pm-surface, #faf7f2));

  border: 1px solid var(--pm-border-soft, #e0d9cf);

  color: var(--pm-text);

}



.pm-faq details { background: var(--pm-surface, #faf7f2); border: 1px solid var(--pm-border-soft, #e0d9cf); border-radius: 12px; padding: 14px 18px; margin-bottom: 10px; }

.pm-faq summary { cursor: pointer; font-weight: 600; color: var(--pm-text); }

.pm-faq p { margin: 10px 0 0; font-size: 15px; color: var(--pm-muted, #6b645c); line-height: 1.6; }



.pm-proof {

  max-width: 680px;

  margin: 28px auto;

  padding: 28px 32px;

  text-align: center;

  font-style: italic;

  color: var(--pm-muted, #6b645c);

  background: color-mix(in srgb, var(--pm-wash, #ebe6de) 45%, var(--pm-surface, #faf7f2));

  border: 1px solid var(--pm-border-soft, #e0d9cf);

  border-radius: 16px;

  line-height: 1.65;

}

.pm-proof cite { display: block; margin-top: 10px; font-style: normal; font-size: 13px; color: color-mix(in srgb, var(--pm-muted, #6b645c) 80%, var(--pm-text)); }



/* Bottom CTA — warm invite band */

.pm-cta-band {

  background: linear-gradient(180deg, var(--pm-wash, #ebe6de) 0%, color-mix(in srgb, var(--pm-surface-alt, #e5dfd4) 80%, var(--pm-accent) 20%) 100%);

  border-top: 1px solid var(--pm-border-soft, #e0d9cf);

  padding: 52px 24px;

  text-align: center;

}

.pm-cta-band-inner { max-width: 560px; margin: 0 auto; }

.pm-cta-band h2 { font-family: var(--pm-font-display, sans-serif); font-size: 24px; margin: 0 0 10px; color: var(--pm-text); }

.pm-cta-band p { color: var(--pm-muted, #6b645c); margin: 0 0 20px; font-size: 15px; line-height: 1.6; }



/* Static site footer — two centered lines, SVG social icons */

.pm-site-footer {

  background: var(--pm-footer-bg, #e5dfd4);

  border-top: 1px solid var(--pm-border, #d4cbc0);

  padding: 20px 16px 22px;

  margin-top: 0;

  text-align: center;

  font-size: 11px;

  color: var(--pm-muted, #6b645c);

}

.pm-footer-line { max-width: 1100px; margin: 0 auto; display: flex; justify-content: center; align-items: center; }

.pm-footer-line--social { margin-bottom: 8px; }

.pm-footer-social {

  display: inline-flex;

  flex-wrap: wrap;

  justify-content: center;

  align-items: center;

  gap: 4px 6px;

  max-width: 100%;

}

.pm-footer-social a {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  width: 28px;

  height: 28px;

  border-radius: 6px;

  color: var(--pm-accent);

  text-decoration: none;

  font-size: 0;

  line-height: 0;

  flex-shrink: 0;

  transition: background .12s;

}

.pm-footer-social a:hover { background: color-mix(in srgb, var(--pm-surface, #faf7f2) 60%, transparent); }

.pm-footer-social a svg { display: block; width: 18px; height: 18px; }

.pm-footer-meta {

  margin: 0;

  line-height: 1.45;

  font-size: 11px;

  color: var(--pm-muted, #6b645c);

  text-align: center;

  display: inline;

}

.pm-footer-meta a { color: var(--pm-accent); font-weight: 600; text-decoration: none; white-space: nowrap; }

.pm-footer-meta a:hover { text-decoration: underline; }

.pm-footer-sep { color: var(--pm-border, #d4cbc0); user-select: none; white-space: pre; }

.pm-footer-addr { white-space: normal; }

@media (min-width: 900px) {

  .pm-footer-meta { white-space: nowrap; }

  .pm-footer-addr { white-space: nowrap; }

}



/* Trial page — standalone */

.pm-trial-page {

  min-height: calc(100vh - 180px);

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 40px 20px 56px;

  background: transparent;

}

.pm-trial-card {

  width: 100%;

  max-width: 520px;

  background: var(--pm-surface, #faf7f2);

  border: 1px solid var(--pm-border-soft, #e0d9cf);

  border-radius: 18px;

  padding: 36px 32px;

  box-shadow: 0 10px 36px rgba(44, 40, 36, 0.08);

}

.pm-trial-back { display: inline-block; margin-bottom: 16px; font-size: 14px; color: var(--pm-accent); text-decoration: none; font-weight: 600; }

.pm-trial-back:hover { text-decoration: underline; }

.pm-trial-card h1 { font-family: var(--pm-font-display, sans-serif); font-size: 1.65rem; margin: 0 0 10px; line-height: 1.2; }

.pm-trial-lead { color: var(--pm-muted, #6b645c); font-size: 15px; line-height: 1.6; margin: 0 0 24px; }

.pm-trial-note { margin: 16px 0 0; font-size: 12px; color: color-mix(in srgb, var(--pm-muted, #6b645c) 75%, transparent); text-align: center; }

.pm-form label { display: block; font-size: 12px; font-weight: 600; color: var(--pm-muted, #6b645c); margin: 14px 0 6px; }

.pm-form input { width: 100%; padding: 11px 13px; border-radius: 10px; border: 1px solid var(--pm-border, #d4cbc0); background: var(--pm-surface, #faf7f2); color: var(--pm-text); font-size: 15px; }

.pm-form input:focus { outline: 2px solid color-mix(in srgb, var(--pm-accent) 35%, transparent); border-color: var(--pm-accent); }

.pm-form .pm-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

@media (max-width: 600px) { .pm-form .pm-row { grid-template-columns: 1fr; } }

.pm-hp { position: absolute; left: -9999px; opacity: 0; height: 0; overflow: hidden; }

.pm-turnstile { margin-top: 14px; }

.pm-msg { font-size: 14px; margin-bottom: 12px; }

.pm-msg-ok { color: #047857; }

.pm-msg-err { color: #b91c1c; }



.pm-overlay { position: fixed; inset: 0; background: rgba(44, 40, 36, 0.45); display: none; align-items: center; justify-content: center; z-index: 200; }

.pm-overlay.is-visible { display: flex; }

.pm-overlay-card { background: var(--pm-surface, #faf7f2); border-radius: 16px; padding: 32px; max-width: 400px; text-align: center; box-shadow: 0 20px 48px rgba(44, 40, 36, 0.15); }



/* Video */

.pm-intro-video-frame { position: relative; padding-bottom: 56.25%; height: 0; }

.pm-intro-video-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.pm-intro-placeholder { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 200px; padding: 24px; text-align: center; gap: 12px; color: var(--pm-muted); background: color-mix(in srgb, var(--pm-wash, #ebe6de) 30%, var(--pm-surface, #faf7f2)); }

.pm-hero-video-play { display: inline-flex; align-items: center; gap: 10px; padding: 12px 18px; border-radius: 999px; border: none; background: var(--pm-accent); color: #fff; font-weight: 700; cursor: pointer; }



/* Subtle skin decorations */

.pm-deco { opacity: 0.5; pointer-events: none; }

/* Click-to-call + browser voice assistant */
.pm-nav-voice-slot { display: flex; align-items: center; margin-right: auto; margin-left: 12px; }
@media (max-width: 900px) {
  .pm-nav { flex-wrap: wrap; }
  .pm-nav-voice-slot { order: 3; width: 100%; margin: 4px 0 0; justify-content: flex-start; }
}
.pm-voice { position: relative; }
.pm-voice-trigger {
  display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px;
  border: 1px solid var(--pm-border, #d4cbc0);
  background: color-mix(in srgb, var(--pm-wash, #ebe6de) 55%, var(--pm-surface, #faf7f2));
  color: var(--pm-text); font-size: 13px; font-weight: 600; cursor: pointer;
}
.pm-voice-trigger:hover { border-color: color-mix(in srgb, var(--pm-accent) 35%, var(--pm-border)); }
.pm-voice-panel {
  position: absolute; top: calc(100% + 8px); left: 0; z-index: 80; width: min(340px, calc(100vw - 32px));
  padding: 16px; border-radius: 14px; border: 1px solid var(--pm-border-soft, #e0d9cf);
  background: var(--pm-surface, #faf7f2); box-shadow: 0 12px 36px rgba(44, 40, 36, 0.12); text-align: left;
}
.pm-voice-lead { margin: 0 0 14px; font-size: 13px; line-height: 1.55; color: var(--pm-muted, #6b645c); }
.pm-voice-actions { display: flex; flex-direction: column; gap: 8px; }
.pm-voice-actions .pm-btn { justify-content: center; gap: 8px; width: 100%; }
.pm-voice-dial { text-decoration: none; }
.pm-voice-note { margin: 12px 0 0; font-size: 11px; line-height: 1.45; color: var(--pm-muted, #6b645c); }
.pm-voice-end { margin-top: 10px; width: 100%; padding: 8px 12px; border-radius: 8px; border: 1px solid #d4cbc0; background: #faece8; color: #9a3412; font-size: 12px; font-weight: 600; cursor: pointer; }
body.pm-voice-active .pm-voice-trigger { border-color: var(--pm-accent); }