@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Inter:wght@400;500;600;700&display=swap');

:root {
  --pm-ink: #0a0f16;
  --pm-ink-2: #101822;
  --pm-graphite: #1a2330;
  --pm-slate: #263141;
  --pm-line: #e2e7ef;
  --pm-paper: #f5f7fb;
  --pm-white: #ffffff;
  --pm-amber: #ffb938;
  --pm-amber-strong: #ff9d00;
  --pm-electric: #4fc3ff;
  --pm-text: #0e141c;
  --pm-text-soft: #4b5563;
  --pm-text-on-dark: #eef3fa;
  --pm-text-soft-on-dark: #b6c2d3;
  --pm-radius-sm: 8px;
  --pm-radius: 16px;
  --pm-radius-lg: 28px;
  --pm-shadow-sm: 0 4px 14px rgba(12, 18, 27, 0.06);
  --pm-shadow: 0 18px 50px -20px rgba(12, 18, 27, 0.28);
  --pm-shadow-lg: 0 40px 90px -34px rgba(12, 18, 27, 0.45);
  --pm-display: 'Space Grotesk', 'Segoe UI', system-ui, sans-serif;
  --pm-body: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --pm-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --pm-header-h: 82px;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: var(--pm-body);
  font-size: 16px;
  line-height: 1.65;
  color: var(--pm-text);
  background: var(--pm-white);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--pm-display);
  color: var(--pm-text);
  line-height: 1.15;
  letter-spacing: -0.02em;
  margin: 0 0 0.6em;
  font-weight: 600;
}

h1 { font-size: clamp(2.15rem, 4.4vw, 3.4rem); }
h2 { font-size: clamp(1.75rem, 3.2vw, 2.65rem); }
h3 { font-size: clamp(1.25rem, 2vw, 1.6rem); }

p { margin: 0 0 1rem; }

a { color: var(--pm-amber-strong); text-decoration: none; transition: color 0.2s var(--pm-ease); }
a:hover { color: var(--pm-ink); }

img { max-width: 100%; height: auto; display: block; }

::selection { background: var(--pm-amber); color: var(--pm-ink); }

.pm-container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
}

.pm-section { padding: 96px 0; position: relative; }
.pm-section--tight { padding: 64px 0; }
.pm-section--paper { background: var(--pm-paper); }
.pm-section--dark { background: var(--pm-ink); color: var(--pm-text-on-dark); }
.pm-section--dark h1,
.pm-section--dark h2,
.pm-section--dark h3 { color: var(--pm-text-on-dark); }
.pm-section--dark p { color: var(--pm-text-soft-on-dark); }

.pm-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--pm-display);
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--pm-amber-strong);
  margin-bottom: 18px;
}
.pm-eyebrow::before {
  content: "";
  width: 26px;
  height: 2px;
  background: var(--pm-amber-strong);
  border-radius: 2px;
}
.pm-section--dark .pm-eyebrow { color: var(--pm-amber); }
.pm-section--dark .pm-eyebrow::before { background: var(--pm-amber); }

.pm-section-head { max-width: 720px; margin: 0 auto 56px; text-align: center; }
.pm-section-head--left { margin: 0 0 48px; text-align: left; }
.pm-section-lead {
  font-size: 1.06rem;
  color: var(--pm-text-soft);
  margin: 0;
}
.pm-section--dark .pm-section-lead { color: var(--pm-text-soft-on-dark); }

.pm-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-family: var(--pm-display);
  font-weight: 600;
  font-size: 0.95rem;
  letter-spacing: 0.01em;
  padding: 14px 28px;
  border-radius: 999px;
  border: 1px solid transparent;
  transition: transform 0.2s var(--pm-ease), background 0.2s var(--pm-ease), color 0.2s var(--pm-ease), box-shadow 0.25s var(--pm-ease);
  cursor: pointer;
  line-height: 1.1;
  white-space: nowrap;
}
.pm-btn:active { transform: translateY(1px) scale(0.995); }

.pm-btn--amber {
  background: var(--pm-amber);
  color: var(--pm-ink);
  box-shadow: 0 12px 26px -14px rgba(255, 157, 0, 0.7);
}
.pm-btn--amber:hover { background: var(--pm-amber-strong); color: var(--pm-ink); transform: translateY(-2px); }

.pm-btn--dark {
  background: var(--pm-ink);
  color: var(--pm-text-on-dark);
}
.pm-btn--dark:hover { background: var(--pm-graphite); color: var(--pm-white); transform: translateY(-2px); }

.pm-btn--ghost {
  background: transparent;
  border-color: rgba(255, 255, 255, 0.28);
  color: var(--pm-text-on-dark);
}
.pm-btn--ghost:hover { background: rgba(255, 255, 255, 0.08); color: var(--pm-white); }

.pm-btn--outline {
  background: transparent;
  border-color: var(--pm-line);
  color: var(--pm-text);
}
.pm-btn--outline:hover { border-color: var(--pm-ink); background: var(--pm-ink); color: var(--pm-white); }

.pm-btn--block { width: 100%; }

