:root {
  --pm-near-black:  #121212;
  --pm-mid-gray:    #A6A6A6;
  --pm-near-white:  #FEFDFB;
  --pm-brand-red:   #79071D;
  --pm-soft-red:    #BC838E;
  --pm-pale-red:    #DEC1C7;
  --pm-orange:      #FE9331;
  --pm-peach:       #FEB775;
  --pm-teal-pale:   #C2D6DE;
  --pm-ease-out:    cubic-bezier(0.16, 1, 0.3, 1);

  --r-sm: 8px; --r-md: 14px; --r-lg: 20px;
  --r-nav: 18px; --r-btn: 12px; --r-pill: 100px; --r-input: 10px;

  --glass-blur:        28px;
  --glass-blur-heavy:  44px;
  --glass-bg:          rgba(14, 14, 14, 0.55);
  --glass-bg-red:      rgba(50, 3, 12, 0.55);
  --glass-bg-teal:     rgba(14, 34, 42, 0.55);
  --glass-border:      rgba(255, 255, 255, 0.08);
  --glass-border-red:  rgba(188, 131, 142, 0.20);
  --glass-shadow:      0 8px 40px rgba(0,0,0,0.55), 0 2px 10px rgba(0,0,0,0.35);
  --glass-top-glint:   inset 0 1px 0 rgba(255,255,255,0.13);
  --glass-bot-shadow:  inset 0 -1px 0 rgba(0,0,0,0.30);

  --text-primary:   rgba(255,255,255,0.95);
  --text-secondary: rgba(255,255,255,0.68);
  --text-muted:     rgba(255,255,255,0.40);
  --text-label:     rgba(255,255,255,0.24);

  --page-max: 1160px;
  --gutter: clamp(48px, 8vw, 160px);
  --gutter-x: clamp(24px, 4vw, 80px);

  /* Mode-sensitive — overridden by [data-theme="light"] */
  --body-bg:      #121212;
  --footer-bg:    rgba(10,10,10,0.60);
  --footer-bd:    rgba(255,255,255,0.05);
  --dot-col:      rgba(222,193,199,0.06);
  --blob-r:       rgba(121,7,29,0.48);
  --blob-t:       rgba(72,122,142,0.34);
  --blob-p:       rgba(254,183,117,0.10);
}
[data-theme="light"] {
  --body-bg:      #FAFAFD;
  --footer-bg:    rgba(255,255,255,0.78);
  --footer-bd:    rgba(0,0,0,0.06);
  --dot-col:      rgba(18,18,18,0.04);
  --blob-r:       rgba(168,21,46,0.10);
  --blob-t:       rgba(72,122,142,0.09);
  --blob-p:       rgba(254,183,117,0.13);
  --glass-bg:          rgba(255,255,255,0.76);
  --glass-bg-red:      rgba(168,21,46,0.04);
  --glass-bg-teal:     rgba(72,122,142,0.045);
  --glass-border:      rgba(0,0,0,0.055);
  --glass-border-red:  rgba(168,21,46,0.12);
  --glass-shadow:      0 1px 8px rgba(0,0,0,0.04), 0 0 0 1px rgba(0,0,0,0.04);
  --glass-top-glint:   inset 0 1px 0 rgba(255,255,255,1);
  --glass-bot-shadow:  inset 0 -1px 0 rgba(0,0,0,0.03);
  --text-primary:   rgba(18,18,18,0.92);
  --text-secondary: rgba(18,18,18,0.60);
  --text-muted:     rgba(18,18,18,0.38);
  --text-label:     rgba(18,18,18,0.22);
  --pm-orange: #D4710A;
}
@media (min-width: 1660px) {
  :root { --page-max: 1580px; }
}
*, *::before, *::after { box-sizing: border-box; }
body {
  margin: 0;
  font-family: 'Montserrat', sans-serif;
  background: var(--body-bg);
  color: var(--text-primary);
  min-height: 100vh;
  overflow-x: clip;
  -webkit-font-smoothing: antialiased;
  padding: 0 var(--gutter-x);
}

