.product-page {
  --p-bg: #F7F8F5;
  --p-paper: #FBFBF8;
  --p-ink: #111411;
  --p-heading: #0B0E0C;
  --p-secondary: #555C57;
  --p-muted: #5F6761;
  --p-rule: rgba(17, 20, 17, 0.12);
  --p-accent: #1F7A43;
  background: var(--p-bg);
  color: var(--p-ink);
}
.p-shell { width: min(1240px, calc(100% - var(--gutter) - var(--gutter))); margin-inline: auto; }
.product-page h1, .product-page h2, .product-page h3 { overflow-wrap: anywhere; }

/* hero */
.p-hero { padding: 22px 0 clamp(36px, 4.5vw, 60px); border-bottom: 1px solid var(--p-rule); }
.product-page .breadcrumbs { color: var(--p-muted); flex-wrap: wrap; }
.product-page .breadcrumbs a { color: var(--p-secondary); }
.product-page .breadcrumbs a:hover { color: var(--p-accent); }
.product-page .breadcrumbs [aria-current="page"] { color: #343B36; }
.product-page .eyebrow { color: var(--p-accent); }
.product-page .signal-dot { background: var(--p-accent); }
.p-hero-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(300px, 1fr); align-items: center; gap: clamp(28px, 5vw, 72px); padding-top: clamp(28px, 3.4vw, 48px); }
.p-hero-copy h1 { margin: 16px 0 16px; color: var(--p-heading); font: 700 clamp(34px, 3.8vw, 54px)/1.04 var(--font-display); letter-spacing: -.035em; text-wrap: balance; }
.p-lead { max-width: 56ch; margin: 0; color: #333A35; font-size: clamp(16px, 1.4vw, 18px); line-height: 1.6; }
.p-chips { display: flex; flex-wrap: wrap; gap: 10px; margin: 22px 0 0; padding: 0; list-style: none; }
.p-chips li { min-width: 108px; padding: 10px 14px; border: 1px solid var(--p-rule); background: var(--p-paper); }
.p-chips span { display: block; color: var(--p-muted); font: 500 9px/1.3 var(--font-body); letter-spacing: .1em; text-transform: uppercase; }
.p-chips strong { display: block; margin-top: 4px; color: var(--p-heading); font: 600 15px/1.25 var(--font-body); }
.p-price-row { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 14px; margin-top: 26px; }
.p-price { color: var(--p-heading); font: 700 clamp(30px, 3vw, 40px)/1 var(--font-display); letter-spacing: -.02em; }
.p-price-note { color: var(--p-secondary); font-size: 13px; }
.p-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
.p-btn { display: inline-flex; align-items: center; gap: 14px; padding: 14px 18px; border: 1px solid #111411; background: #111411; color: var(--green) !important; font: 500 10px/1.2 var(--font-body); letter-spacing: .08em; text-decoration: none; text-transform: uppercase; transition: background .2s ease, color .2s ease; }
.p-btn:hover, .p-btn:focus-visible { background: var(--green); border-color: var(--green); color: #101110 !important; }
.p-btn--ghost { background: transparent; border-color: rgba(17, 20, 17, .35); color: var(--p-heading) !important; }
.p-btn--ghost:hover, .p-btn--ghost:focus-visible { background: #111411; border-color: #111411; color: var(--green) !important; }
.p-btn span { font-size: 14px; }
.p-stage { position: relative; display: grid; place-items: center; min-width: 0; padding: clamp(18px, 3vw, 36px); border: 1px solid #1d221e; background: radial-gradient(circle at 50% 62%, rgba(124,255,158,.10), rgba(124,255,158,.035) 36%, transparent 70%), #0A0C0B; line-height: 0; }
.p-stage img { display: block; width: 100%; max-width: 460px; height: auto; object-fit: contain; }

/* sections */
.p-section { padding: clamp(40px, 5vw, 64px) 0 0; }
.p-section:last-of-type { padding-bottom: clamp(56px, 6vw, 84px); }
.p-section h2 { margin: 0 0 18px; color: var(--p-heading); font: 600 clamp(26px, 2.5vw, 33px)/1.15 var(--font-display); letter-spacing: -.025em; }
.p-section h3 { margin: 0 0 8px; color: #202722; font: 600 17px/1.3 var(--font-display); }
.p-section p { margin: 0; color: #303732; line-height: 1.65; }
.p-specs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(28px, 4vw, 60px); margin: 0; border-top: 1px solid var(--p-rule); }
.p-specs > div { display: grid; grid-template-columns: minmax(120px, 42%) minmax(0, 1fr); gap: 14px; padding: 13px 0; border-bottom: 1px solid var(--p-rule); }
.p-specs dt { color: var(--p-secondary); font-size: 14px; }
.p-specs dd { margin: 0; color: var(--p-heading); font-size: 15px; font-weight: 600; overflow-wrap: anywhere; }
.p-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(28px, 4vw, 60px); }
.p-list { margin: 0; padding-left: 22px; color: #303732; line-height: 1.65; }
.p-list li + li { margin-top: 8px; }
.p-list li::marker { color: var(--p-accent); font-size: .8em; }
.p-note { margin: 22px 0 0; padding: 12px 0 12px 17px; border-left: 1px solid rgba(17,20,17,.3); color: #343B36; font-size: 15px; line-height: 1.65; }
.p-note b { display: block; margin-bottom: 4px; color: var(--p-accent); font: 500 9px/1.4 var(--font-body); letter-spacing: .12em; text-transform: uppercase; }
.p-order { padding: clamp(24px, 3vw, 36px); border-left: 2px solid var(--green); background: #111411; color: #F4F5F1; }
.p-order .eyebrow { color: var(--green); }
.p-order h2 { margin: 10px 0 14px; color: #F4F5F1; }
.p-order p { color: #D0D5D0; }
.p-tiers { width: 100%; max-width: 520px; margin: 18px 0 0; border-collapse: collapse; }
.p-tiers th, .p-tiers td { padding: 11px 0; border-bottom: 1px solid #2c332e; text-align: left; font-size: 15px; font-weight: 400; color: #D0D5D0; }
.p-tiers td:last-child { color: #F4F5F1; font-weight: 600; text-align: right; }
.p-order .p-actions { margin-top: 24px; }
.p-order .p-btn { background: transparent; border-color: var(--green); }
.p-order .p-btn:hover, .p-order .p-btn:focus-visible { background: var(--green); color: #101110 !important; }
.p-order .p-btn--ghost { border-color: rgba(244,243,239,.4); color: #F4F5F1 !important; }
.p-order .p-btn--ghost:hover, .p-order .p-btn--ghost:focus-visible { background: #F4F5F1; border-color: #F4F5F1; color: #101110 !important; }
.p-faq > div { padding: 18px 0; border-top: 1px solid var(--p-rule); }
.p-faq > div:last-child { border-bottom: 1px solid var(--p-rule); }
.p-faq h3 { margin: 0 0 6px; }
.p-related { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--p-rule); }
.p-related li { border-bottom: 1px solid var(--p-rule); }
.p-related a { display: flex; justify-content: space-between; align-items: center; gap: 18px; padding: 15px 0; color: var(--p-heading); font-weight: 600; text-decoration: none; }
.p-related a:hover { color: var(--p-accent); }
.p-related a span { color: var(--p-accent); }

@media (max-width: 900px) {
  .p-hero-grid { grid-template-columns: minmax(0, 1fr); }
  .p-stage { order: -1; }
  .p-stage img { max-width: 380px; }
  .p-specs, .p-two { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .p-shell { width: calc(100% - 40px); }
  .p-chips li { flex: 1 1 calc(50% - 10px); min-width: 0; }
  .p-actions .p-btn { width: 100%; justify-content: space-between; }
  .p-specs > div { grid-template-columns: minmax(0, 42%) minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) { .p-btn { transition: none; } }

/* trust / information pages (about, delivery & payment, warranty & returns) */
.p-hero--text .p-hero-grid { grid-template-columns: minmax(0, 1fr); padding-top: clamp(24px, 3vw, 40px); }
.p-hero--text .p-lead { max-width: 68ch; }
.p-prose { max-width: 78ch; }
.p-section p + p, .p-section .p-list + p, .p-section p + .p-list { margin-top: 14px; }
.p-section .p-prose a, .p-hero-copy .p-lead a, .p-faq a, .p-trust-links a { color: var(--p-accent); text-underline-offset: 3px; }
.p-section .p-prose a:hover, .p-trust-links a:hover { color: #176B38; }
.p-steps { margin: 0; padding-left: 22px; color: #303732; line-height: 1.65; }
.p-steps li + li { margin-top: 8px; }
.p-steps li::marker { color: var(--p-accent); font-weight: 600; }
.p-contact { display: grid; grid-template-columns: minmax(0, 1fr); margin: 0; border-top: 1px solid var(--p-rule); max-width: 560px; }
.p-contact > div { display: grid; grid-template-columns: minmax(120px, 38%) minmax(0, 1fr); gap: 14px; padding: 12px 0; border-bottom: 1px solid var(--p-rule); }
.p-contact dt { color: var(--p-secondary); font-size: 14px; }
.p-contact dd { margin: 0; color: var(--p-heading); font-size: 15px; font-weight: 600; overflow-wrap: anywhere; }
.p-contact a { color: var(--p-heading); text-decoration: none; }
.p-contact a:hover { color: var(--p-accent); }
.p-trust-links { margin: 18px 0 0; font-size: 14px; }
.p-order .p-trust-links { margin-top: 22px; line-height: 1.6; overflow-wrap: anywhere; }
.p-order .p-trust-links a + a { margin-left: 10px; }
.p-order .p-trust-links, .p-order .p-trust-links a { color: #D0D5D0; }
.p-order .p-trust-links a { color: var(--green); }

/* P5: price table on the wholesale page */
.p-table-wrap { width: 100%; margin: 20px 0 0; overflow-x: auto; border-top: 1px solid var(--p-rule); }
.p-table-wrap:focus-visible { outline: 2px solid var(--p-accent); outline-offset: 3px; }
.p-table { width: 100%; min-width: 600px; border-collapse: collapse; font-size: 15px; line-height: 1.45; }
.p-table caption { padding: 12px 0 4px; color: var(--p-secondary); font-size: 13px; text-align: left; caption-side: bottom; }
.p-table th, .p-table td { padding: 12px 16px 12px 0; border-bottom: 1px solid var(--p-rule); color: #242B26; text-align: left; vertical-align: top; }
.p-table thead th { border-bottom: 1px solid #18201A; color: #18201A; font-size: 14px; font-weight: 600; }
.p-table tbody th { color: var(--p-heading); font-weight: 600; }
.p-table td strong { color: var(--p-heading); font-weight: 600; }
.p-table a { color: var(--p-accent); text-underline-offset: 3px; }
@media (max-width: 600px) { .p-table { font-size: 14px; } .p-table th, .p-table td { padding: 10px 12px 10px 0; } }

/* Keep the seller IBAN readable without causing narrow-screen overflow. */
.p-prose .bank-iban { overflow-wrap: anywhere; word-break: break-word; }