.pm-header {
  position: sticky;
  top: 0;
  z-index: 1020;
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: saturate(180%) blur(14px);
  border-bottom: 1px solid var(--pm-line);
  transition: box-shadow 0.3s var(--pm-ease), background 0.3s var(--pm-ease);
}
.pm-header.is-scrolled {
  box-shadow: 0 12px 30px -20px rgba(12, 18, 27, 0.35);
  background: rgba(255, 255, 255, 0.97);
}
.pm-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: var(--pm-header-h);
  padding: 14px 0;
}
.pm-header__brand {
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: var(--pm-display);
  font-weight: 700;
  font-size: 1.15rem;
  letter-spacing: -0.01em;
  color: var(--pm-ink);
}
.pm-header__brand img { border-radius: 6px; }
.pm-header__nav ul {
  display: flex;
  gap: 26px;
  align-items: center;
  list-style: none;
  margin: 0;
  padding: 0;
}
.pm-header__nav a {
  font-size: 0.94rem;
  font-weight: 500;
  color: var(--pm-text);
  position: relative;
  padding: 6px 0;
}
.pm-header__nav a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 2px;
  background: var(--pm-amber-strong);
  border-radius: 2px;
  transition: width 0.25s var(--pm-ease);
}
.pm-header__nav a:hover::after { width: 100%; }
.pm-header__meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 0.82rem;
  color: var(--pm-text-soft);
  line-height: 1.35;
  text-align: right;
}
.pm-header__meta strong { color: var(--pm-text); font-weight: 600; }

.pm-hero {
  position: relative;
  min-height: 78vh;
  display: flex;
  align-items: center;
  color: var(--pm-text-on-dark);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 120px 0;
  overflow: hidden;
}
.pm-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 20% 20%, rgba(255, 185, 56, 0.18), transparent 60%);
  pointer-events: none;
}
.pm-hero__inner { position: relative; z-index: 2; max-width: 720px; }
.pm-hero h1 { color: var(--pm-text-on-dark); margin-bottom: 20px; }
.pm-hero p {
  font-size: 1.12rem;
  color: var(--pm-text-soft-on-dark);
  max-width: 560px;
  margin-bottom: 32px;
}
.pm-hero__actions { display: flex; flex-wrap: wrap; gap: 14px; }
.pm-hero__badges {
  display: flex;
  gap: 28px;
  margin-top: 42px;
  padding-top: 28px;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
  flex-wrap: wrap;
}
.pm-hero__badge { display: flex; flex-direction: column; gap: 2px; }
.pm-hero__badge strong {
  font-family: var(--pm-display);
  font-size: 1.5rem;
  color: var(--pm-amber);
  letter-spacing: -0.02em;
}
.pm-hero__badge span { font-size: 0.82rem; color: var(--pm-text-soft-on-dark); text-transform: uppercase; letter-spacing: 0.06em; }

.pm-slider {
  position: relative;
  border-radius: var(--pm-radius-lg);
  overflow: hidden;
  background: var(--pm-ink);
  box-shadow: var(--pm-shadow-lg);
}
.pm-slider .carousel-item { min-height: 480px; background-size: cover; background-position: center; }
.pm-slider__caption {
  position: absolute;
  inset: auto 0 0 0;
  padding: 90px 48px 48px;
  background: linear-gradient(to top, rgba(6, 10, 15, 0.92), rgba(6, 10, 15, 0));
  color: var(--pm-text-on-dark);
  max-width: 640px;
}
.pm-slider__caption h2 { color: var(--pm-text-on-dark); margin-bottom: 12px; }
.pm-slider__caption p { color: var(--pm-text-soft-on-dark); margin-bottom: 0; }
.pm-slider .carousel-indicators [data-bs-target] {
  width: 28px;
  height: 3px;
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.4);
  border: 0;
}
.pm-slider .carousel-indicators .active { background: var(--pm-amber); }

.pm-card {
  background: var(--pm-white);
  border: 1px solid var(--pm-line);
  border-radius: var(--pm-radius);
  padding: 32px;
  height: 100%;
  transition: transform 0.28s var(--pm-ease), box-shadow 0.28s var(--pm-ease), border-color 0.28s var(--pm-ease);
}
.pm-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--pm-shadow);
  border-color: transparent;
}
.pm-card__icon {
  width: 56px;
  height: 56px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: rgba(255, 185, 56, 0.16);
  color: var(--pm-amber-strong);
  font-size: 1.35rem;
  margin-bottom: 20px;
}
.pm-card h3 { font-size: 1.2rem; margin-bottom: 10px; }
.pm-card p { color: var(--pm-text-soft); margin: 0; font-size: 0.97rem; }

.pm-product-card {
  background: var(--pm-white);
  border: 1px solid var(--pm-line);
  border-radius: var(--pm-radius);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.28s var(--pm-ease), box-shadow 0.28s var(--pm-ease);
  height: 100%;
}
.pm-product-card:hover { transform: translateY(-6px); box-shadow: var(--pm-shadow); }
.pm-product-card__media {
  aspect-ratio: 4 / 3;
  background: linear-gradient(135deg, var(--pm-slate), var(--pm-ink-2));
  overflow: hidden;
  position: relative;
}
.pm-product-card__media img { width: 100%; height: 100%; object-fit: cover; }
.pm-product-card__tag {
  position: absolute;
  top: 14px;
  left: 14px;
  background: var(--pm-amber);
  color: var(--pm-ink);
  font-family: var(--pm-display);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 6px 12px;
  border-radius: 999px;
}
.pm-product-card__body { padding: 24px; display: flex; flex-direction: column; flex: 1; }
.pm-product-card__body h3 { font-size: 1.12rem; margin-bottom: 8px; }
.pm-product-card__body p { font-size: 0.94rem; color: var(--pm-text-soft); margin-bottom: 18px; flex: 1; }
.pm-product-card__foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-top: 1px solid var(--pm-line);
  padding-top: 16px;
}
.pm-price {
  font-family: var(--pm-display);
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--pm-ink);
  letter-spacing: -0.02em;
}
.pm-price small { font-size: 0.72rem; color: var(--pm-text-soft); font-weight: 500; letter-spacing: 0; }