/* ── Animated blob background ── */
.pm-bg-canvas {
  position: fixed; inset: 0; z-index: 0;
  overflow: hidden; pointer-events: none;
}
.pm-bg-canvas::before {
  content: '';
  position: absolute; width: 70vw; height: 70vw; border-radius: 50%;
  background: radial-gradient(circle, var(--blob-r) 0%, transparent 70%);
  top: -20%; left: -15%;
  animation: pmBlob1 18s ease-in-out infinite alternate;
}
.pm-bg-canvas::after {
  content: '';
  position: absolute; width: 55vw; height: 55vw; border-radius: 50%;
  background: radial-gradient(circle, var(--blob-t) 0%, transparent 70%);
  bottom: -15%; right: -10%;
  animation: pmBlob2 22s ease-in-out infinite alternate;
}
.pm-bg-blob-mid {
  position: absolute; width: 45vw; height: 45vw; border-radius: 50%;
  background: radial-gradient(circle, var(--blob-p) 0%, transparent 70%);
  top: 42%; left: 38%;
  animation: pmBlob3 26s ease-in-out infinite alternate;
}
.pm-bg-dots {
  position: absolute; inset: 0;
  background-image: radial-gradient(circle, var(--dot-col) 1px, transparent 1px);
  background-size: 32px 32px;
}
@keyframes pmBlob1 { to { transform: translate(8vw,6vh) scale(1.12); } }
@keyframes pmBlob2 { to { transform: translate(-6vw,-8vh) scale(1.08); } }
@keyframes pmBlob3 { to { transform: translate(4vw,10vh) scale(0.9); } }

/* ── Shared glass base ── */
.pm-glass {
  background: transparent;
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  border: none; border-radius: 9999px;
  overflow: hidden; position: relative;
  transition: box-shadow 0.4s ease;
}
.pm-glass::before {
  content: ''; position: absolute; inset: 0;
  pointer-events: none; z-index: 0;
  background: var(--glass-overlay, rgba(255,255,255,0.60));
  transition: background 0.4s ease;
}
.pm-glass > * { position: relative; z-index: 1; }
.pm-glass[data-nav-theme="light"] { box-shadow: 0 1px 8px rgba(0,0,0,0.05), 0 0 2px rgba(0,0,0,0.03); }
.pm-glass[data-nav-theme="dark"]  { box-shadow: 0 4px 28px rgba(0,0,0,0.35), 0 2px 8px rgba(0,0,0,0.22); }

/* ── Islands III — nav positions ── */
:root { --pm-nav-top: 14px; --pm-nav-edge: 20px; }

#pm-back-circle {
  position: fixed; top: var(--pm-nav-top); left: var(--pm-nav-edge);
  width: 44px; height: 44px;
  display: flex; align-items: center; justify-content: center;
  text-decoration: none; color: rgba(18,18,18,0.38);
  z-index: 100; transition: opacity 0.2s;
}
#pm-back-circle[data-nav-theme="dark"] { color: rgba(255,255,255,0.52); }
#pm-back-circle:hover { opacity: 0.7; }

#pm-logo-pill {
  position: fixed; top: var(--pm-nav-top); left: 72px;
  height: 44px; display: flex; align-items: center;
  padding: 0 18px; text-decoration: none; z-index: 100;
}
#pm-logo-pill img { height: 18px; width: auto; display: block; }

#pm-toggle-circle {
  position: fixed; top: var(--pm-nav-top); right: var(--pm-nav-edge);
  width: 44px; height: 44px;
  display: flex; align-items: center; justify-content: center;
  background: transparent; border: none; cursor: pointer;
  padding: 0; outline: none; color: rgba(18,18,18,0.40); z-index: 100;
}
#pm-toggle-circle[data-nav-theme="dark"] { color: rgba(255,255,255,0.50); }

