body {
  background: #f7fafc;
  font-family: Poppins, sans-serif;
  margin: 0;
  padding: 0;
}

/* ================= Titles ================= */
.product-main-title,
h1[style*="text-align:center"] {
  text-align: center;
  font-size: 2.6rem;
  font-weight: 800;
  color: #0f1c2e;
  letter-spacing: .015em;
  line-height: 1.2;
  display: block;
  margin: 2.5rem auto 1.8rem;
  position: relative;
}

.product-main-title::after,
h1[style*="text-align:center"]::after {
  content: "";
  display: block;
  width: 60px;
  height: 4px;
  background: linear-gradient(90deg, #5aa9ff, #2c79cb);
  margin: 14px auto 0;
  border-radius: 6px;
}

/* ================= Description ================= */
.product-description,
p[style*="max-width:900px"] {
  max-width: 900px;
  margin: 1.5rem auto 2.2rem;
  text-align: center;
  font-size: 1.07rem;
  line-height: 1.7;
  color: #2e4a77;
}

/* ================= Product cards ================= */
.products-row {
  display: flex;
  flex-wrap: wrap;
  gap: 38px;
  justify-content: center;
  margin: 32px auto 24px;
  padding: 0;
}

.product-card {
  background: #fafcff;
  border-radius: 22px;
  box-shadow: 0 4px 24px #86bfff26;
  width: 270px;
  min-height: 380px;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 28px 18px 24px;
  text-align: center;
  position: relative;
  border: 1px solid rgba(0, 0, 0, .08);
  transition: transform .2s;
}

.product-card:hover {
  transform: translateY(-6px);
}

/* === Unified product image frame: square 1:1, full product visible, never cropped === */
.product-card img {
  width: 100%;
  max-width: 240px;
  aspect-ratio: 1 / 1;
  height: auto;
  object-fit: contain;       /* show the whole product, no cropping */
  object-position: center;   /* centered horizontally + vertically */
  padding: 7.5%;             /* breathing room -> product fills ~85% of the frame */
  box-sizing: border-box;
  background: #fff;
  border-radius: 16px;
  border: 1px solid #d3e9ff;
  box-shadow: 0 4px 18px rgba(153, 193, 255, .35);
  margin: 0 auto 10px;
  display: block;
}

.product-card h3 {
  font-size: 1.12rem;
  font-weight: 700;
  color: #17416a;
  margin: 0 0 8px;
  line-height: 1.4;
  letter-spacing: .02em;
  position: relative;
}

.product-card h3::after {
  content: "";
  display: block;
  width: 42px;
  height: 2px;
  background-color: #111;
  margin: 8px auto 0;
  border-radius: 1px;
  opacity: .6;
}

.product-card p {
  font-weight: 400;
  color: #2e4a77;
  font-size: .94rem;
  line-height: 1.5;
  margin: 0 0 10px;
  word-break: break-word;
  overflow-wrap: break-word;
  white-space: normal;
  hyphens: auto;
}

/* ================= Buttons ================= */
.modal-send-btn,
.product-inquiry-btn {
  color: #fff;
  border: none;
  cursor: pointer;
}

.product-inquiry-btn {
  background: linear-gradient(90deg, #5aa9ff, #2c79cb);
  border-radius: 10px;
  padding: 8px 24px;
  font-size: 1rem;
  font-weight: 600;
  margin-top: 0;
  box-shadow: 0 3px 12px #5aa9ff24;
  transition: background .22s, transform .15s;
}

.product-inquiry-btn:hover {
  background: linear-gradient(90deg, #237ae4, #56b0f7);
  transform: scale(1.06);
}

/* Modal — visual styles in /css/ds/forms.css (via /css/global.css). Layout-only tweaks below. */
@keyframes popIn {
  from { transform: scale(.8); opacity: 0; }
  to   { transform: scale(1); opacity: 1; }
}
.modal-inquiry {
  animation: 0.34s ease-in-out popIn;
}

/* ================= Links Section ================= */
.product-links-section,
div[style*="max-width:900px"] {
  max-width: 900px;
  margin: 2.5rem auto;
  padding: 0 1rem;
}

.product-links-section h3,
div[style*="max-width:900px"] > h3 {
  font-size: 1.25rem;
  font-weight: 700;
  color: #0f1c2e;
  margin-bottom: 1rem;
  text-align: center;
}

.product-links-section ul,
div[style*="max-width:900px"] ul {
  list-style: none;
  padding-left: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px 22px;
}

.product-links-section a,
div[style*="max-width:900px"] a {
  text-decoration: none;
  color: #1c3f75;
  font-size: 1.02rem;
  font-weight: 500;
  position: relative;
  transition: color .25s;
}

.product-links-section a::after,
div[style*="max-width:900px"] a::after {
  content: "";
  position: absolute;
  left: 0; bottom: -2px;
  width: 100%;
  height: 2px;
  background: #5aa9ff;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .25s;
}

.product-links-section a:hover,
div[style*="max-width:900px"] a:hover {
  color: #2c79cb;
}

.product-links-section a:hover::after,
div[style*="max-width:900px"] a:hover::after {
  transform: scaleX(1);
}

/* ================= Responsive ================= */
@media (max-width:700px) {
  .product-description,
  .product-links-section a,
  .product-links-section h3 {
    text-align: center;
  }
  .product-links-section ul { justify-content: center; }
  .product-card h3 {
    font-size: 1.14rem;
    font-weight: 700;
    letter-spacing: .02em;
  }
  .product-card p {
    font-size: .96rem;
    line-height: 1.5;
  }
}
/* ===== Subcategory Cards (Pumpen landing) ===== */
.subcategory-cards-row{
  display:flex; flex-wrap:wrap; gap:36px; justify-content:center;
  margin:3rem auto 1.5rem; max-width:1250px; padding:0 16px;
}
.subcategory-card{
  background:#fafdff; border-radius:24px; text-decoration:none; color:#081b35;
  display:flex; flex-direction:column; align-items:center; text-align:center;
  width:230px; min-height:320px; padding:24px 10px 22px;
  box-shadow:0 6px 24px rgba(134,191,255,.15); border:1px solid rgba(12,20,40,.06);
  font-weight:700; font-size:1.14rem; position:relative; cursor:pointer;
  transform:translateY(38px) scale(.97); opacity:0; animation:cardFadeIn .9s forwards;
  transition:box-shadow .28s, transform .28s, background .28s, color .28s;
}
.subcategory-card img{
  width:160px; height:160px; object-fit:contain; display:block;
  border-radius:18px; background:#fff; margin:2px 0 10px;
  box-shadow:0 2px 18px rgba(179,216,250,.22);
}
.subcategory-card .card-divider{
  width:46px; height:4px; border-radius:2px;
  background:linear-gradient(90deg,#b3d8fa,#5aa9ff);
  margin:14px auto 10px; opacity:.65;
}
.subcategory-card span{
  display:block; margin-top:5px; font-size:1.18rem; color:#0e243b; letter-spacing:.01em;
}
.subcategory-card:hover{
  background:linear-gradient(135deg,#d0e8ff,#a2d4ff);
  box-shadow:0 14px 54px rgba(179,216,250,.35);
  transform:translateY(-10px) scale(1.07); color:#b30000;
}
.subcategory-card:hover img{ transform:scale(1.06) rotate(-2deg); }

.subcategory-card.delay-1{animation-delay:.10s}
.subcategory-card.delay-2{animation-delay:.22s}
.subcategory-card.delay-3{animation-delay:.34s}
.subcategory-card.delay-4{animation-delay:.46s}
.subcategory-card.delay-5{animation-delay:.58s}
.subcategory-card.delay-6{animation-delay:.70s}
.subcategory-card.delay-7{animation-delay:.82s}
.subcategory-card.delay-8{animation-delay:.94s}

@keyframes cardFadeIn{ to{ opacity:1; transform:translateY(0) scale(1); } }

@media (max-width:700px){
  .subcategory-cards-row{ flex-direction:column; align-items:center; gap:18px; margin:1.2rem auto 1.5rem; max-width:100vw; }
  .subcategory-card{ width:94vw; min-height:290px; padding:18px 4vw; border-radius:22px; }
  .subcategory-card img{
    width:84vw; height:84vw; max-width:330px; max-height:330px; min-width:120px; min-height:120px; border-radius:15px; margin:0 0 14px;
  }
  .subcategory-card span{ font-size:1.18rem; margin-top:7px; }
}
/* ===== Pumpen: responsive center fix (paste at end of sublink.css) ===== */


main.container{
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 16px;
}


.subcategory-cards-row{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 36px;
  margin: 2rem auto 1.5rem;
  padding: 0 16px;
}


.subcategory-card{
  margin: 0;                     
  text-align: center;
}


.subcategory-card img{
  display: block;
  margin: 0 auto;
}


@media (max-width: 1100px){
  .subcategory-cards-row{ gap: 28px; }
  .subcategory-card{ width: clamp(260px, 42vw, 360px); }
}


@media (max-width: 767px){
  .subcategory-cards-row{
    flex-direction: column;
    align-items: center;         
    gap: 18px;
  }
  .subcategory-card{
    width: min(520px, 100%);
    margin: 0 auto;              
    padding: 18px 4vw;
    border-radius: 22px;
  }
  .subcategory-card img{
    width: min(84vw, 340px);
    height: auto;                
  }
}

/* --- Small phones --- */
@media (max-width: 480px){
  .subcategory-card{ width: 94vw; padding: 16px 14px; }
  .subcategory-card img{ width: 84vw; }
}


.seo-text{
  max-width: 1000px;
  margin: 1.5rem auto 2.5rem;
  padding: 2rem 1.25rem;
  border-radius: 18px;
}
/* ===== Pumpen mobile centering (force) ===== */
/* =========================================================
   UNIVERSAL PRODUCT LANDING STYLES (for ALL product pages)
   Scope: any page with <body class="products-page">
   ========================================================= */

/* Container */
.products-page main.container{
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 16px;
}

/* ---------- Title (H1) ---------- */
.products-page .product-main-title{
  text-align:center;
  font-weight:800;
  font-size:clamp(2rem, 4.6vw, 2.6rem);
  letter-spacing:.015em;
  color:#0f1c2e;
  margin: 2.2rem auto 1.6rem;
  position:relative;
  text-wrap:balance;          
  white-space: normal;        
  overflow: visible;
  text-overflow: clip;
}
.products-page .product-main-title::after{
  content:"";
  display:block;
  width:86px; height:5px;
  margin:14px auto 0;
  border-radius:999px;
  background:linear-gradient(90deg,#5aa9ff,#2c79cb);
  box-shadow:0 6px 18px rgba(90,169,255,.35);
}

.products-page .product-main-title::before{
  content:"";
  position:absolute; inset:-14px -18px auto -18px;
  height:52px;
  background:radial-gradient(closest-side, rgba(134,191,255,.18), transparent 70%);
  filter:blur(10px);
  border-radius:24px;
  pointer-events:none;
}


.products-page .product-description{
  max-width:900px;
  margin:1.4rem auto 2.4rem;
  text-align:center;
  font-size:clamp(1.05rem, 1.3vw, 1.3rem);
  line-height:1.75;
  font-weight:400;
  color:#2e4a77;
  text-wrap:balance;
  position:relative;
  padding:0 1rem;
}
.products-page .product-description::after{
  content:"";
  position:absolute;
  bottom:-12px; left:50%;
  transform:translateX(-50%);
  width:160px; height:32px;
  border-radius:50%;
  background:radial-gradient(ellipse at center, rgba(90,169,255,.15), transparent 70%);
  filter:blur(10px);
}

/* =========================================================
   SUBCATEGORY CARDS GRID (landing tiles)
   ========================================================= */


.products-page .subcategory-cards-row{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:36px;
  margin:3rem auto 1.5rem;
  max-width:1250px;
  padding:0 16px;
}


.products-page .subcategory-card{
  background:#fafdff;
  border-radius:24px;
  text-decoration:none;
  color:#081b35;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  width:230px;
  min-height:320px;
  padding:24px 10px 22px;
  box-shadow:0 6px 24px rgba(134,191,255,.15);
  border:1px solid rgba(12,20,40,.06);
  font-weight:700;
  font-size:1.14rem;
  position:relative;
  cursor:pointer;
  transform:translateY(38px) scale(.97);
  opacity:0;
  animation:cardFadeIn .9s forwards;
  transition:box-shadow .28s, transform .28s, background .28s, color .28s;
  margin:0; 
}


.products-page .subcategory-card img{
  width:160px; height:160px;
  object-fit:contain; display:block;
  border-radius:18px; background:#fff; margin:2px 0 10px;
  box-shadow:0 2px 18px rgba(179,216,250,.22);
}


.products-page .subcategory-card .card-divider{
  width:46px; height:4px; border-radius:2px;
  background:linear-gradient(90deg,#b3d8fa,#5aa9ff);
  margin:14px auto 10px; opacity:.65;
}


.products-page .subcategory-card span{
  display:block; margin-top:5px; font-size:1.18rem; color:#0e243b; letter-spacing:.01em;
}

/* Hover */
.products-page .subcategory-card:hover{
  background:linear-gradient(135deg,#d0e8ff,#a2d4ff);
  box-shadow:0 14px 54px rgba(179,216,250,.35);
  transform:translateY(-10px) scale(1.07);
  color:#b30000;
}
.products-page .subcategory-card:hover img{ transform:scale(1.06) rotate(-2deg); }


.products-page .subcategory-card.delay-1{animation-delay:.10s}
.products-page .subcategory-card.delay-2{animation-delay:.22s}
.products-page .subcategory-card.delay-3{animation-delay:.34s}
.products-page .subcategory-card.delay-4{animation-delay:.46s}
.products-page .subcategory-card.delay-5{animation-delay:.58s}
.products-page .subcategory-card.delay-6{animation-delay:.70s}
.products-page .subcategory-card.delay-7{animation-delay:.82s}
.products-page .subcategory-card.delay-8{animation-delay:.94s}

@keyframes cardFadeIn{ to{ opacity:1; transform:translateY(0) scale(1); } }

/* ===================== Responsive ===================== */


@media (max-width:1100px){
  .products-page .subcategory-cards-row{ gap:28px; }
  .products-page .subcategory-card{ width: clamp(260px, 42vw, 360px); }
}


@media (max-width:767px){
  .products-page .subcategory-cards-row{
    flex-direction:column;
    align-items:center;
    gap:18px;
    margin:1.2rem auto 1.6rem;
  }
  .products-page .subcategory-card{
    width:100% !important;
    max-width:min(520px, 100%);
    margin-inline:auto !important;
    padding:18px 4vw;
    border-radius:22px;
    box-sizing:border-box;
    align-self:center !important;
  }
  .products-page .subcategory-card img{
    display:block;
    width:min(84vw, 340px);
    height:auto;
    margin:0 auto;
  }
}

/* tiny phones */
@media (max-width:480px){
  .products-page .subcategory-card{
    width:100% !important;
    max-width:100%;
    padding:16px 14px;
  }
  .products-page .subcategory-card img{ width:min(84vw, 340px); }
}
/* Modal layout — safe-area; colors in /css/ds/forms.css */
@supports (padding: max(0px)) {
  .modal-bg {
    padding-left: max(24px, env(safe-area-inset-left));
    padding-right: max(24px, env(safe-area-inset-right));
    padding-top: max(24px, env(safe-area-inset-top));
    padding-bottom: max(24px, env(safe-area-inset-bottom));
  }
}

/* ===== H1 — Responsive Centering & Scale ===== */
h1,
.product-main-title {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: block;
  max-width: 1000px;          
  text-wrap: balance;
}


h1::after,
.product-main-title::after,
.page-title::after {
  content: "";
  display: block;
  width: clamp(46px, 8vw, 86px);
  height: 4px;
  margin: 12px auto 0;
  border-radius: 999px;
  background: linear-gradient(90deg, #5aa9ff, #2c79cb);
  box-shadow: 0 6px 18px rgba(90,169,255,.25);
}


.product-main-title::before,
.page-title::before {
  content: "";
  position: absolute;
  inset: -12px -16px auto -16px;
  height: 48px;
  background: radial-gradient(closest-side, rgba(134,191,255,.14), transparent 70%);
  filter: blur(10px);
  border-radius: 22px;
  pointer-events: none;
}

@media (max-width: 480px) {
  h1,
  .product-main-title,
  .page-title {
    max-width: 22ch;
    font-size: 1.45rem;
    line-height: 1.3;
  }
}

/* ==== MORE-LINKS — Outline Neon Chips (minimal container) ==== */
.more-links{
  max-width: 1100px;
  margin: 2.2rem auto;
  padding: .2rem 1rem 1rem;
  text-align: center;
}

.more-links > h2{
  margin: 0 0 .9rem;
  font-weight: 800;
  color: #0f1c2e;
  letter-spacing: .2px;
  font-size: clamp(1.15rem, 2.4vw, 1.45rem);
  text-wrap: balance;
  position: relative;
}
.more-links > h2::after{
  content:"";
  display:block;
  width: clamp(46px, 8vw, 86px);
  height: 4px;
  margin: 10px auto 0;
  border-radius: 999px;
  background: linear-gradient(90deg,#5aa9ff,#2c79cb);
  box-shadow: 0 6px 18px rgba(90,169,255,.28);
}


.more-links > ul{
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px 12px;
  justify-content: center;
}


.more-links > ul > li > a{
  --chip-bg: rgba(255,255,255,.82);
  --chip-shadow: rgba(8,27,53,.08);
  --g1:#b3d8fa; --g2:#5aa9ff; --g3:#2c79cb;

  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 10px 16px;
  border-radius: 9999px;
  background: var(--chip-bg);
  color: #0f1c2e;
  text-decoration: none;
  font-weight: 800;
  letter-spacing: .2px;
  line-height: 1.2;
  box-shadow: 0 6px 18px var(--chip-shadow), inset 0 -2px 0 rgba(255,255,255,.4);
  transition: transform .16s, box-shadow .16s, background .16s, color .16s, border-color .16s;
  border: 1px solid #cfe3fb; /* fallback */
  overflow: hidden;
}


.more-links > ul > li > a::before{
  content:"";
  position:absolute; inset: -1.5px;
  border-radius: inherit;
  background: linear-gradient(120deg, var(--g1), var(--g2), var(--g3));
  z-index: -1;
  
  padding: 2px;
  -webkit-mask: 
    linear-gradient(#000 0 0) content-box, 
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
}


.more-links > ul > li > a::after{
  content:"↗";
  margin-left: .55ch;
  font-weight: 900;
  opacity: .55;
  transform: translateX(0);
  transition: transform .16s, opacity .16s;
}

/* Hover / Focus */
.more-links > ul > li > a:hover{
  transform: translateY(-1px) scale(1.015);
  box-shadow: 0 10px 26px rgba(8,27,53,.12);
  background: rgba(255,255,255,.95);
  color: #0e3a6a;
  border-color: #a9d0ff;
}
.more-links > ul > li > a:hover::after{
  transform: translateX(2px);
  opacity: .9;
}
.more-links > ul > li > a:focus-visible{
  outline: 0;
  box-shadow: 0 0 0 3px rgba(35,122,228,.36), 0 10px 26px rgba(8,27,53,.12);
}


.more-links > ul > li > a{
  word-break: normal;
  overflow-wrap: anywhere;
  hyphens: auto;
  text-align: center;
}


@media (max-width: 540px){
  .more-links{ padding: .2rem .8rem 1rem; }
  .more-links > ul{ gap: 9px; }
  .more-links > ul > li > a{
    min-height: 40px;
    padding: 9px 14px;
  }
}


@media (prefers-reduced-motion: reduce){
  .more-links > ul > li > a,
  .more-links > ul > li > a::after{ transition: none; }
}


@media print{
  .more-links > h2::after{ display:none; }
  .more-links > ul{ display:block; }
  .more-links > ul > li{ margin-bottom: 6px; }
  .more-links > ul > li > a{
    display:inline; background: transparent; border: 0; box-shadow: none; padding: 0;
  }
}
/* === Anfrage button pinned bottom (flex version, no image shift) === */


.product-card{
  display: flex !important;
  flex-direction: column;
  align-items: center;       
  text-align: center;
  min-height: 380px;         
}


.product-card img{
  display: block;
  margin: 0 auto;
  align-self: center;        
}


.product-card h3,
.product-card p{ width: 100%; }


.product-card > .product-inquiry-btn{
  margin-top: auto !important;  
  align-self: center !important;
}


.product-card-content{
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}
.product-card-content .product-inquiry-btn{
  margin-top: auto !important;  
  align-self: center !important;
}


@media (max-width:700px){
  .product-card{ min-height: 360px; }
}

/* =========================================================
   Product pages responsive layout (mobile-first)
   ========================================================= */

body.products-page,
body.seo-landing {
  overflow-x: clip;
}

.products-page main.container,
body.seo-landing main.container,
main.container:has(.products-row) {
  padding-inline: var(--product-gutter);
  box-sizing: border-box;
}

/* Intro paragraph on listing pages */
.products-page .product-intro {
  max-width: 900px;
  margin: 0 auto 2rem;
  text-align: center;
  font-size: clamp(1.05rem, 1.3vw, 1.3rem);
  line-height: 1.75;
  font-weight: 400;
  color: #2e4a77;
  text-wrap: balance;
  box-sizing: border-box;
}

/* Title: constrain glow pseudo-element on mobile/tablet */
@media (max-width: 1023px) {
  .products-page .product-main-title::before,
  main.container:has(.products-row) .product-main-title::before {
    left: 0;
    right: 0;
    inset: -14px 0 auto 0;
  }
}

/* Product listing grid */
.products-page .products-row,
main.container:has(.products-row) .products-row {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(20px, 4vw, 38px);
  justify-items: center;
  margin: 32px auto 24px;
  padding-inline: 0;
  box-sizing: border-box;
}

.products-page .products-row .product-card,
main.container:has(.products-row) .products-row .product-card {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.products-page .products-row .product-card img,
main.container:has(.products-row) .products-row .product-card img {
  max-width: 100%;
  width: 100%;
  height: auto;
  object-fit: contain;
}

@media (min-width: 768px) and (max-width: 1023px) {
  .products-page .products-row,
  main.container:has(.products-row) .products-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .products-page .products-row .product-card,
  main.container:has(.products-row) .products-row .product-card {
    width: 100%;
    max-width: 340px;
    justify-self: center;
  }
}

@media (min-width: 1024px) {
  .products-page .products-row,
  main.container:has(.products-row) .products-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 38px;
  }

  .products-page .products-row .product-card,
  main.container:has(.products-row) .products-row .product-card {
    width: 270px;
    max-width: 270px;
  }
}

/* Subcategory tiles: respect container gutters */
@media (max-width: 767px) {
  .products-page .subcategory-cards-row,
  .subcategory-cards-row {
    padding-inline: 0;
    width: 100%;
    box-sizing: border-box;
  }

  .products-page .subcategory-card,
  .subcategory-card {
    width: 100% !important;
    max-width: min(520px, 100%);
  }
}

/* Subcategory tiles: 2 columns on tablet */
@media (min-width: 768px) and (max-width: 1023px) {
  .products-page .subcategory-cards-row,
  .subcategory-cards-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    justify-items: center;
    gap: clamp(18px, 3vw, 28px);
    width: 100%;
    padding-inline: 0;
    box-sizing: border-box;
  }

  .products-page .subcategory-card,
  .subcategory-card {
    width: 100% !important;
    max-width: min(340px, 100%);
    margin-inline: auto !important;
  }
}

/* ================================================================
   WARM / PREMIUM RESTYLE — pumpen family pilot
   Modernizes the legacy product-leaf pages to the unified DropsA warm
   product language (was a cool navy/blue theme). SCOPED to .pumpen-page
   only, so other legacy families, the new templates (ProductDetailHub /
   ProductCategory), the MMS series cards and the listing ProductCard are
   all untouched. CSS-only — no markup / content / data / URL changes;
   the inquiry button (.product-inquiry-btn + data-product) and the PDF
   datasheet link are preserved. Literal hex (legacy pages don't reliably
   expose the DS custom properties).
   ================================================================ */
body.pumpen-page{background:#f1ede3}

/* breadcrumbs — readable warm contrast */
body.pumpen-page .breadcrumb-nav,
body.pumpen-page .breadcrumb-list,
body.pumpen-page .breadcrumb-list a{color:#6b6457}
body.pumpen-page .breadcrumb-list a:hover{color:#16120f}

/* page title — warm ink + orange accent (was navy + blue gradient) */
body.pumpen-page .product-main-title{color:#16120f}
body.pumpen-page .product-main-title::after{background:#ff4d23}

/* intro / description */
body.pumpen-page .product-description,
body.pumpen-page .product-intro{color:#5b564a}

/* product card — warm premium (was cool white + blue accents/shadow) */
body.pumpen-page .product-card{background:#f5eee0;border:1px solid #e3d7bf;box-shadow:0 18px 40px -30px rgba(60,42,18,.4)}
body.pumpen-page .product-card img{background:#e8ddc6;border:1px solid #dccfb3;box-shadow:none}
body.pumpen-page .product-card h3{color:#16120f}
body.pumpen-page .product-card h3::after{background:#ff4d23;opacity:1}
body.pumpen-page .product-card p{color:#534e43}

/* inquiry (Anfrage) — orange brand button (was blue gradient) */
body.pumpen-page .product-inquiry-btn{background:#ff4d23;background-image:none;box-shadow:0 12px 26px -14px rgba(255,77,35,.55)}
body.pumpen-page .product-inquiry-btn:hover{background:#d8431d;background-image:none}

/* datasheet / PDF link — warm (link itself preserved) */
body.pumpen-page .pc-datasheet{color:#16120f;border-color:#d8cebb}
body.pumpen-page .pc-datasheet:hover{color:#d8431d;border-color:#ff4d23}

/* SEO prose — warm ink headings, warm body, orange links */
body.pumpen-page .seo-content{color:#5b564a}
body.pumpen-page .seo-content h1,
body.pumpen-page .seo-content h2,
body.pumpen-page .seo-content h3,
body.pumpen-page .seo-content h4{color:#16120f}
body.pumpen-page .seo-content a{color:#d8431d}

/* related / more-links — warm accent */
body.pumpen-page .more-links > h2{color:#16120f}
body.pumpen-page .more-links > h2::after{background:#ff4d23}