.pm-feature-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 18px; }
.pm-feature-list li { display: flex; gap: 14px; align-items: flex-start; font-size: 0.98rem; color: var(--pm-text-soft); }
.pm-feature-list i { color: var(--pm-amber-strong); font-size: 1.15rem; margin-top: 3px; }
.pm-section--dark .pm-feature-list li { color: var(--pm-text-soft-on-dark); }

.pm-stat-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 1px;
  background: var(--pm-line);
  border: 1px solid var(--pm-line);
  border-radius: var(--pm-radius);
  overflow: hidden;
}
.pm-stat-strip__item {
  background: var(--pm-white);
  padding: 32px 24px;
  text-align: center;
}
.pm-stat-strip__item strong {
  display: block;
  font-family: var(--pm-display);
  font-size: clamp(1.8rem, 3vw, 2.5rem);
  color: var(--pm-ink);
  letter-spacing: -0.03em;
  margin-bottom: 4px;
}
.pm-stat-strip__item span { font-size: 0.85rem; color: var(--pm-text-soft); text-transform: uppercase; letter-spacing: 0.08em; }
.pm-section--dark .pm-stat-strip { background: rgba(255, 255, 255, 0.08); border-color: rgba(255, 255, 255, 0.1); }
.pm-section--dark .pm-stat-strip__item { background: var(--pm-ink-2); }
.pm-section--dark .pm-stat-strip__item strong { color: var(--pm-amber); }
.pm-section--dark .pm-stat-strip__item span { color: var(--pm-text-soft-on-dark); }

.pm-process { display: grid; gap: 20px; grid-template-columns: 1fr; }
.pm-process__step {
  display: grid;
  grid-template-columns: 64px 1fr;
  gap: 24px;
  padding: 28px;
  border-radius: var(--pm-radius);
  border: 1px solid var(--pm-line);
  background: var(--pm-white);
  transition: border-color 0.25s var(--pm-ease), transform 0.25s var(--pm-ease);
}
.pm-process__step:hover { border-color: var(--pm-amber); transform: translateX(4px); }
.pm-process__num {
  font-family: var(--pm-display);
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--pm-amber-strong);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: rgba(255, 185, 56, 0.14);
  min-height: 64px;
}
.pm-process__step h4 { font-family: var(--pm-display); font-size: 1.1rem; margin: 0 0 6px; }
.pm-process__step p { margin: 0; color: var(--pm-text-soft); font-size: 0.95rem; }

.pm-faq { display: grid; gap: 12px; }
.pm-faq__item {
  border: 1px solid var(--pm-line);
  border-radius: var(--pm-radius);
  overflow: hidden;
  background: var(--pm-white);
}
.pm-faq__item summary {
  list-style: none;
  cursor: pointer;
  padding: 22px 26px;
  font-family: var(--pm-display);
  font-weight: 600;
  font-size: 1rem;
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  color: var(--pm-text);
}
.pm-faq__item summary::-webkit-details-marker { display: none; }
.pm-faq__item summary .pm-faq__chevron {
  transition: transform 0.25s var(--pm-ease);
  color: var(--pm-amber-strong);
}
.pm-faq__item[open] summary .pm-faq__chevron { transform: rotate(180deg); }
.pm-faq__item p {
  padding: 0 26px 24px;
  margin: 0;
  color: var(--pm-text-soft);
  font-size: 0.97rem;
}

.pm-gallery { display: grid; gap: 18px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.pm-gallery__tile {
  border-radius: var(--pm-radius);
  overflow: hidden;
  position: relative;
  aspect-ratio: 4 / 3;
  background: var(--pm-graphite);
}
.pm-gallery__tile img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s var(--pm-ease); }
.pm-gallery__tile:hover img { transform: scale(1.06); }
.pm-gallery__tile figcaption {
  position: absolute;
  inset: auto 0 0 0;
  padding: 40px 20px 18px;
  background: linear-gradient(to top, rgba(6, 10, 15, 0.88), transparent);
  color: var(--pm-text-on-dark);
  font-size: 0.9rem;
  font-weight: 500;
}