/* ── Hero — always full width, no side padding ── */
.pm-hero {
  margin-left: calc(-1 * var(--gutter-x));
  margin-right: calc(-1 * var(--gutter-x));
  width: auto;
}

/* ── Glass footer — breaks out of body gutter to full width ── */
.pm-footer-wrap {
  margin-left: calc(-1 * var(--gutter-x));
  margin-right: calc(-1 * var(--gutter-x));
  width: auto;
  padding: 0 var(--gutter-x) 40px;
  position: relative; z-index: 1;
}
.pm-footer {
  border-radius: var(--r-lg);
  padding: 20px 28px;
  display: flex; align-items: center; justify-content: space-between;
  background: var(--footer-bg);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid var(--footer-bd);
  margin-top: 64px;
}
.pm-footer a {
  color: var(--text-label); text-decoration: none;
  font-family: 'Montserrat', sans-serif;
  font-size: 10px; font-weight: 700; letter-spacing: 0.16em;
  text-transform: uppercase; transition: color 0.15s;
}
.pm-footer a:hover { color: var(--text-secondary); }
.pm-footer-logo { height: 18px; width: auto; opacity: 0.25; transition: opacity 0.15s; }
.pm-footer-logo:hover { opacity: 0.6; }
/* footer logo src swapped by JS */

/* ── Theme toggle button ── */
.pm-theme-toggle {
  background: transparent; border: none; cursor: pointer;
  width: 28px; height: 28px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: var(--text-muted); transition: color 0.2s, background 0.2s;
  padding: 0; flex-shrink: 0; outline: none;
}
.pm-theme-toggle:hover { color: var(--text-secondary); background: rgba(255,255,255,0.08); }
[data-theme="light"] .pm-theme-toggle:hover { background: rgba(0,0,0,0.06); }

/* ── Glass action bar ── */
.pm-action-bar {
  position: fixed; bottom: 28px; right: 28px;
  display: flex; gap: 8px; z-index: 999;
}
.pm-btn {
  display: flex; align-items: center; gap: 7px;
  padding: 11px 20px; border: none;
  border-radius: 100px;
  font-family: 'Montserrat', sans-serif; font-size: 10px; font-weight: 700;
  letter-spacing: 0.12em; text-transform: uppercase; cursor: pointer;
  transition: transform 0.15s, box-shadow 0.15s;
}
.pm-btn:hover { transform: translateY(-2px); }
.pm-btn-print {
  background: rgba(18, 18, 18, 0.88);
  backdrop-filter: blur(20px) saturate(1.5);
  -webkit-backdrop-filter: blur(20px) saturate(1.5);
  border: 1px solid rgba(255, 255, 255, 0.10);
  color: rgba(255, 255, 255, 0.80);
  box-shadow: 0 4px 20px rgba(0,0,0,0.35), inset 0 1px 0 rgba(255,255,255,0.08);
}
.pm-btn-print:hover { color: #fff; background: rgba(18, 18, 18, 0.98); }
.pm-btn-download {
  background: var(--pm-brand-red); color: #fff;
  box-shadow: 0 4px 20px rgba(121,7,29,0.5), inset 0 1px 0 rgba(255,255,255,0.14);
}
.pm-btn-download:hover {
  box-shadow: 0 8px 28px rgba(121,7,29,0.6), inset 0 1px 0 rgba(255,255,255,0.18);
}

/* ── Print ── */
@media print {
  #pm-back-circle, #pm-logo-pill, #pm-toggle-circle, .pm-action-bar { display: none !important; }
  .pm-bg-canvas { display: none !important; }
  body { padding: 0 !important; background: #fff !important; }
  .pm-footer-wrap { margin: 0 !important; width: 100% !important; padding: 0; }
  .pm-footer {
    position: static !important; margin-top: 40px;
    background: #f5f5f5 !important; backdrop-filter: none !important;
    border-radius: 0 !important; border: none !important;
  }
}