.pm-testimonial {
  background: var(--pm-white);
  border: 1px solid var(--pm-line);
  border-radius: var(--pm-radius);
  padding: 32px;
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.pm-testimonial__stars { color: var(--pm-amber-strong); letter-spacing: 2px; font-size: 0.95rem; }
.pm-testimonial blockquote { margin: 0; color: var(--pm-text); font-size: 1rem; line-height: 1.65; }
.pm-testimonial__person { display: flex; gap: 14px; align-items: center; margin-top: auto; padding-top: 6px; }
.pm-testimonial__person img {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
  background: var(--pm-paper);
  flex-shrink: 0;
}
.pm-testimonial__person strong { display: block; font-family: var(--pm-display); font-size: 0.95rem; }
.pm-testimonial__person span { font-size: 0.82rem; color: var(--pm-text-soft); }

.pm-team-card {
  text-align: center;
  padding: 32px 24px;
  border-radius: var(--pm-radius);
  background: var(--pm-white);
  border: 1px solid var(--pm-line);
  height: 100%;
  transition: transform 0.25s var(--pm-ease), box-shadow 0.25s var(--pm-ease);
}
.pm-team-card:hover { transform: translateY(-4px); box-shadow: var(--pm-shadow); }
.pm-team-card img {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  object-fit: cover;
  margin: 0 auto 18px;
  background: var(--pm-paper);
  border: 3px solid var(--pm-amber);
}
.pm-team-card h4 { font-family: var(--pm-display); font-size: 1.05rem; margin: 0 0 4px; }
.pm-team-card span { font-size: 0.85rem; color: var(--pm-text-soft); display: block; margin-bottom: 12px; }
.pm-team-card p { font-size: 0.9rem; color: var(--pm-text-soft); margin: 0; }

.pm-cta-band {
  position: relative;
  border-radius: var(--pm-radius-lg);
  overflow: hidden;
  padding: 72px 48px;
  text-align: center;
  color: var(--pm-text-on-dark);
  background-size: cover;
  background-position: center;
}
.pm-cta-band h2 { color: var(--pm-text-on-dark); }
.pm-cta-band p { color: var(--pm-text-soft-on-dark); max-width: 560px; margin: 0 auto 28px; }
.pm-cta-band__actions { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }

.pm-form { display: grid; gap: 18px; }
.pm-form .form-label { font-family: var(--pm-display); font-size: 0.88rem; font-weight: 600; color: var(--pm-text); margin-bottom: 8px; }
.pm-form .form-control,
.pm-form .form-select {
  border: 1px solid var(--pm-line);
  border-radius: var(--pm-radius-sm);
  padding: 13px 16px;
  font-size: 0.95rem;
  background: var(--pm-white);
  color: var(--pm-text);
  transition: border-color 0.2s var(--pm-ease), box-shadow 0.2s var(--pm-ease);
}
.pm-form .form-control:focus,
.pm-form .form-select:focus {
  border-color: var(--pm-amber-strong);
  box-shadow: 0 0 0 3px rgba(255, 157, 0, 0.18);
  outline: none;
}
.pm-form textarea.form-control { min-height: 140px; resize: vertical; }
.pm-form .form-check-input:checked { background-color: var(--pm-amber-strong); border-color: var(--pm-amber-strong); }
.pm-form .invalid-feedback { font-size: 0.82rem; color: #b42318; }

.pm-newsletter {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  max-width: 480px;
  margin: 0 auto;
}
.pm-newsletter .form-control {
  border-radius: 999px;
  padding: 14px 22px;
  border: 1px solid var(--pm-line);
  font-size: 0.95rem;
}
.pm-newsletter .form-control:focus { outline: none; border-color: var(--pm-amber-strong); box-shadow: 0 0 0 3px rgba(255, 157, 0, 0.18); }
.pm-newsletter .pm-btn { padding: 14px 26px; }

.pm-article-card {
  display: flex;
  flex-direction: column;
  border-radius: var(--pm-radius);
  overflow: hidden;
  border: 1px solid var(--pm-line);
  background: var(--pm-white);
  height: 100%;
  transition: transform 0.28s var(--pm-ease), box-shadow 0.28s var(--pm-ease);
}
.pm-article-card:hover { transform: translateY(-4px); box-shadow: var(--pm-shadow); }
.pm-article-card__media { aspect-ratio: 16 / 10; overflow: hidden; background: var(--pm-graphite); }
.pm-article-card__media img { width: 100%; height: 100%; object-fit: cover; }
.pm-article-card__body { padding: 26px; display: flex; flex-direction: column; flex: 1; gap: 12px; }
.pm-article-card__meta { font-size: 0.8rem; color: var(--pm-text-soft); text-transform: uppercase; letter-spacing: 0.08em; font-weight: 600; }
.pm-article-card h3 { font-size: 1.15rem; margin: 0; }
.pm-article-card p { font-size: 0.93rem; color: var(--pm-text-soft); margin: 0; flex: 1; }
.pm-article-card__link { font-family: var(--pm-display); font-weight: 600; font-size: 0.9rem; color: var(--pm-amber-strong); display: inline-flex; align-items: center; gap: 6px; }
.pm-article-card__link:hover { color: var(--pm-ink); gap: 10px; }

.pm-page-hero {
  position: relative;
  padding: 120px 0 80px;
  color: var(--pm-text-on-dark);
  background-size: cover;
  background-position: center;
  overflow: hidden;
}
.pm-page-hero__inner { max-width: 780px; }
.pm-page-hero h1 { color: var(--pm-text-on-dark); }
.pm-page-hero p { color: var(--pm-text-soft-on-dark); font-size: 1.08rem; max-width: 620px; }
.pm-breadcrumb { display: flex; gap: 8px; font-size: 0.85rem; color: var(--pm-text-soft-on-dark); margin-bottom: 20px; flex-wrap: wrap; }
.pm-breadcrumb a { color: var(--pm-text-on-dark); }
.pm-breadcrumb a:hover { color: var(--pm-amber); }
.pm-breadcrumb span:not(:last-child)::after { content: "/"; margin-left: 8px; opacity: 0.5; }

.pm-figure { border-radius: var(--pm-radius); overflow: hidden; background: var(--pm-paper); }
.pm-figure img { width: 100%; height: 100%; object-fit: cover; }

.pm-map {
  border-radius: var(--pm-radius);
  overflow: hidden;
  border: 1px solid var(--pm-line);
  box-shadow: var(--pm-shadow-sm);
}
.pm-map iframe { width: 100%; height: 100%; min-height: 360px; border: 0; display: block; }

.pm-footer {
  background: var(--pm-ink);
  color: var(--pm-text-soft-on-dark);
  padding: 80px 0 28px;
  font-size: 0.94rem;
}
.pm-footer a { color: var(--pm-text-soft-on-dark); }
.pm-footer a:hover { color: var(--pm-amber); }
.pm-footer h4 {
  color: var(--pm-text-on-dark);
  font-family: var(--pm-display);
  font-size: 0.85rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  margin-bottom: 20px;
}
.pm-footer ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.pm-footer__brand { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.pm-footer__brand span { font-family: var(--pm-display); font-weight: 700; font-size: 1.1rem; color: var(--pm-text-on-dark); }
.pm-footer__bottom {
  margin-top: 56px;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  font-size: 0.82rem;
  color: var(--pm-text-soft-on-dark);
}
.pm-footer__contact-line { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 12px; }
.pm-footer__contact-line i { color: var(--pm-amber); margin-top: 4px; }

.pm-back-to-top {
  position: fixed;
  right: 22px;
  bottom: 22px;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: var(--pm-ink);
  color: var(--pm-amber);
  border: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: opacity 0.25s var(--pm-ease), transform 0.25s var(--pm-ease), visibility 0.25s var(--pm-ease), background 0.25s var(--pm-ease);
  z-index: 1030;
  box-shadow: var(--pm-shadow);
}
.pm-back-to-top.is-visible { opacity: 1; visibility: visible; transform: translateY(0); }
.pm-back-to-top:hover { background: var(--pm-amber-strong); color: var(--pm-ink); }

.pm-cookie {
  position: fixed;
  left: 24px;
  bottom: 24px;
  right: 24px;
  max-width: 440px;
  z-index: 1080;
  transition: opacity 0.3s var(--pm-ease), transform 0.3s var(--pm-ease);
}
.pm-cookie.is-dismissing { opacity: 0; transform: translateY(24px); pointer-events: none; }
.pm-cookie.is-dismissed { display: none !important; }

.pm-cookie__panel {
  background: linear-gradient(160deg, #0c131c 0%, #17222f 100%);
  color: #eaf1fa;
  border-radius: var(--pm-radius);
  border: 1px solid rgba(255, 185, 56, 0.28);
  box-shadow: 0 30px 60px -22px rgba(6, 10, 15, 0.6);
  padding: 22px 22px 20px;
  position: relative;
  overflow: hidden;
}
.pm-cookie__panel::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--pm-amber), rgba(79, 195, 255, 0.7));
}
.pm-cookie__head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}
.pm-cookie__icon {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: rgba(255, 185, 56, 0.16);
  color: var(--pm-amber);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  flex-shrink: 0;
}
.pm-cookie__title {
  font-family: var(--pm-display);
  font-size: 1.02rem;
  font-weight: 600;
  color: #ffffff;
  margin: 0;
  letter-spacing: -0.01em;
}
.pm-cookie__text {
  font-size: 0.88rem;
  line-height: 1.55;
  color: #cfdae7;
  margin: 0 0 16px;
}
.pm-cookie__link {
  color: var(--pm-amber);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.pm-cookie__link:hover { color: #ffffff; }
.pm-cookie__actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.pm-cookie__btn {
  flex: 1 1 auto;
  min-width: 120px;
  font-family: var(--pm-display);
  font-size: 0.88rem;
  font-weight: 600;
  padding: 11px 18px;
  border-radius: 999px;
  border: 1px solid transparent;
  cursor: pointer;
  transition: background 0.2s var(--pm-ease), color 0.2s var(--pm-ease), border-color 0.2s var(--pm-ease), transform 0.15s var(--pm-ease);
  line-height: 1.1;
}
.pm-cookie__btn:active { transform: translateY(1px); }
.pm-cookie__btn--decline {
  background: transparent;
  border-color: rgba(255, 255, 255, 0.28);
  color: #eaf1fa;
}
.pm-cookie__btn--decline:hover { background: rgba(255, 255, 255, 0.08); border-color: rgba(255, 255, 255, 0.5); }
.pm-cookie__btn--accept {
  background: var(--pm-amber);
  color: #0c131c;
}
.pm-cookie__btn--accept:hover { background: var(--pm-amber-strong); }

@media (max-width: 991px) {
  .pm-header__nav { display: none; }
  .pm-header__meta { display: none; }
  .pm-section { padding: 72px 0; }
  .pm-hero { padding: 90px 0; min-height: auto; }
  .pm-slider .carousel-item { min-height: 380px; }
  .pm-slider__caption { padding: 70px 26px 32px; }
  .pm-cta-band { padding: 52px 26px; }
  .pm-process__step { grid-template-columns: 48px 1fr; gap: 16px; padding: 22px; }
  .pm-process__num { min-height: 48px; font-size: 1.15rem; }
}

@media (max-width: 576px) {
  .pm-cookie { left: 12px; right: 12px; bottom: 12px; }
  .pm-cookie__panel { padding: 18px; }
  .pm-cookie__actions { flex-direction: column-reverse; }
  .pm-cookie__btn { width: 100%; }
  .pm-newsletter { grid-template-columns: 1fr; }
  .pm-newsletter .pm-btn { width: 100%; }
  .pm-hero__badges { gap: 18px; }
  .pm-footer__bottom { flex-direction: column; }
}

/* QA_GRID_COLUMN_FIX .pm-stat-strip.row */
.pm-stat-strip.row{--bs-gutter-x:0;--bs-gutter-y:0;margin-left:0;margin-right:0}
.pm-stat-strip.row>:is([class^="col-"],[class*=" col-"]){width:100%;max-width:100%;min-width:0;flex:none;padding-left:0;padding-right:0;margin-top:0}
/* QA_GRID_COLUMN_FIX .pm-process.row */
.pm-process.row{--bs-gutter-x:0;--bs-gutter-y:0;margin-left:0;margin-right:0}
.pm-process.row>:is([class^="col-"],[class*=" col-"]){width:100%;max-width:100%;min-width:0;flex:none;padding-left:0;padding-right:0;margin-top:0}
/* QA_GRID_COLUMN_FIX .pm-gallery.row */
.pm-gallery.row{--bs-gutter-x:0;--bs-gutter-y:0;margin-left:0;margin-right:0}
.pm-gallery.row>:is([class^="col-"],[class*=" col-"]){width:100%;max-width:100%;min-width:0;flex:none;padding-left:0;padding-right:0;margin-top:0}


/* QA_STEP_CARD_GRID_FIX .pm-process:has(> .pm-process__step) */
@media(min-width:992px){.pm-process:has(> .pm-process__step){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem}.pm-process:has(> .pm-process__step)>:not(.pm-process__step){grid-column:1/-1}.pm-process:has(> .pm-process__step)>.pm-process__step{width:100%;max-width:100%;min-width:0}}

/* QA_CONTRAST_FIX: eyebrow labels on light backgrounds need a darker amber */
.pm-eyebrow { color: #9a5200; }
.pm-eyebrow::before { background: #9a5200; }

/* Keep the lighter amber where the label sits on a dark or photographic surface */
.pm-hero .pm-eyebrow,
.pm-page-hero .pm-eyebrow,
.pm-section--dark .pm-eyebrow,
.pm-cta-band .pm-eyebrow,
.pm-slider .pm-eyebrow { color: var(--pm-amber); }
.pm-hero .pm-eyebrow::before,
.pm-page-hero .pm-eyebrow::before,
.pm-section--dark .pm-eyebrow::before,
.pm-cta-band .pm-eyebrow::before,
.pm-slider .pm-eyebrow::before { background: var(--pm-amber); }

/* QA_CONTRAST_FIX: breadcrumb on the dark page hero */
.pm-breadcrumb .breadcrumb-item,
.pm-breadcrumb .breadcrumb-item.active,
.pm-breadcrumb .breadcrumb-item a { color: var(--pm-text-on-dark); }
.pm-breadcrumb .breadcrumb-item a:hover { color: var(--pm-amber); }
.pm-breadcrumb .breadcrumb-item + .breadcrumb-item::before { color: rgba(238, 243, 250, 0.65); }

/* QA_CARD_LAYOUT_FIX: article cards sit inside stretched anchors, keep body text readable and un-nested */
.pm-article-card p,
.pm-product-card__body p { color: var(--pm-text-soft); }

/* QA_FIX_PROCESS_STEP_LAYOUT
   The step card is a 2-column grid (number | content). Without explicit
   placement the trailing paragraph fell into the narrow number track.
   Number + title share row 1, body text spans the full card width. */
.pm-process__step > .pm-process__num {
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
}
.pm-process__step > h3,
.pm-process__step > h4 {
  grid-column: 2;
  grid-row: 1;
  align-self: center;
  margin-top: 0 !important;
  min-width: 0;
}
.pm-process__step > p {
  grid-column: 1 / -1;
  grid-row: 2;
  min-width: 0;
  overflow-wrap: break-word;
}

/* QA_FIX_FEATURE_LIST_OVERFLOW
   Long unbreakable strings (email address) used to spill out of narrow cards. */
.pm-feature-list li { min-width: 0; }
.pm-feature-list li > i { flex: 0 0 auto; }
.pm-feature-list li > span {
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* QA_FIX_EYEBROW_CONTRAST
   Amber #ff9d00 fails contrast on the light/paper section backgrounds, so the
   light sections use a deeper amber. Dark surfaces keep the bright amber. */
.pm-eyebrow { color: #8a4f00; }
.pm-eyebrow::before { background: #8a4f00; }

.pm-section--dark .pm-eyebrow,
.pm-page-hero .pm-eyebrow,
.pm-hero .pm-eyebrow,
.pm-cta-band .pm-eyebrow { color: var(--pm-amber); }

.pm-section--dark .pm-eyebrow::before,
.pm-page-hero .pm-eyebrow::before,
.pm-hero .pm-eyebrow::before,
.pm-cta-band .pm-eyebrow::before { background: var(--pm-amber); }

/* QA_FIX_PROCESS_NUM_CONTRAST */
.pm-process__num { color: #8a4f00; }

/* QA_FIX_BREADCRUMB_CONTRAST
   Bootstrap's default breadcrumb colours are dark and sat on the dark hero. */
.pm-breadcrumb .breadcrumb-item,
.pm-breadcrumb .breadcrumb-item.active,
.pm-breadcrumb .breadcrumb-item > span { color: #d7e0ec; }
.pm-breadcrumb .breadcrumb-item + .breadcrumb-item::before { color: #b6c2d3; }

/* QA_FIX_FOOTER_HEADINGS
   Footer column headings are marked up as h2/h3 with utility classes, so they
   inherited the dark body heading colour on the dark footer background. */
.pm-footer h2,
.pm-footer h3,
.pm-footer h4 {
  color: var(--pm-text-on-dark);
  font-family: var(--pm-display);
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  margin-bottom: 20px;
}

/* QA_FIX_INLINE_LINK_CONTRAST
   Global `a` colour is #ff9d00 which only reaches ~2.1:1 against white/paper.
   Inline links inside body copy and form labels need a deeper amber on light
   surfaces. Buttons, cards links and nav keep their existing colours. */
.pm-section p a,
.pm-section li a,
.pm-section .form-check-label a,
.pm-section address a {
  color: #8a4f00;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.pm-section p a:hover,
.pm-section li a:hover,
.pm-section .form-check-label a:hover,
.pm-section address a:hover {
  color: #0a0f16;
}

/* White cards sitting inside the dark section are still light surfaces. */
.pm-section--dark .pm-card p a,
.pm-section--dark .pm-card li a {
  color: #8a4f00;
}
.pm-section--dark .pm-card p a:hover,
.pm-section--dark .pm-card li a:hover {
  color: #0a0f16;
}

/* Paragraph links that sit directly on a dark surface keep the bright amber. */
.pm-section--dark > .pm-container > .row > [class*="col-"] > p a,
.pm-section--dark > .pm-container > .row > [class*="col-"] > div > p a {
  color: var(--pm-amber);
}

/* QA_CONTRAST_FIX_HERO_EYEBROW_PILL
   The amber eyebrow sits directly on a photographic hero, so its contrast
   varies with whatever the photo does behind it. Give it a solid dark chip
   so the bright amber always reads clearly, regardless of the image. */
.pm-hero .pm-eyebrow {
  background: rgba(8, 14, 20, 0.88);
  color: var(--pm-amber);
  padding: 6px 16px;
  border-radius: 999px;
  border: 1px solid rgba(255, 185, 56, 0.35);
}
.pm-hero .pm-eyebrow::before { background: var(--pm-amber); }

/* QA_CONTRAST_FIX_HERO_ARTICLE_META
   .pm-article-card__meta is styled for light cards (#4b5563). When the same
   meta line is reused inside the dark hero it must switch to the light
   on-dark colour so "Bench team" / read time stay legible. */
.pm-hero .pm-article-card__meta { color: var(--pm-text-soft-on-dark); }
.pm-hero .pm-article-card__meta i { color: var(--pm-amber); }

/* QA_FIX_INLINE_LINK_CONTRAST_CORRECTION
   The generic dark-surface rule above also matched paragraph links inside the
   white .pm-card blocks that sit inside a dark section. Those cards are light
   surfaces, so their links must stay on the deeper amber. */
.pm-section--dark > .pm-container > .row > [class*="col-"] > .pm-card > p a,
.pm-section--dark > .pm-container > .row > [class*="col-"] > .pm-card > p a:hover,
.pm-section--dark > .pm-container > .row > [class*="col-"] > .pm-card > p a:visited {
  color: #8a4f00;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* QA_CONTRAST_FIX_HERO_INTRO
   The hero intro paragraph used the muted on-dark grey, which drops under 4.5:1
   where the photographic backdrop (plus the amber radial wash) is brightest.
   Near-white keeps it comfortably legible on every hero image. */
.pm-hero p { color: var(--pm-text-on-dark); }

/* QA_FIX_HERO_OUTLINE_BUTTON_CONTRAST
   .pm-btn--outline is designed for light cards (dark text on transparent).
   Inside the dark hero slider that produced dark-on-dark text (~1:1 ratio),
   so the hero variant switches to a light label on a translucent surface. */
.pm-hero .pm-btn--outline,
.pm-slider .pm-btn--outline {
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.55);
  background: rgba(255, 255, 255, 0.12);
}
.pm-hero .pm-btn--outline:hover,
.pm-hero .pm-btn--outline:focus-visible,
.pm-slider .pm-btn--outline:hover,
.pm-slider .pm-btn--outline:focus-visible {
  color: #0a0f16;
  background: #ffffff;
  border-color: #ffffff;
}

/* QA_FIX_COOKIE_ACCEPT_CONTRAST
   Pin the accept button colours with literal values so the dark panel
   gradient can never show through behind the label. */
.pm-cookie .pm-cookie__btn--accept {
  background-color: #ffb938;
  background-image: linear-gradient(180deg, #ffc859 0%, #ffb938 100%);
  color: #0c131c;
  border-color: #ffb938;
  border-radius: 12px;
}
.pm-cookie .pm-cookie__btn--accept:hover,
.pm-cookie .pm-cookie__btn--accept:focus-visible {
  background-color: #ff9d00;
  background-image: linear-gradient(180deg, #ffb938 0%, #ff9d00 100%);
  color: #0c131c;
  border-color: #ff9d00;
}
.pm-cookie .pm-cookie__btn--decline { border-radius: 12px; }

/* QA_FIX_CHECK_LABEL_CONTRAST
   The enquiry form sits inside a dark section, so .form-check-label inherited
   --pm-text-on-dark (#eef3fa) even though the surrounding .pm-card is a light
   surface. Force the label (and its inline link) back to a dark ink colour so
   the consent text stays readable on white. */
.pm-form .form-check-label,
.pm-form .form-check-label a,
.pm-section--dark .pm-card .pm-form .form-check-label,
.pm-section--dark .pm-card .pm-form .form-check-label a {
  color: var(--pm-text);
}
.pm-form .form-check-label a,
.pm-section--dark .pm-card .pm-form .form-check-label a {
  color: #8a4f00;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.pm-form .form-check-label a:hover {
  color: var(--pm-ink);
}

/* QA_FIX_PAGE_HERO_OUTLINE_BUTTON_CONTRAST
   .pm-btn--outline is a light-surface button (dark text on transparent). Inside
   the dark .pm-page-hero (photo + 70% black overlay) that rendered dark text on
   a near-black surface (~1.1:1). The page hero variant uses a light label on a
   translucent white surface, matching the existing .pm-hero / .pm-slider fix. */
.pm-page-hero .pm-btn--outline {
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.55);
  background: rgba(255, 255, 255, 0.14);
}
.pm-page-hero .pm-btn--outline:hover,
.pm-page-hero .pm-btn--outline:focus-visible {
  color: #0a0f16;
  background: #ffffff;
  border-color: #ffffff;
}

/* QA_FIX_NEWSLETTER_FORM_OVERLAP
   Inside the dark newsletter section the consent row (.form-check) and the
   submit button were pulled out of flow and ended up stacked on top of the
   email field / label text. Re-assert a normal single-column flow for this
   form and let the checkbox and its label share a row without overlapping. */
.pm-form .form-check {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  min-height: 0;
  padding-left: 0;
  margin: 0;
}
.pm-form .form-check .form-check-input {
  flex: 0 0 auto;
  float: none;
  margin: 0.28em 0 0;
  position: static;
  inset: auto;
}
.pm-form .form-check .form-check-label {
  flex: 1 1 auto;
  min-width: 0;
  position: static;
  inset: auto;
  overflow-wrap: anywhere;
}
.pm-form > .mb-3,
.pm-form > .form-check,
.pm-form > button,
.pm-form .form-control {
  position: static;
  inset: auto;
  max-width: 100%;
}
.pm-form .form-control { width: 100%; }
.pm-form > button[type="submit"] {
  justify-self: start;
  align-self: start;
  display: inline-flex;
  width: auto;
  max-width: 100%;
}

/* QA_FIX_ARTICLE_CARD_LINK_LAYOUT
   The article card wraps its media + body in a single stretched anchor
   (.pm-article-card__link) that is an inline-flex row, so on narrow screens the
   image and the text body sat side by side, squeezing the body copy into a
   ~110px column. The anchor must behave as the card's own column/grid container. */
.pm-article-card > .pm-article-card__link {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  color: inherit;
  font-family: inherit;
  font-weight: inherit;
  font-size: inherit;
  gap: 0;
  align-items: stretch;
}
.pm-article-card > .pm-article-card__link:hover { color: inherit; }
.pm-article-card > .pm-article-card__link .pm-article-card__media {
  width: 100%;
  flex: 0 0 auto;
}
.pm-article-card > .pm-article-card__link .pm-article-card__body { min-width: 0; }
.pm-article-card > .pm-article-card__link .pm-article-card__body > * {
  min-width: 0;
  overflow-wrap: break-word;
}
.pm-article-card > .pm-article-card__link .pm-article-card__body h3 {
  color: var(--pm-text);
  transition: color 0.2s var(--pm-ease);
}
.pm-article-card > .pm-article-card__link:hover .pm-article-card__body h3 {
  color: var(--pm-amber-strong);
}

/* QA_FIX_FOOTER_MAP_HEIGHT
   .pm-map iframe { height: 100% } plus .pm-map { overflow: hidden } and no
   definite track height made the footer map (height="180" attribute, inside a
   footer column) stretch to a tall nested viewport-proportional box. Give the
   footer map a compact, definite height that matches its height attribute. */
.pm-footer .pm-map {
  position: static;
  height: auto;
  max-height: 200px;
  contain: paint;
}
.pm-footer .pm-map iframe {
  display: block;
  width: 100%;
  height: 180px;
  min-height: 0;
  max-height: 180px;
  border: 0;
}

/* QA_FIX_CTA_BAND_MISSING_SURFACE
   .pm-cta-band is authored as a dark/photographic band: its heading uses
   --pm-text-on-dark (#eef3fa) and its body copy uses --pm-text-soft-on-dark
   (#b6c2d3). On the article pages the band is dropped straight into a white
   .pm-section with no background-image, so those on-dark colours rendered
   near-white on white (~1.1:1) and the whole block was unreadable.
   Give the band its own definite dark surface so the existing on-dark text
   colours resolve correctly. Only paint when no photo is supplied, so real
   photographic CTA bands keep their image. */
.pm-cta-band {
  background-color: var(--pm-ink);
  background-image: linear-gradient(rgba(10, 15, 22, 0.94), rgba(10, 15, 22, 0.94));
  color: var(--pm-text-on-dark);
}
.pm-cta-band[style*="background-image"] {
  background-color: transparent;
}
.pm-cta-band h1,
.pm-cta-band h2,
.pm-cta-band h3,
.pm-cta-band h4,
.pm-cta-band h5,
.pm-cta-band h6 { color: var(--pm-text-on-dark); }
.pm-cta-band p,
.pm-cta-band li,
.pm-cta-band small { color: var(--pm-text-soft-on-dark); }
.pm-cta-band .pm-btn--ghost {
  color: var(--pm-text-on-dark);
  border-color: rgba(255, 255, 255, 0.42);
  background: rgba(255, 255, 255, 0.10);
}
.pm-cta-band .pm-btn--ghost:hover,
.pm-cta-band .pm-btn--ghost:focus-visible {
  color: var(--pm-ink);
  background: var(--pm-white);
  border-color: var(--pm-white);
}
.pm-cta-band .pm-btn--amber { color: var(--pm-ink); }

/* QA_FIX_CTA_BAND_HEADING_STACK
   On the article pages the CTA band arrives with no photo and no colour
   helpers, so the band's dark surface is painted by the rule above. Two
   defects showed up at mobile widths (360px):
   1. .pm-eyebrow is display:inline-flex, so the "Still stuck on a fit" label
      and the "Send us a photo of the housing" heading shared one line and the
      heading was squeezed into a narrow ragged column.
   2. The band wrapper relied on inline layout, so the eyebrow/text block and
      the button row could sit side by side and the heading inherited the
      cramped track, making the front of the title read as a thin, faint
      sliver over the dark surface.
   Give the band a plain block flow (label, heading, copy stacked, buttons
   below) and pull the eyebrow onto its own line. Desktop keeps the existing
   centred look; no width, padding or colour is changed. */
.pm-cta-band > .pm-eyebrow { display: flex; width: fit-content; margin-left: auto; margin-right: auto; }
.pm-cta-band > div { display: block; width: 100%; min-width: 0; }
.pm-cta-band > div > .pm-eyebrow { display: flex; width: fit-content; margin-left: auto; margin-right: auto; }
.pm-cta-band h1,
.pm-cta-band h2,
.pm-cta-band h3,
.pm-cta-band h4 { width: 100%; max-width: 100%; min-width: 0; overflow-wrap: break-word; color: var(--pm-text-on-dark); }
.pm-cta-band__actions { display: flex; flex-wrap: wrap; justify-content: center; margin-top: 28px; }

@media (max-width: 991px) {
  .pm-cta-band > .pm-eyebrow,
  .pm-cta-band > div > .pm-eyebrow {
    justify-content: center;
    margin-bottom: 14px;
  }
  .pm-cta-band h1,
  .pm-cta-band h2,
  .pm-cta-band h3,
  .pm-cta-band h4 { line-height: 1.22; }
}
