/* =====================================================================
   SWISSINNO product page redesign 2026 (everything below the header)
   Scope: everything inside .pp2026 (backend layout "ProductPage2026").
   The header styles live in header-2026.css.
   Design canvas 1400px, full-width bands up to 1920px, 16px mobile gutter
   ===================================================================== */
.page-wrapper.pp2026 { padding: 0; }

.pp26-band {
  width: 100%;
  max-width: var(--pp26-max);
  margin: 0 auto;
  background: var(--pp26-grey);
}

.pp26-section { position: relative; }

.pp26-heading {
  margin: 0;
  font-family: var(--pp26-font-cn);
  font-weight: 800;
  font-size: 36px;
  line-height: 1;
  text-transform: uppercase;
  color: var(--pp26-text);
}

.pp26-heading--center { text-align: center; }

.pp26-label {
  margin: 0 0 12px;
  font-family: var(--pp26-font-cn);
  font-weight: 800;
  font-size: 24px;
  line-height: 1;
  letter-spacing: .025em;
  text-transform: uppercase;
  color: var(--pp26-text);
}

.pp26-card {
  background: var(--pp26-white);
  border: 1px solid var(--pp26-grey-3);
  border-radius: 6px;
}

.pp26-placeholder { display: block; width: 100%; aspect-ratio: 1 / 1; background: #f4f4f4; }

.pp26-product__gallery, .pp26-product__content, .pp26-stakes__col, .pp26-social__reviews, .pp26-social__faq { min-width: 0; }

/* Buttons ------------------------------------------------------------ */

.pp2026 .pp26-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: min(334px, 100%);
  max-width: 100%;
  min-height: 54px;
  padding: 12px 63px;
  background: var(--pp26-red);
  color: var(--pp26-white);
  border: 0;
  border-radius: 4px;
  font-family: var(--pp26-font-cn);
  font-weight: 800;
  font-size: 24px;
  line-height: 30px;
  letter-spacing: .025em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background-color .15s ease;
}

.pp2026 .pp26-btn:hover, .pp2026 .pp26-btn:focus-visible { background: #b60018; color: var(--pp26-white); text-decoration: none; }

.pp2026 .pp26-btn:focus-visible { outline: 3px solid var(--pp26-text); outline-offset: 2px; }

.pp2026 .pp26-btn .pp26-btn__arrow { position: absolute; right: 13px; top: 50%; transform: translateY(-50%); }
.pp26-btn__arrow {
  display: inline-block;
  flex: none;
  width: 28px;
  height: 28px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96'%3E%3Cpath d='M8 48h79M49 9l39 39-39 39' fill='none' stroke='black' stroke-width='7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96'%3E%3Cpath d='M8 48h79M49 9l39 39-39 39' fill='none' stroke='black' stroke-width='7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* 2. Hero banner + USP bar ---------------------------------------------- */

.pp26-hero { position: relative; display: flex; align-items: center; width: 100%; max-width: var(--pp26-max); margin: 0 auto; min-height: 436px; overflow: hidden; background: #111; }

.pp26-hero__picture, .pp26-hero__img { position: absolute; inset: 0; width: 100%; height: 100%; }

.pp26-hero__img { object-fit: cover; object-position: center; }

/* Desktop: same proportions as the supercat design (.s-hero: aspect-ratio 1400/436, min-height 436px,
   content pinned 7.34% from the top) so the banner scales with the viewport instead of growing with the text. */
@media (min-width: 768px) {
  .pp26-hero { aspect-ratio: 1400 / 436; align-items: flex-start; }
  .pp26-hero__container { padding-top: 2.285%; padding-bottom: 0; }
}

.pp26-hero__container { position: relative; width: 100%; max-width: none; padding: 48px var(--pp26-gutter) 52px max(var(--pp26-gutter), 4.6%); }

.pp26-hero__content {
  position: relative;
  max-width: 48%;
  text-align: left;
}

.pp26-hero__content h1, .pp26-hero__content h2, .pp26-hero__content h1 span, .pp26-hero__content h2 span {
  margin: 0;
  font-family: var(--pp26-font-display) !important;
  font-weight: 600;
  font-size: clamp(32px, 4.3vw, 60px) !important;
  line-height: 1 !important;
  letter-spacing: .025em;
  color: var(--pp26-white);
  text-shadow: 0 0 30px rgba(0,0,0,.6), 1px 1px 15px rgba(0,0,0,.3);
  text-transform: none;
}

.pp26-hero__content h1 + h1, .pp26-hero__content h1 + h2, .pp26-hero__content h2 + h2, .pp26-hero__content p {
  margin-top: 21px;
  font-family: var(--pp26-font-display) !important;
  font-weight: 600;
  font-size: clamp(20px, 2.5vw, 35px) !important;
  line-height: 42px !important;
  letter-spacing: .025em;
  color: var(--pp26-white);
  text-shadow: 0 0 30px rgba(0,0,0,.6), 1px 1px 15px rgba(0,0,0,.3);
}

.pp26-hero__content h1 + h1 span, .pp26-hero__content h2 + h2 span, .pp26-hero__content h1 + h2 span { font-size: inherit !important; line-height: inherit !important; }

.pp26-hero__content .pp26-btn { margin-top: 32px; }

.pp26-hero__content .buy-now-button { display: none; }

/* Mobile-only full-bleed BUY NOW band, sibling of .pp26-hero (see Banner2026.html) —
   shown only at max-width:767px, where .pp26-hero__cta (the overlay in .pp26-hero__content)
   is hidden instead, matching supercat-build's _02-hero.scss / _03-usp-strip.scss fix. */
.pp2026 .pp26-hero__cta-mobile { display: none; }

.pp26-usp { background: var(--pp26-red); color: var(--pp26-white); min-height: 41px; }

.pp26-usp__inner { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px clamp(16px, 4vw, 114px); min-height: 41px; padding-top: 6px; padding-bottom: 6px; }

.pp26-usp__inner p {
  position: relative;
  margin: 0;
  font-family: var(--pp26-font-cn);
  font-weight: 800;
  font-size: 18px;
  line-height: 1.4;
  text-transform: uppercase;
  text-align: center;
}

.pp26-usp__inner p:not(:last-child)::after { content: ""; display: inline-block; width: 10px; height: 6px; margin-left: clamp(16px, 4vw, 114px); vertical-align: middle; background: currentColor; opacity: .6; }

/* 3. Stakes: problem / solution panels ----------------------------------- */

.pp26-stakes { padding-top: 33px; }

.pp26-stakes__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 26px; }

.pp26-stakes__col > .frame, .pp26-stakes__col > a + .frame { height: 100%; }

.pp26-stakes__arrow { position: absolute; left: 50%; top: 58%; width: 77px; height: 77px; transform: translate(-50%, -50%); z-index: 2; }

.pp26-panel { height: 100%; border-radius: 8px; overflow: hidden; display: flex; flex-direction: column; }

.pp26-panel__header { display: flex; align-items: center; gap: 25px; min-height: 90px; padding: 24px 32px; }

.pp26-panel__icon { flex: none; height: 40px; width: auto; }

.pp2026 .pp26-panel__title { margin: 0; font-family: var(--pp26-font-cn); font-weight: 800; font-size: 36px; line-height: 1; text-transform: uppercase; }

.pp26-panel--problem .pp26-panel__header { background: var(--pp26-red-line); border-bottom: 2px solid var(--pp26-red-line-2); }

.pp26-panel--problem .pp26-panel__title { color: var(--pp26-red); }

.pp26-panel--problem .pp26-panel__body { background: var(--pp26-red-soft); border: 1px solid var(--pp26-red-line-2); border-top: 0; }

.pp26-panel--solution .pp26-panel__header { background: var(--pp26-green-soft); border-bottom: 2px solid var(--pp26-green-line); }

.pp26-panel--solution .pp26-panel__title { color: var(--pp26-green); }

.pp26-panel--solution .pp26-panel__body { background: var(--pp26-grey); border: 1px solid var(--pp26-green-line); border-top: 0; }

.pp26-panel__body { flex: 1 1 auto; padding: 24px 32px 35px 27px; }

/* keep the centre arrow badge (overlaps both panels by (arrow - gap) / 2) clear of the row content */
@media (min-width: 992px) {
  .pp26-stakes__grid { --pp26-arrow: 77px; --pp26-arrow-clear: calc((var(--pp26-arrow) - var(--pp26-gap)) / 2 + 22px); --pp26-gap: 26px; }
  .pp26-stakes__col:first-child .pp26-panel__body { padding-right: max(32px, var(--pp26-arrow-clear)); }
  .pp26-stakes__col:last-child .pp26-panel__body { padding-left: max(27px, var(--pp26-arrow-clear)); }
}

/* Feature rows / stacks (shared) ---------------------------------------- */

.pp26-feature { display: flex; align-items: flex-start; gap: 19px; }

.pp26-feature__icon { flex: none; width: 60px; height: 60px; object-fit: contain; }

.pp26-feature__title, .pp26-feature__title p, .pp26-feature__title span { margin: 0; font-weight: 700; font-size: 18px !important; line-height: 1.25 !important; color: var(--pp26-text); font-family: var(--pp26-font-body) !important; }

.pp26-feature__desc, .pp26-feature__desc p, .pp26-feature__desc span { margin: 0; font-size: 16px !important; line-height: 1.4 !important; color: var(--pp26-muted); font-family: var(--pp26-font-body) !important; }

.pp26-feature__desc { margin-top: 8px; }

.pp2026 .pp26-feature--row .pp26-feature__title, .pp2026 .pp26-feature--row .pp26-feature__title p, .pp2026 .pp26-feature--row .pp26-feature__title span { font-size: 18px !important; line-height: 18px !important; }
.pp2026 .pp26-feature--row .pp26-feature__title { margin-top: 5px; }
.pp2026 .pp26-feature--row .pp26-feature__desc, .pp2026 .pp26-feature--row .pp26-feature__desc p, .pp2026 .pp26-feature--row .pp26-feature__desc span { font-size: 18px !important; line-height: 24px !important; }
.pp2026 .pp26-feature--row .pp26-feature__desc { margin-top: 9px; }
.pp26-feature--row .pp26-feature__icon { width: 60px; height: 60px; object-fit: contain; }
.pp26-feature--row + .pp26-feature--row { margin-top: 27px; padding-top: 22px; border-top: 2px solid #e3e1e1; }

.pp26-feature--stack { flex-direction: column; align-items: center; text-align: center; gap: 0; }

.pp26-feature--stack .pp26-feature__icon { width: auto; height: 25px; margin-bottom: 13px; }

.pp26-feature--stack .pp26-feature__title, .pp26-feature--stack .pp26-feature__title p { font-size: 18px !important; line-height: 18px !important; }

.pp26-feature--stack .pp26-feature__desc { margin-top: 2px; }

.pp26-feature--stack .pp26-feature__desc, .pp26-feature--stack .pp26-feature__desc p { font-size: 15px !important; line-height: 17px !important; }

.pp26-feature--tech { gap: 14px; }

.pp26-feature--tech .pp26-feature__icon { width: auto; height: 29px; }

.pp26-feature--tech .pp26-feature__text { max-width: 261px; }

.pp26-feature--tech .pp26-feature__title, .pp26-feature--tech .pp26-feature__title p { font-size: 15px !important; line-height: 15px !important; text-transform: uppercase; letter-spacing: .03em; }

.pp26-feature--tech .pp26-feature__desc { margin-top: 4px; }

.pp26-feature--tech .pp26-feature__desc, .pp26-feature--tech .pp26-feature__desc p { font-size: 15px !important; line-height: 1.3 !important; }

/* 4. + 5. Product slider and advantages ---------------------------------- */

.pp26-product { padding-top: 30px; padding-bottom: 7px; }

.pp26-product__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 49px; align-items: start; }

.pp2026 .pp26-product__gallery { padding: 0 !important; }

.pp2026 .pp26-product__gallery .frame { margin: 0; }

.pp2026 .pp26-product__gallery .slider-top { margin-bottom: 0 !important; position: relative; background: var(--pp26-grey); border: 1px solid #eaeaea; border-radius: 4px; padding: 12px; }

.pp2026 .pp26-product__gallery .cSlider--single .cSlider__item img { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: contain; }

.pp2026 .pp26-product__gallery .cSlider__item--video { aspect-ratio: 1 / 1; display: flex !important; align-items: center; justify-content: center; }

.pp2026 .pp26-product__gallery .cSlider__item--video iframe, .pp2026 .pp26-product__gallery .cSlider__item--video video { width: 100%; height: 100%; aspect-ratio: 1 / 1; border: 0; background: #000; }

.pp2026 .pp26-product__gallery .slick-arrows { position: absolute; inset: 0; pointer-events: none; }

.pp2026 .pp26-product__gallery .slick-arrows button { pointer-events: auto; position: absolute; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; border: 0; background: rgba(255,255,255,.85); border-radius: 50%; display: flex; align-items: center; justify-content: center; }

.pp2026 .pp26-product__gallery .slick-arrows .slick-prev { left: 10px; }

.pp2026 .pp26-product__gallery .slick-arrows .slick-next { right: 10px; }

.pp2026 .pp26-product__gallery .slick-arrows img { width: 14px; height: auto; }

.pp2026 .pp26-product__gallery .slider-bottom { width: auto !important; margin: 12px 0 0; }

.pp2026 .pp26-product__gallery .cSlider--nav .slick-track { display: flex; gap: 12px; margin: 0; }

.pp2026 .pp26-product__gallery .cSlider--nav .cSlider__item { position: relative; width: 56px !important; height: 56px; overflow: hidden; background: var(--pp26-white); border: 1px solid var(--pp26-grey-3); border-radius: 4px; cursor: pointer; }

.pp2026 .pp26-product__gallery .cSlider--nav .cSlider__item img { width: 100%; height: 100%; object-fit: cover; display: block; }

.pp2026 .pp26-product__gallery .cSlider--nav .slick-current.cSlider__item, .pp2026 .pp26-product__gallery .cSlider--nav .is-active.cSlider__item { border-color: var(--pp26-red); box-shadow: 0 0 0 1px var(--pp26-red); }

.pp2026 .cSlider__play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(0,0,0,.35); color: var(--pp26-white); }

.pp2026 .cSlider__play svg { width: 16px; height: 16px; fill: currentColor; }

.pp26-advantages__title, .pp2026 h1.pp26-advantages__title, .pp2026 h2.pp26-advantages__title { margin: 17px 0 0; font-family: var(--pp26-font-body); font-weight: 700; font-size: 36px; line-height: 1; color: var(--pp26-red); text-transform: none; }

.pp26-advantages__intro { margin-top: 21px; font-size: 18px; line-height: 1.25; color: var(--pp26-text); }

.pp26-advantages__intro h3, .pp26-advantages__intro h4 { font-size: 20px; margin: 16px 0 6px; font-family: var(--pp26-font-body); font-weight: 700; color: var(--pp26-text); }

.pp26-advantages__intro p, .pp26-advantages__intro li { font-size: 18px !important; line-height: 1.45; font-family: var(--pp26-font-body) !important; }

.pp26-advantages__intro span { font-family: inherit !important; }

.pp26-advantages__intro ul { padding-left: 20px; margin: 6px 0 12px; }

.pp26-advantages__key { margin-top: 91px; padding: 20px 36px 16px; }

.pp26-advantages__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 21px 0; }

.pp26-safety { display: flex; align-items: flex-start; gap: 20px; margin-top: 22px; padding: 14px 24px 14px; background: var(--pp26-red-soft); border: 1px solid var(--pp26-red-line); border-radius: 4px; }

.pp26-safety__icon { flex: none; height: 40px; width: auto; }

.pp2026 .pp26-safety__label { margin: 0; font-family: var(--pp26-font-cn); font-weight: 800; font-size: 18px; line-height: 1; text-transform: uppercase; color: var(--pp26-red); }

.pp26-safety__body { margin-top: 8px; }

.pp26-safety__body p, .pp26-safety__body span { margin: 0; font-size: 15px !important; line-height: 1.35 !important; color: var(--pp26-muted); font-family: var(--pp26-font-body) !important; }

.pp2026 .pp26-advantages__cta { margin-top: 20px; width: 342px; min-height: 52.5px; max-width: 100%; }

/* 6. Technology & certifications ----------------------------------------- */

.pp26-tech { padding-top: 32px; }

.pp26-tech__inner { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; align-items: start; max-width: 1920px; padding-top: 24.5px; padding-bottom: 15.5px; padding-left: max(var(--pp26-gutter), 5.714285714%); padding-right: var(--pp26-gutter); }
.pp26-tech__inner > .pp26-tech__heading { grid-column: span 2; }
.pp26-tech__inner .pp26-feature { grid-column: span 3; }

.pp2026 .pp26-tech__heading { margin: 0; font-family: var(--pp26-font-cn); font-weight: 800; font-size: 24px; line-height: 1; letter-spacing: .03em; text-transform: uppercase; color: var(--pp26-text); }

.pp26-tech__items { display: contents; }

/* 7. Customer reviews + 8. FAQ AI prompts (one row, 5/7 columns) ------------- */

.pp26-social { padding-top: 51px; }

.pp26-social__grid { display: grid; grid-template-columns: calc((100% + 74px) * 5 / 12 - 74px) calc((100% + 74px) * 7 / 12 - 74px); gap: 74px; }

.pp26-social__reviews .frame, .pp26-social__faq .frame { margin: 0; }

.pp26-accent { color: var(--pp26-red); }

.pp2026 .pp26-reviews__heading, .pp2026 .pp26-faqai__heading {
  margin: 0; font-family: var(--pp26-font-cn); font-weight: 800; font-size: 36px; line-height: 40px;
  letter-spacing: .025em; text-transform: uppercase; color: var(--pp26-text);
}

.pp26-reviews__box { margin-top: 16px; padding: 24px; background: #f4f4f4; color: var(--pp26-text); font-size: 16px; line-height: 1.45; }

.pp26-reviews__box--widget { padding: 0; background: none; }
.pp26-reviews__box p { margin: 0 0 12px; }

.pp26-reviews__box p:last-child { margin-bottom: 0; }

.pp2026 .pp26-reviews__cta { margin-top: 39px; min-width: 345px; }

.pp2026 .pp26-faqai__heading { margin-top: -13px; }

.pp26-acc { margin-top: 39px; }

.pp26-acc__item { border: 0; border-bottom: 2px solid #f1f1f2; }

.pp26-acc__question {
  position: relative; display: block; padding: 17px 40px 17px 0; list-style: none; cursor: pointer;
  font-weight: 700; font-size: 18px; line-height: 23px; color: var(--pp26-text);
}

.pp26-acc__question::-webkit-details-marker { display: none; }

.pp26-acc__question::marker { content: ""; }

/* grey/red circle icon, matching the bottom FAQ block (.pp26-faq header::after) */
.pp26-acc__question::after {
  content: ""; position: absolute; right: 4px; top: 50%; width: 32px; height: 32px; margin-top: -16px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='15' fill='none' stroke='%236e6e6e'/%3E%3Cpath d='M10 16h12M16 10v12' stroke='%236e6e6e' stroke-width='2' stroke-linecap='square'/%3E%3C/svg%3E") center/contain no-repeat;
}

.pp26-acc__item[open] > .pp26-acc__question::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='15' fill='none' stroke='%23d6001c'/%3E%3Cpath d='M10 16h12' stroke='%23d6001c' stroke-width='2' stroke-linecap='square'/%3E%3C/svg%3E");
}

/* desktop: same red "+" without circle as on mobile (open = red "-"); bird page keeps the circle */
.pp2026:not(.pp26-bird) .pp26-acc__question::after { width: 22px; height: 22px; margin-top: -11px; right: 6px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2 8h12M8 2v12' stroke='%23d6001c' stroke-width='2.4' stroke-linecap='square'/%3E%3C/svg%3E"); }

.pp2026:not(.pp26-bird) .pp26-acc__item[open] > .pp26-acc__question::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2 8h12' stroke='%23d6001c' stroke-width='2.4' stroke-linecap='square'/%3E%3C/svg%3E"); }

.pp26-acc__question:focus-visible { outline: 3px solid var(--pp26-text); outline-offset: 2px; }

.pp26-acc__answer { padding: 0 0 20px; font-size: 18px; line-height: 1.4; color: var(--pp26-text); }

.pp26-acc__answer p { margin: 0 0 10px; }

.pp26-acc__answer p:last-child { margin-bottom: 0; }

.pp2026 .pp26-product__gallery .cSlider--nav .cSlider__poster { display: block; width: 100%; height: 100%; background: #3a3a3a; }

/* 9. How to use (existing howtoUse2024 markup) --------------------------- */

.pp26-howto { padding-top: 53px; }

.pp2026 .pp26-howto .frame { margin: 0 !important; }

.pp2026 .pp26-howto .redesign-howtouse2024 .accordion-title {
  display: flex; align-items: center; justify-content: center; width: 100%; max-width: var(--pp26-max); min-height: 67px; margin: 0 auto; padding: 12px var(--pp26-gutter);
  background: var(--pp26-red); color: var(--pp26-white); text-align: center; cursor: default; pointer-events: none;
}

.pp2026 .pp26-howto .redesign-howtouse2024 .accordion-title h2, .pp2026 .pp26-howto .redesign-howtouse2024 .accordion-title h3,
.pp2026 .pp26-howto .redesign-howtouse2024 .accordion-title .user-defined-header {
  margin: 0; font-family: var(--pp26-font-cn) !important; font-weight: 900; font-size: 36px !important; line-height: 1; letter-spacing: .04em; text-transform: uppercase; color: var(--pp26-white);
}

.pp2026 .pp26-howto .redesign-howtouse2024 .accordion-title::after { display: none; }

.pp2026 .pp26-howto .redesign-howtouse2024 .container { max-width: var(--pp26-canvas); padding: 0 var(--pp26-gutter); }

.pp2026 .pp26-howto .redesign-howtouse2024 .accordion-body { display: block !important; padding: 0; }

.pp2026 .pp26-howto .howtousemobile { display: none; }
/* the old theme hides this block on small screens: it is the only one we style, so it must always show */
.pp2026 .pp26-howto .howtousedesktop { display: block !important; }

.pp2026 .pp26-howto .howtousedesktop .product-usage-image { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 24px; }

.pp2026 .pp26-howto .howtousedesktop .product-usage-step { display: block; width: 100% !important; max-width: none !important; float: none; margin: 0; padding: 0; }

.pp2026 .pp26-howto .howtousedesktop .product-usage-step img { display: block; width: 100% !important; max-width: none !important; height: auto !important; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 4px; }

.pp2026 .pp26-howto .howtousedesktop .product-usage-step p { margin: 10px 0 0; }

.pp2026 .pp26-howto .howtousedesktop .product-usage-step p:first-of-type { margin-top: 9px; line-height: 15px; }
.pp2026 .pp26-howto .howtousedesktop .product-usage-step p:first-of-type span { line-height: 15px !important; }
.pp2026 .pp26-howto .howtousedesktop .product-usage-step img { margin-bottom: 0 !important; }
.pp2026 .pp26-howto .howtousedesktop .product-usage-step p { margin-bottom: 0 !important; }
/* description under the step title (second paragraph of the step text): 13px/16px grey, 13px below the title */
.pp2026 .pp26-howto .howtousedesktop .product-usage-step p + p { margin: 15px 0 0; font-family: var(--pp26-font-body); font-size: 15px !important; font-weight: 400; line-height: 18px !important; color: var(--pp26-muted) !important; }
.pp2026 .pp26-howto .howtousedesktop .product-usage-step p span, .pp2026 .pp26-howto .howtousedesktop .product-usage-step p strong { font-family: var(--pp26-font-body) !important; }

.pp2026 .pp26-howto .howtousedesktop .product-usage-step .red-text span[style*="font-size:36px"] { font-size: 15px !important; color: var(--pp26-red); }

.pp2026 .pp26-howto .howtousedesktop .product-usage-step .red-text span[style*="font-size:20px"] { font-size: 15px !important; color: var(--pp26-text); }

.pp2026 .pp26-howto .bottom-image { position: relative; max-width: var(--pp26-canvas); margin: 46px auto 0; padding: 0 var(--pp26-gutter); }

.pp2026 .pp26-howto .bottom-image img { width: 100%; height: auto !important; min-height: 0 !important; aspect-ratio: 1400 / 584; object-fit: cover; display: block; margin-top: 0 !important; position: static !important; }

.pp2026 .pp26-howto .bottom-image .bottom-img-text { position: absolute; left: calc(max(16px, 4.571428571%) + 1.143%); top: 1.7123%; width: auto !important; min-width: 0 !important; max-width: 80% !important; height: auto !important; margin: 0; padding: 0 !important; background: none !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; z-index: 1; text-shadow: 0 0 20px rgba(0,0,0,.45); }

.pp2026 .pp26-howto .bottom-image .bottom-img-text p { margin: 0; white-space: nowrap; }

.pp2026 .pp26-howto .bottom-image .bottom-img-text, .pp2026 .pp26-howto .bottom-image .bottom-img-text * { background: none !important; box-shadow: none !important; border-radius: 0 !important; }

.pp2026 .pp26-howto .bottom-image .bottom-img-text p, .pp2026 .pp26-howto .bottom-image .bottom-img-text strong { padding: 0 !important; }

.pp2026 .pp26-howto .bottom-image .bottom-img-text p, .pp2026 .pp26-howto .bottom-image .bottom-img-text span { color: var(--pp26-white) !important; font-family: var(--pp26-font-body) !important; }

.pp2026 .pp26-howto .bottom-image .bottom-img-text span[style*="font-size:36px"] { font-size: clamp(18px, 2vw, 24px) !important; line-height: 1.2 !important; font-weight: 700 !important; }

.pp2026 .pp26-howto .bottom-image .bottom-img-text span[style*="font-size:20px"] { font-size: clamp(18px, 2vw, 24px) !important; line-height: 1.2 !important; font-weight: 700 !important; }
.pp2026 .pp26-howto .bottom-image .bottom-img-text strong { display: flex; align-items: baseline; gap: 26px; }

.pp2026 .pp26-howto .redesign-howtouse2024 > .accordion > .buy-now-button { position: relative; display: block; max-width: 1920px; top: auto; right: auto; bottom: auto; left: auto; transform: none; width: auto; margin: -74px auto 0; padding: 0 max(16px, 4.357142857%) 24px max(16px, 4.571428571%); text-align: left; z-index: 2; }
.pp2026 .pp26-howto .redesign-howtouse2024 .buy-now-button a { margin-left: 2.117647%; }
.pp2026 .pp26-howto .redesign-howtouse2024 .buy-now-button a { display: flex; width: 326.5px; max-width: 100%; height: 50px; border: 0; box-shadow: none; }
.pp2026 .pp26-howto .redesign-howtouse2024 .buy-now-button a::after { border-radius: 0; }
/* the old theme positions the caption text absolutely with a shadow: keep it in the flow */
.pp2026 .pp26-howto .bottom-image .bottom-img-text .red-text { display: block; position: static; left: auto; top: auto; padding: 0; text-align: left; line-height: 1.2; box-shadow: none; }

.pp2026 .pp26-howto .redesign-howtouse2024 .buy-now-button .circle { display: none; }

.pp2026 .pp26-howto .redesign-howtouse2024 .buy-now-button a {
  position: relative; display: inline-flex; align-items: center; justify-content: center; min-width: 326.5px; min-height: 50px; padding: 10px 63px;
  background: var(--pp26-red); color: var(--pp26-white); border-radius: 4px; font-family: var(--pp26-font-cn); font-weight: 800; font-size: 24px; letter-spacing: .025em; text-transform: uppercase; text-decoration: none;
}

.pp2026 .pp26-howto .redesign-howtouse2024 .buy-now-button a::after { content: ""; position: absolute; right: 13px; top: 50%; transform: translateY(-50%); width: 28px; height: 28px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96'%3E%3Cpath d='M8 48h79M49 9l39 39-39 39' fill='none' stroke='black' stroke-width='7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96'%3E%3Cpath d='M8 48h79M49 9l39 39-39 39' fill='none' stroke='black' stroke-width='7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat; }

/* 10. Associated products ------------------------------------------------ */

.pp26-associated { padding-top: 28px; padding-bottom: 2px; }

.pp26-associated__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 25px; margin-top: 27px; }

.pp26-associated__card { display: flex; flex-direction: column; align-items: center; padding: 33px 17px 43px; text-align: center; }

.pp26-associated__photo { display: block; width: 100%; }

.pp26-associated__photo img { width: 100%; aspect-ratio: 373 / 374; object-fit: contain; }

.pp2026 .pp26-associated__title { margin: 24px 0 0; font-family: var(--pp26-font-body); font-weight: 700; font-size: 18px; line-height: 1.3; color: var(--pp26-text); text-transform: none; }

.pp26-sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.pp2026 .pp26-associated__link { margin-top: 36px; font-weight: 700; font-size: 13px; line-height: 13px; color: var(--pp26-red); text-decoration: none; }

.pp2026 .pp26-associated__link:hover { text-decoration: underline; }

/* 11. Find your pest ----------------------------------------------------- */

.pp26-pest { padding-top: 36px; }

.pp26-pest__band { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px 24px; min-height: 89px; padding: 16px max(var(--pp26-gutter), 7.3%) 16px max(var(--pp26-gutter), 9.4%); }

.pp26-pest__intro { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 24px; }

.pp2026 .pp26-pest__heading { flex: none; min-width: 308px; margin: 0; font-family: var(--pp26-font-cn); font-weight: 900; font-size: 36px; line-height: 48px; text-transform: uppercase; color: var(--pp26-text); white-space: nowrap; }

.pp26-pest__icon { flex: none; height: 60px; width: auto; }

.pp26-pest__body { flex: 1 1 260px; margin-left: 38px; font-size: 15px; line-height: 1.3; color: var(--pp26-text); }

.pp26-pest__body p { margin: 0; }

.pp2026 .pp26-pest__cta { min-width: min(332px, 100%); min-height: 46.5px; padding: 0 63px 0 51px; justify-content: flex-start; font-size: 24px; }

/* 12. Call to action ----------------------------------------------------- */

.pp26-cta { padding-top: 0; }

.pp26-cta__band { padding: 0; background: none; }

.pp26-cta__grid { display: grid; grid-template-columns: calc((100% + 51px) * 5 / 12 - 51px) calc((100% + 51px) * 7 / 12 - 51px); gap: 51px; align-items: start; }

.pp26-cta__info { margin-top: 161px; padding: 27px 34px 42px; }

.pp2026 .pp26-cta__heading { margin: 0; font-family: var(--pp26-font-body); font-weight: 700; font-size: 36px; line-height: 1; color: var(--pp26-red); text-transform: none; }

.pp26-cta__checks { list-style: none; margin: 41px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 23px 30px; }

.pp26-check { display: flex; align-items: center; gap: 17px; }

.pp26-check__icon { flex: none; width: 30px; height: 30px; }

.pp26-check__label, .pp26-check__label p { margin: 0; font-weight: 700; font-size: 18px; color: var(--pp26-text); font-family: var(--pp26-font-body) !important; }

.pp2026 .pp26-cta__cta { margin-top: 53px; width: 342px; min-height: 52.5px; max-width: 100%; }

.pp26-cta__packshot { margin-top: 46px; padding: 16px; background: #f6f6f6; }

.pp26-cta__packshot img { display: block; width: 100%; aspect-ratio: 1 / 1; object-fit: contain; }

/* Accessory (existing slider + text, reuse product grid) ------------------ */

.pp26-accessory { padding-top: 56px; }

.pp26-accessory .pp26-product__grid { margin-top: 32px; }

.pp2026 .pp26-accessory__text .frame { margin: 0; }

.pp2026 .pp26-accessory__text header h2, .pp2026 .pp26-accessory__text header h3 { font-family: var(--pp26-font-body); font-weight: 700; font-size: 30px; line-height: 1.1; color: var(--pp26-red); text-transform: none; margin: 0 0 16px; }

.pp2026 .pp26-accessory__text h3 { font-size: 20px; margin: 16px 0 6px; font-family: var(--pp26-font-body); font-weight: 700; color: var(--pp26-text); }

.pp2026 .pp26-accessory__text p, .pp2026 .pp26-accessory__text li { font-size: 17px !important; line-height: 1.45; font-family: var(--pp26-font-body) !important; }

.pp2026 .pp26-accessory__text span { font-family: inherit !important; }

.pp2026 .pp26-accessory__text .buynowbutton-2024 .circle { display: none; }

.pp2026 .pp26-accessory__text .buynowbutton-2024 .buy-now-button a { display: inline-flex; align-items: center; gap: 16px; min-width: 280px; min-height: 52px; padding: 10px 28px; margin-top: 20px; background: var(--pp26-red); color: var(--pp26-white); border-radius: 999px; font-family: var(--pp26-font-cn); font-weight: 700; font-size: 22px; letter-spacing: .04em; text-transform: uppercase; text-decoration: none; }

/* 13. FAQ (existing header + textmedia accordion) ------------------------- */

.pp26-faq { padding-top: 49px; }

.pp2026 .pp26-faq .productfaq :is(h1, h2, h3, h4, h5, h6, .user-defined-header)::after { content: none !important; display: none !important; }

.pp2026 .pp26-faq .productfaq > .frame-type-header { margin: 0 0 19px; }

.pp2026 .pp26-faq .productfaq > .frame-type-header header * { font-family: var(--pp26-font-cn) !important; font-weight: 800; font-size: 36px !important; line-height: 1; text-transform: uppercase; text-align: center; color: var(--pp26-text); margin: 0; }

.pp2026 .pp26-faq .productfaq .row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 100px; margin: 0; }

.pp2026 .pp26-faq .productfaq .row .col { padding: 0; width: auto; max-width: none; flex: none; }

.pp2026 .pp26-faq .productfaq .row .col .frame { margin: 0; border-bottom: 2px solid #f1f1f2; }

.pp2026 .pp26-faq .productfaq .row .col header { position: relative; padding: 17px 48px 17px 0; cursor: pointer; }

.pp2026 .pp26-faq .productfaq .row .col header h5, .pp2026 .pp26-faq .productfaq .row .col header h4, .pp2026 .pp26-faq .productfaq .row .col header h3 { margin: 0; font-family: var(--pp26-font-body); font-weight: 700; font-size: 18px; line-height: 23px; color: var(--pp26-text); text-transform: none; }

.pp2026 .pp26-faq .productfaq .row .col header::after { content: ""; position: absolute; right: 4px; top: 50%; width: 32px; height: 32px; margin-top: -16px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='15' fill='none' stroke='%236e6e6e'/%3E%3Cpath d='M10 16h12M16 10v12' stroke='%236e6e6e' stroke-width='2' stroke-linecap='square'/%3E%3C/svg%3E") center/contain no-repeat; }

.pp2026 .pp26-faq .productfaq .row .col header.active::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='15' fill='none' stroke='%23d6001c'/%3E%3Cpath d='M10 16h12' stroke='%23d6001c' stroke-width='2' stroke-linecap='square'/%3E%3C/svg%3E"); }

.pp2026 .pp26-faq .productfaq .row .col header + * { display: none; padding: 0 0 20px; font-size: 18px; line-height: 1.4; color: var(--pp26-text); }

.pp2026 .pp26-faq .productfaq .row .col header + *.acc-open { display: block; }

/* 14. Downloads ---------------------------------------------------------- */

.pp26-downloads { padding: 67px 0 80px; }

.pp2026 .pp26-downloads .frame { margin: 0 !important; }

.pp2026 .pp26-downloads header * { margin: 0; font-family: var(--pp26-font-cn) !important; font-weight: 800; font-size: 36px !important; line-height: 1; text-align: center; color: var(--pp26-text); text-transform: none; }

.pp2026 .pp26-downloads .ce-uploads { list-style: none; margin: 40px 0 0; padding: 0; display: flex; flex-direction: column; gap: 17px; align-items: center; }

.pp2026 .pp26-downloads .ce-uploads li { display: flex; align-items: center; flex-wrap: wrap; gap: 0 17px; width: 100%; max-width: 620px; padding: 0 0 0 48px; background: url("../img/2026/icon-download.png") left center / 31px 37px no-repeat; min-height: 37px; }

.pp2026 .pp26-downloads .ce-uploads li::before, .pp2026 .pp26-downloads .ce-uploads li::after { display: none; }

.pp2026 .pp26-downloads .ce-uploads li div { display: flex; align-items: baseline; gap: 25px; flex-wrap: wrap; }

.pp2026 .pp26-downloads .ce-uploads a { text-decoration: none; color: var(--pp26-text); font-size: 18px; line-height: 1.2; }

.pp2026 .pp26-downloads .ce-uploads a:hover .ce-uploads-fileName { text-decoration: underline; color: var(--pp26-red); }

.pp2026 .pp26-downloads .ce-uploads-filesize { font-size: 13px; color: #a1a1a3; }

.pp2026 .pp26-downloads .ce-uploads-description { display: block; width: 100%; font-size: 13px; color: var(--pp26-muted); }

/* Find your pest: one row on desktop whatever the language (a long heading wraps inside its own column) */
@media (min-width: 992px) {
  .pp26-pest__band { flex-wrap: nowrap; }
  .pp26-pest__intro { flex: 1 1 auto; min-width: 0; flex-wrap: nowrap; }
  .pp2026 .pp26-pest__heading { flex: 0 1 auto; min-width: 308px; white-space: normal; }
  .pp26-pest__body { flex: 1 1 323px; min-width: 0; }
  .pp2026 .pp26-pest__cta { flex: none; }
}

/* Section side insets measured from the design (percent of the container width) -------- */
.pp26-stakes > .pp26-container, .pp26-product > .pp26-container, .pp26-social > .pp26-container,
.pp26-associated > .pp26-container, .pp26-faq > .pp26-container, .pp26-cta .pp26-container { max-width: 1920px; }
.pp26-stakes > .pp26-container { padding-inline: max(16px, 5%) max(16px, 4.357142857%); }
.pp26-product > .pp26-container { padding-inline: max(16px, 4.571428571%) max(16px, 4.357142857%); }
.pp26-social > .pp26-container { padding-inline: max(16px, 4%) max(16px, 4.642857143%); }
.pp26-associated > .pp26-container { padding-inline: max(16px, 4.428571429%) max(16px, 4.785714286%); }
.pp26-cta .pp26-container { padding-inline: max(16px, 10.14285714%) max(16px, 7.285714286%); }
.pp26-faq > .pp26-container { padding-inline: max(16px, 10%) max(16px, 8.5%); }
.pp2026 .pp26-howto .redesign-howtouse2024 .container, .pp2026 .pp26-howto .bottom-image { max-width: 1920px; padding-inline: max(16px, 4.571428571%) max(16px, 4.357142857%); }



/* Responsive: same breakpoints and behaviour as the design (Bootstrap: 1200 / 992 / 768 / 576) --------- */
@media (max-width: 1199px) {
  .pp26-tech__inner { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 24px; }
  .pp26-tech__inner > .pp26-tech__heading, .pp26-tech__inner .pp26-feature { grid-column: auto; }
}

@media (max-width: 991px) {
  .pp26-stakes__grid { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .pp26-stakes__arrow { display: none; }
  .pp26-product__grid { grid-template-columns: minmax(0, 1fr); gap: 32px 24px; }
  .pp26-advantages__title, .pp2026 h1.pp26-advantages__title { margin-top: 0; }
  .pp26-tech__inner { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pp26-social__grid { grid-template-columns: minmax(0, 1fr); gap: 32px 24px; }
  .pp2026 .pp26-faqai__heading { margin-top: 0; }
  .pp26-cta__grid { grid-template-columns: minmax(0, 1fr); gap: 32px 24px; }
  .pp26-cta__info, .pp26-cta__packshot { margin-top: 0; }
  .pp2026 .pp26-faq .productfaq .row { grid-template-columns: minmax(0, 1fr); column-gap: 0; }
}

@media (max-width: 767px) {
  .pp26-hero__container { padding: 24px 16px; }
  .pp26-hero__content { max-width: none; }
  .pp26-advantages__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
  .pp26-tech__inner { grid-template-columns: minmax(0, 1fr); row-gap: 24px; padding-left: var(--pp26-gutter); }
  .pp2026 .pp26-howto .howtousedesktop .product-usage-image { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
  /* Design (supercat-build _10-associate-products.scss): col-4 = 3 columns at every
     phone width, not a further collapse to 2/1 — the old 575px override below is removed. */
  .pp26-associated__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; row-gap: 12px; }
  .pp26-associated__card { padding: 12px 8px 16px; }
  .pp2026 .pp26-associated__link { margin-top: 12px; }
  .pp26-pest__band { flex-direction: column; align-items: flex-start; padding-top: 16px; padding-bottom: 16px; }
  .pp2026 .pp26-pest__heading { min-width: 0; max-width: 100%; white-space: normal; font-size: clamp(28px, 6vw, 36px); }
  .pp26-pest__body { margin-left: 0; margin-top: 12px; }
  .pp2026 .pp26-downloads .ce-uploads { align-items: center; }
  .pp2026 .pp26-downloads .ce-uploads li { padding-left: 44px; }

  /* --- Hero BUY NOW: own full-bleed band under the photo, not overlaid on it
     (supercat-build _02-hero.scss) --- */
  .pp26-hero__content .pp26-hero__cta { display: none; }
  .pp2026 .pp26-hero__cta-mobile {
    display: flex;
    width: 100%;
    min-width: 0;
    height: 54px;
    min-height: 0;
    padding: 0;
    border-radius: 0;
  }

  /* --- USP strip: BUY NOW band above, then full-width stacked bars instead of
     a wrapped centered row (supercat-build _03-usp-strip.scss). Content is
     editor-authored RTE <p> tags with no per-item class, so the darker middle
     shade targets position (2nd item), matching the design's visual pattern
     rather than specific copy. --- */
  .pp26-usp__inner {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    min-height: 0;
    padding-top: 0;
    padding-bottom: 0;
  }
  .pp26-usp__inner p {
    width: 100%;
    padding: 14px 16px;
    text-align: center;
    background: var(--pp26-red);
    /* Pixel-sampled seam shadow, ported as-is from the supercat-build fix
       (_03-usp-strip.scss) — needed because most of these bars share the
       same red and would otherwise merge into one solid block. */
    box-shadow: inset 0 16px 12px -10px rgba(0, 0, 0, 0.35);
  }
  .pp26-usp__inner p:nth-child(2) { background: #b30016; }
  .pp26-usp__inner p:not(:last-child)::after { display: none; }

  /* --- How-to-use step 4: BUY NOW as its own full-bleed band directly below
     the photo, not pulled up -74px to overlay it (supercat-build _08-how-to-use.scss) --- */
  .pp2026 .pp26-howto .redesign-howtouse2024 > .accordion > .buy-now-button {
    margin: 0;
    padding: 0;
  }
  .pp2026 .pp26-howto .redesign-howtouse2024 .buy-now-button a {
    width: 100%;
    height: 54px;
  }

  /* --- Step 4 caption: the old theme's own max-width:767px rule turns this
     into a centered flex row, which combined with the unconditional
     white-space:nowrap above overflows equally off both edges once the
     caption is too long to fit on one line at this width. Let it wrap and
     left-align, and stop centering the (now taller) flex box. --- */
  .pp2026 .pp26-howto .bottom-image .bottom-img-text {
    display: block;
    justify-content: normal;
    text-align: left;
    width: auto;
  }
  .pp2026 .pp26-howto .bottom-image .bottom-img-text p {
    white-space: normal;
  }
}

@media (max-width: 575px) {
  .pp2026 .pp26-howto .howtousedesktop .product-usage-image { grid-template-columns: minmax(0, 1fr); }
  .pp26-cta__checks { grid-template-columns: minmax(0, 1fr); }
}

/* long words must never push the page wider than the screen */
.pp26-page h1, .pp26-page h2, .pp26-page h3 { overflow-wrap: break-word; }
/* the design's gallery has thumbnails only, no arrows */
.pp2026 .pp26-product__gallery .slick-arrows { display: none; }

/* old theme paddings on small screens (slider 35px, step 25px, FAQ block 25px) */
.pp2026 .pp26-product__gallery { padding: 0 !important; }
.pp2026 .pp26-howto .howtousedesktop .product-usage-step { padding: 0 !important; }
.pp2026 .pp26-faq .productfaq { padding: 0 !important; }
/* summary button: bold label, matched to the harmonised 24px scale */
.pp2026 .pp26-cta__cta .pp26-btn__label { font-size: 24px; font-weight: 700; letter-spacing: normal; }
@media (max-width: 767px) {
  .pp2026 .pp26-pest__heading { line-height: 1.2; }
}

/* thumbnails: no empty slider pseudo-element before the first one, fixed 56px size */
.pp2026 .pp26-product__gallery .cSlider--nav .slick-track::before, .pp2026 .pp26-product__gallery .cSlider--nav .slick-track::after { display: none; }
.pp2026 .pp26-product__gallery .cSlider--nav .cSlider__item { flex: 0 0 56px; }
/* step titles: the number and the title sit side by side, a wrapped title stays under the title text (as in the design) */
.pp2026 .pp26-howto .howtousedesktop .product-usage-step p:first-of-type .red-text { display: block; }
.pp2026 .pp26-howto .howtousedesktop .product-usage-step p:first-of-type strong { display: flex; align-items: baseline; gap: 8px; }

/* =====================================================================
   Mobile layout from website-swissinno-mobile2.pdf (<calc(var(--u) * 768)) — order and
   placement corrected against the PDF (mirrors supercat-build):
   - product title + intro sit ABOVE the gallery, then Key Advantages,
     BUY NOW band, Safety Note (PDF order)
   - How-to-use steps are one column, step 4 caption sits bottom-left
   - Find your pest: only the heading is on the grey band
   - Summary: packshot first, BUY NOW as its own band below the card
   Sizes were measured off the PDF at 1px = 1pt (calc(var(--u) * 374) canvas).
   ===================================================================== */
.pp2026 .pp26-cta__cta-mobile { display: none; }

/* Mobile scale unit: 1px at the PDF's 374px width, growing with the viewport (capped at 560px)
   so the layout keeps the PDF's proportions on wider phones. */
@media (max-width: 767px) {
  :root { --u: calc(min(100vw, 560px) / 374); }
}

@media (max-width: 767px) {
  /* --- product: dissolve the two columns so each piece can be ordered --- */
  .pp26-product__grid { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
  .pp26-product__content, .pp2026 .pp26-product__content > .frame, .pp26-advantages { display: contents; }

  .pp26-advantages__title, .pp2026 h1.pp26-advantages__title, .pp2026 h2.pp26-advantages__title { order: 1; margin: calc(var(--u) * 18) 0 0; font-size: calc(var(--u) * 23); line-height: calc(var(--u) * 27); }
  .pp26-advantages__intro { order: 2; margin-top: calc(var(--u) * 14); }
  .pp26-advantages__intro p, .pp26-advantages__intro li { line-height: calc(var(--u) * 20); }
  .pp2026 .pp26-product__gallery { order: 3; margin-top: calc(var(--u) * 20); }
  .pp26-advantages__key { order: 4; margin-top: calc(var(--u) * 12); padding: calc(var(--u) * 18) calc(var(--u) * 16) calc(var(--u) * 12); }
  .pp2026 .pp26-advantages__cta { order: 5; }
  .pp26-safety { order: 6; }

  .pp2026 .pp26-product__gallery .slider-top { border-radius: calc(var(--u) * 12); }
  .pp2026 .pp26-product__gallery .cSlider--nav .slick-track { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: calc(var(--u) * 11); width: 100% !important; transform: none !important; }
  .pp2026 .pp26-product__gallery .cSlider--nav .cSlider__item { flex: none; width: 100% !important; height: auto; aspect-ratio: 1 / 1; border-radius: calc(var(--u) * 10); }

  .pp2026 .pp26-advantages__key .pp26-label { margin-bottom: calc(var(--u) * 14); text-align: center; font-size: calc(var(--u) * 23); line-height: calc(var(--u) * 26); }
  .pp26-advantages__grid { gap: calc(var(--u) * 24) calc(var(--u) * 12); }
  .pp2026 .pp26-advantages__key .pp26-feature--stack .pp26-feature__icon { height: calc(var(--u) * 20); margin-bottom: calc(var(--u) * 10); }
  .pp2026 .pp26-advantages__key .pp26-feature--stack .pp26-feature__title,
  .pp2026 .pp26-advantages__key .pp26-feature--stack .pp26-feature__title p,
  .pp2026 .pp26-advantages__key .pp26-feature--stack .pp26-feature__title span { font-size: calc(var(--u) * 15) !important; line-height: calc(var(--u) * 17) !important; }
  .pp2026 .pp26-advantages__key .pp26-feature--stack .pp26-feature__desc,
  .pp2026 .pp26-advantages__key .pp26-feature--stack .pp26-feature__desc p,
  .pp2026 .pp26-advantages__key .pp26-feature--stack .pp26-feature__desc span { font-size: calc(var(--u) * 12) !important; line-height: calc(var(--u) * 12) !important; }

  /* BUY NOW: inset band, no radius, no arrow, label 92px wide */
  .pp2026 .pp26-advantages__cta { display: flex; width: 100%; min-width: 0; height: calc(var(--u) * 51); min-height: 0; margin-top: calc(var(--u) * 18); padding: 0; border-radius: 0; font-size: calc(var(--u) * 22.8); }
  .pp2026 .pp26-advantages__cta .pp26-btn__arrow { display: none; }

  .pp2026 .pp26-safety { margin-top: calc(var(--u) * 12); gap: calc(var(--u) * 22); padding: calc(var(--u) * 14) calc(var(--u) * 20) calc(var(--u) * 16) calc(var(--u) * 22); border-color: #bc6067; }
  .pp2026 .pp26-safety__icon { height: calc(var(--u) * 60); }
  .pp2026 .pp26-safety__label { font-size: calc(var(--u) * 17); line-height: calc(var(--u) * 19); }
  .pp26-safety__body { margin-top: calc(var(--u) * 8); max-width: calc(var(--u) * 210); }
  .pp26-safety__body p, .pp26-safety__body span { font-size: calc(var(--u) * 12.6) !important; line-height: calc(var(--u) * 15) !important; color: var(--pp26-text) !important; }

  /* hero BUY NOW label is 92px wide in the PDF (22.8px), no arrow */
  .pp2026 .pp26-hero__cta-mobile { font-size: calc(var(--u) * 22.8); }
  .pp2026 .pp26-hero__cta-mobile .pp26-btn__arrow { display: none; }

  /* --- how to use: one column, steps read "1. Title" in Montserrat --- */
  .pp2026 .pp26-howto .howtousedesktop .product-usage-image { grid-template-columns: minmax(0, 1fr); gap: calc(var(--u) * 28); }
  .pp2026 .pp26-howto .howtousedesktop .product-usage-step img { aspect-ratio: 16 / 9; }
  .pp2026 .pp26-howto .howtousedesktop .product-usage-step p:first-of-type { margin-top: calc(var(--u) * 18); line-height: calc(var(--u) * 17); }
  .pp2026 .pp26-howto .howtousedesktop .product-usage-step p:first-of-type strong { gap: calc(var(--u) * 4); }
  .pp2026 .pp26-howto .howtousedesktop .product-usage-step .red-text span[style*="font-size:36px"],
  .pp2026 .pp26-howto .howtousedesktop .product-usage-step .red-text span[style*="font-size:20px"] { font-family: var(--pp26-font-display) !important; font-weight: 500; font-size: calc(var(--u) * 12.3) !important; line-height: calc(var(--u) * 17) !important; color: var(--pp26-text); }
  .pp2026 .pp26-howto .howtousedesktop .product-usage-step p + p { margin: calc(var(--u) * 6) 0 0; font-size: calc(var(--u) * 11) !important; line-height: calc(var(--u) * 13.5) !important; color: var(--pp26-text) !important; }

  /* step 4: 4:3 rounded photo, caption bottom-left, BUY NOW band below with the photo's inset */
  .pp2026 .pp26-howto .bottom-image { margin-top: calc(var(--u) * 30); }
  .pp2026 .pp26-howto .bottom-image img { aspect-ratio: 4 / 3; border-radius: calc(var(--u) * 12); }
  .pp2026 .pp26-howto .bottom-image .bottom-img-text { top: auto; bottom: calc(var(--u) * 14); left: calc(max(16px, 4.571428571%) + calc(var(--u) * 14)); }
  .pp2026 .pp26-howto .bottom-image .bottom-img-text strong { display: block; }
  .pp2026 .pp26-howto .redesign-howtouse2024 > .accordion > .buy-now-button { margin: calc(var(--u) * 15) 0 0; padding: 0 max(16px, 4.357142857%) 0 max(16px, 4.571428571%); }
  .pp2026 .pp26-howto .redesign-howtouse2024 .buy-now-button a { display: flex; align-items: center; justify-content: center; width: 100%; min-width: 0; height: calc(var(--u) * 51); margin: 0; padding: 0; border-radius: 0; font-size: calc(var(--u) * 22.8); }
  .pp2026 .pp26-howto .redesign-howtouse2024 .buy-now-button a::after { display: none; }
  .pp2026 .pp26-howto .bottom-image .bottom-img-text p span,
  .pp2026 .pp26-howto .bottom-image .bottom-img-text p strong { font-family: var(--pp26-font-display) !important; font-weight: 600; font-size: calc(var(--u) * 14) !important; line-height: calc(var(--u) * 20) !important; color: var(--pp26-white); }

  /* --- find your pest: grey band = heading only; icon + copy row and an inset button on white --- */
  .pp26-pest { padding-top: calc(var(--u) * 18); }
  .pp26-pest__band { flex-direction: row; flex-wrap: wrap; justify-content: flex-start; align-items: center; column-gap: calc(var(--u) * 22); row-gap: 0; min-height: 0; padding: 0 0 calc(var(--u) * 15); background: transparent; }
  .pp26-pest__intro { display: contents; }
  .pp2026 .pp26-pest__heading { flex: 0 0 100%; max-width: none; margin: 0; padding: 0 calc(var(--u) * 16); background: var(--pp26-grey); text-align: center; font-size: calc(var(--u) * 23); line-height: calc(var(--u) * 41); }
  .pp26-pest__icon { flex: none; margin: calc(var(--u) * 8) 0 0 20.9%; height: calc(var(--u) * 43); }
  .pp26-pest__body { flex: 1 1 0; min-width: 0; margin: calc(var(--u) * 8) calc(var(--u) * 24) 0 0; }
  .pp26-pest__body p, .pp26-pest__body span { font-size: calc(var(--u) * 10.5) !important; line-height: calc(var(--u) * 12.5) !important; }
  .pp2026 .pp26-pest__cta { flex: 0 0 calc(100% - calc(var(--u) * 55)); min-width: 0; width: auto; height: calc(var(--u) * 44); min-height: 0; margin: calc(var(--u) * 16) calc(var(--u) * 24) 0 calc(var(--u) * 31); padding: 0 calc(var(--u) * 25) 0 0; justify-content: center; font-size: calc(var(--u) * 22.8); }
  .pp2026 .pp26-pest__cta .pp26-btn__label { font-size: inherit; }

  /* --- summary: packshot first, card (centred heading, 2x2 checks), BUY NOW band under it --- */
  .pp26-cta .pp26-container { padding-inline: calc(var(--u) * 18); }
  .pp26-cta__grid { display: flex; flex-direction: column; gap: calc(var(--u) * 8); }
  .pp26-cta__packshot { order: -1; padding: calc(var(--u) * 13); border-radius: calc(var(--u) * 8); }
  .pp26-cta__info { padding: calc(var(--u) * 8) calc(var(--u) * 20) calc(var(--u) * 24) calc(var(--u) * 30); }
  .pp2026 .pp26-cta__heading { text-align: center; font-size: calc(var(--u) * 24.7); line-height: calc(var(--u) * 28); }
  .pp26-cta__checks { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: calc(var(--u) * 18); gap: calc(var(--u) * 18) calc(var(--u) * 12); }
  .pp26-check { gap: calc(var(--u) * 10); }
  .pp26-check__icon { width: calc(var(--u) * 20); height: calc(var(--u) * 20); }
  .pp26-check__label, .pp26-check__label p { font-size: calc(var(--u) * 12.2); line-height: calc(var(--u) * 15); }
  .pp2026 .pp26-cta__cta { display: none; }
  .pp2026 .pp26-cta__cta-mobile { display: flex; width: 100%; min-width: 0; height: calc(var(--u) * 51); min-height: 0; margin-top: calc(var(--u) * 8); padding: 0; border-radius: 0; font-size: calc(var(--u) * 22.8); }
  .pp2026 .pp26-cta__cta-mobile .pp26-btn__arrow { display: none; }
}

/* Downloads on mobile: left-aligned heading and rows (PDF), sizes measured off it */
@media (max-width: 767px) {
  .pp26-downloads { padding: calc(var(--u) * 22) 0 calc(var(--u) * 40); }
  .pp2026 .pp26-downloads header * { text-align: left; font-size: calc(var(--u) * 23) !important; line-height: calc(var(--u) * 27); }
  .pp2026 .pp26-downloads .ce-uploads { margin-top: calc(var(--u) * 20); gap: calc(var(--u) * 11); align-items: flex-start; }
  .pp2026 .pp26-downloads .ce-uploads li { max-width: none; padding-left: calc(var(--u) * 32); background-size: calc(var(--u) * 20) calc(var(--u) * 25); min-height: calc(var(--u) * 25); }
  .pp2026 .pp26-downloads .ce-uploads li div { gap: calc(var(--u) * 4) calc(var(--u) * 24); }
  .pp2026 .pp26-downloads .ce-uploads a { font-size: calc(var(--u) * 11.5); line-height: calc(var(--u) * 14); }
  .pp2026 .pp26-downloads .ce-uploads-filesize { font-size: calc(var(--u) * 8.6); }
}

/* Customer reviews: text reviews + "see more on Amazon" link */
.pp26-reviews__box .pp26-review { padding: 0 0 16px; margin: 0 0 16px; border-bottom: 2px solid #e4e4e4; }
.pp26-reviews__box .pp26-review__stars { margin: 0 0 4px; color: #f5a623; font-size: 20px; letter-spacing: 2px; }
.pp26-reviews__box .pp26-review__title { margin: 0 0 4px; font-size: 18px; }
.pp26-reviews__box .pp26-review__by { margin: 8px 0 0; font-size: 14px; color: #6a6a6a; }
.pp26-reviews__box .pp26-review__more { margin: 0; }
.pp26-reviews__box .pp26-review__more a { color: var(--pp26-red); font-weight: 700; text-decoration: underline; }

/* =====================================================================
   Mobile pass 2 — hero, USP bar, problem/solution cards, section headings,
   reviews and FAQ scaled to the proportions of website-swissinno-mobile2.pdf
   (same --u unit as above: 1u = 1px of the PDF's 374px canvas).
   ===================================================================== */
@media (max-width: 767px) {
  /* hero: 279u photo, dark gradient from the bottom, title + subtitle bottom-left */
  .pp26-hero { min-height: calc(var(--u) * 279); align-items: flex-end; }
  .pp26-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(0, 0, 0, .62) 0%, rgba(0, 0, 0, .25) 55%, rgba(0, 0, 0, 0) 100%); pointer-events: none; }
  .pp26-hero__container { z-index: 1; padding: calc(var(--u) * 24) calc(var(--u) * 16) calc(var(--u) * 14); }
  .pp26-hero__content { max-width: 78%; }
  .pp26-hero__content h1, .pp26-hero__content h2, .pp26-hero__content h1 span, .pp26-hero__content h2 span { font-size: calc(var(--u) * 25) !important; line-height: calc(var(--u) * 29.5) !important; letter-spacing: .01em; }
  .pp26-hero__content h1 + h1, .pp26-hero__content h1 + h2, .pp26-hero__content h2 + h2, .pp26-hero__content p { margin-top: calc(var(--u) * 10); font-size: calc(var(--u) * 12.5) !important; line-height: calc(var(--u) * 17) !important; letter-spacing: .02em; }
  .pp2026 .pp26-hero__cta-mobile { height: calc(var(--u) * 51); }

  /* USP bar: three flat 36u rows, middle one darker, no seam shadow */
  .pp26-usp__inner p { padding: 0 calc(var(--u) * 16); min-height: calc(var(--u) * 36); display: flex; align-items: center; justify-content: center; font-size: calc(var(--u) * 13); line-height: 1.1; box-shadow: none; }

  /* problem / solution: compact cards, 12u outer margin, 10u gap */
  .pp26-stakes { padding-top: calc(var(--u) * 10); }
  .pp26-stakes__grid { gap: calc(var(--u) * 10); padding-inline: calc(var(--u) * 2); }
  .pp26-panel { border-radius: calc(var(--u) * 6); }
  .pp26-panel__header { min-height: 0; padding: calc(var(--u) * 6) calc(var(--u) * 16); gap: calc(var(--u) * 12); justify-content: center; }
  .pp26-panel__icon { height: calc(var(--u) * 22); }
  .pp2026 .pp26-panel__title { font-size: calc(var(--u) * 21.1); line-height: calc(var(--u) * 26); }
  .pp26-panel__body { padding: calc(var(--u) * 10) calc(var(--u) * 20) calc(var(--u) * 12) calc(var(--u) * 14); }
  .pp26-panel .pp26-feature { gap: calc(var(--u) * 10); }
  .pp26-panel .pp26-feature__icon { width: calc(var(--u) * 36); height: calc(var(--u) * 36); }
  .pp2026 .pp26-panel .pp26-feature--row .pp26-feature__title, .pp2026 .pp26-panel .pp26-feature--row .pp26-feature__title p, .pp2026 .pp26-panel .pp26-feature--row .pp26-feature__title span { font-size: calc(var(--u) * 15.34) !important; line-height: calc(var(--u) * 19.95) !important; font-weight: 700; color: #2a2f22; }
  .pp2026 .pp26-panel .pp26-feature--row .pp26-feature__title { margin-top: calc(var(--u) * 2); }
  .pp2026 .pp26-panel .pp26-feature--row .pp26-feature__desc, .pp2026 .pp26-panel .pp26-feature--row .pp26-feature__desc p, .pp2026 .pp26-panel .pp26-feature--row .pp26-feature__desc span { font-size: calc(var(--u) * 13.42) !important; line-height: calc(var(--u) * 19.5) !important; font-weight: 400; color: #55594e; }
  .pp2026 .pp26-panel .pp26-feature--row .pp26-feature__desc { margin-top: calc(var(--u) * 2); }
  .pp26-panel .pp26-feature--row + .pp26-feature--row { margin-top: calc(var(--u) * 9); padding-top: calc(var(--u) * 9); border-top-width: 1px; }

  /* product intro under the title: 16u / 20.5u */
  .pp26-advantages__intro, .pp26-advantages__intro p, .pp26-advantages__intro li { font-size: calc(var(--u) * 16); line-height: calc(var(--u) * 20.5); }

  /* section headings: 22u instead of the 36px desktop size */
  .pp2026 .pp26-reviews__heading, .pp2026 .pp26-faqai__heading, .pp2026 .pp26-heading, .pp2026 .pp26-faq .productfaq > .frame-type-header header * { font-size: calc(var(--u) * 22) !important; line-height: calc(var(--u) * 26) !important; }
  .pp2026 .pp26-faqai__heading { margin-top: calc(var(--u) * 6); }
  .pp26-acc { margin-top: calc(var(--u) * 12); }
  .pp26-faq { padding-top: calc(var(--u) * 24); }
  .pp2026 .pp26-faq .productfaq > .frame-type-header { margin-bottom: calc(var(--u) * 10); }

  /* how-to-use bar */
  .pp2026 .pp26-howto .bar, .pp2026 .pp26-howto > .frame-type-header { padding-block: calc(var(--u) * 8); }
  .pp2026 .pp26-howto h2 { font-size: calc(var(--u) * 22) !important; line-height: calc(var(--u) * 26) !important; }

  /* reviews box */
  .pp26-reviews__box { margin-top: calc(var(--u) * 10); padding: calc(var(--u) * 14) calc(var(--u) * 16); font-size: calc(var(--u) * 11.5); line-height: calc(var(--u) * 16); }
  .pp26-reviews__box .pp26-review { padding-bottom: calc(var(--u) * 10); margin-bottom: calc(var(--u) * 10); border-bottom-width: 1px; }
  .pp26-reviews__box .pp26-review__stars { font-size: calc(var(--u) * 14); margin-bottom: calc(var(--u) * 2); }
  .pp26-reviews__box .pp26-review__title { font-size: calc(var(--u) * 13); margin-bottom: calc(var(--u) * 2); }
  .pp26-reviews__box .pp26-review__by { font-size: calc(var(--u) * 10); margin-top: calc(var(--u) * 4); }
  .pp26-reviews__box .pp26-review__more a { font-size: calc(var(--u) * 11.5); }
  .pp2026 .pp26-reviews__cta { min-width: 0; width: 100%; margin-top: calc(var(--u) * 12); }

  /* FAQ rows (top and bottom): 49u pitch, 12.5u bold question, 22u circle icon */
  .pp26-acc__question { font-size: calc(var(--u) * 12.5); line-height: calc(var(--u) * 16); padding-block: calc(var(--u) * 16); padding-right: calc(var(--u) * 34); }
  .pp26-acc__question::after { width: calc(var(--u) * 22); height: calc(var(--u) * 22); background-size: contain; }
  .pp26-acc__answer, .pp2026 .pp26-faq .productfaq .row .col header + * { font-size: calc(var(--u) * 12); padding-bottom: calc(var(--u) * 12); }
  .pp2026 .pp26-faq .productfaq .row .col header { padding: calc(var(--u) * 16) calc(var(--u) * 34) calc(var(--u) * 16) 0; }
  .pp2026 .pp26-faq .productfaq .row .col header h5, .pp2026 .pp26-faq .productfaq .row .col header h4, .pp2026 .pp26-faq .productfaq .row .col header h3 { font-size: calc(var(--u) * 12.5); line-height: calc(var(--u) * 16); }
  .pp2026 .pp26-faq .productfaq .row .col header::after { width: calc(var(--u) * 22); height: calc(var(--u) * 22); margin-top: calc(var(--u) * -11); }
}

@media (max-width: 767px) {
  .pp2026 .pp26-panel__header .pp26-panel__icon { height: calc(var(--u) * 22) !important; width: auto !important; }
  .pp26-usp__inner { padding-inline: 0; max-width: none; }
  .pp26-stakes__grid { padding-inline: 0; }
  .pp2026 .pp26-howto .redesign-howtouse2024 .accordion-title h2, .pp2026 .pp26-howto .redesign-howtouse2024 .accordion-title h3,
  .pp2026 .pp26-howto .redesign-howtouse2024 .accordion-title .user-defined-header { font-size: calc(var(--u) * 22) !important; line-height: calc(var(--u) * 26); }
  .pp2026 .pp26-howto .redesign-howtouse2024 .accordion-title { padding-block: calc(var(--u) * 8); }
}

@media (max-width: 767px) {
  /* old theme gives the question headline its own 20px/30px padding on top of the header padding */
  .pp2026 .pp26-faq .productfaq .row .col header h5, .pp2026 .pp26-faq .productfaq .row .col header h4, .pp2026 .pp26-faq .productfaq .row .col header h3 { padding: 0; }
}

@media (max-width: 767px) {
  /* associate products: "Learn more →" on one line, 9u as in the PDF */
  .pp2026 .pp26-associated__link { font-size: calc(var(--u) * 9.5); line-height: 1.2; white-space: nowrap; }
}

@media (max-width: 767px) {
  /* bottom FAQ: heading sits ~12u under the summary BUY NOW band, as in the PDF */
  .pp26-faq { padding-top: calc(var(--u) * 6); }
  .pp2026 .pp26-faq .productfaq > .frame-type-header .user-defined-header { padding-top: 0; }
}
@media (max-width: 767px) {
  .pp2026 .pp26-faq .productfaq > .frame-type-header { margin-bottom: 0; }
  .pp2026 .pp26-faq .productfaq > .frame-type-header .user-defined-header { padding-bottom: 0; }
}

/* old theme pads the question headline (20px 30px) on top of the header padding: rows were ~65px, reference 50px */
.pp2026 .pp26-faq .productfaq .row .col header h5, .pp2026 .pp26-faq .productfaq .row .col header h4, .pp2026 .pp26-faq .productfaq .row .col header h3 { padding: 0; }

@media (max-width: 767px) {
  /* footer slogan: 30px/45px filled three lines of the phone screen; scale to the page's text proportions (new-layout pages only) */
  main:has(.pp2026) .stripe-text { font-size: calc(var(--u) * 15); line-height: calc(var(--u) * 21); padding: calc(var(--u) * 12) calc(var(--u) * 16); }
}
@media (max-width: 767px) {
  main:has(.pp2026) .stripe-text :is(header, h1, h2, h3, p, span, .user-defined-header) { font-size: inherit !important; line-height: inherit !important; margin: 0; }
}

/* Product name under the photo: only the bird theme shows it (red pages keep the sr-only title) */
.pp26-associated__name { display: none; }
/* New client design (mobile): BUY NOW is an inset red button inside a white band (white margin around it),
   with the red USP bars directly below. The white margin is the element's own border, the red is clipped to the content box. */
@media (max-width: 767px) {
  .pp2026 .pp26-hero__cta-mobile {
    box-sizing: content-box;
    width: auto;
    height: 54px;
    border: solid #fff;
    border-width: 6px 19px 8px;
    background: linear-gradient(var(--pp26-red), var(--pp26-red)) content-box, #fff;
    background-clip: content-box, border-box;
  }
  .pp2026 .pp26-hero__cta-mobile:hover, .pp2026 .pp26-hero__cta-mobile:focus-visible { background: linear-gradient(#b60018, #b60018) content-box, #fff; background-clip: content-box, border-box; }
}

/* SuperCat mobile pass (SuperCat-mobile-mockup-vs-dev_EN.pdf, 2026-11-04). Mockup values = PSD px / 2 at 390 wide.
   Scoped to non-Bird product pages: the Bird page has its own pass in bird-2026.css. Review carousel intentionally left out. */
@media (max-width: 767px) {
  /* BUY NOW buttons: rounded 20px like the Smart Birds pages */
  .pp2026:not(.pp26-bird) .pp26-advantages__cta, .pp2026:not(.pp26-bird) .pp26-cta__cta-mobile, .pp2026:not(.pp26-bird) .pp26-howto .buy-now-button a { border-radius: 20px; }
  .pp2026:not(.pp26-bird) .pp26-hero__cta-mobile, .pp2026:not(.pp26-bird) .pp26-hero__cta-mobile:hover, .pp2026:not(.pp26-bird) .pp26-hero__cta-mobile:focus-visible { background: #fff; }
  .pp2026:not(.pp26-bird) .pp26-hero__cta-mobile .pp26-btn__label { display: flex; align-items: center; justify-content: center; width: 100%; box-sizing: border-box; height: 54px; background: var(--pp26-red); border-radius: 20px; }
  .pp2026:not(.pp26-bird) .pp26-hero__cta-mobile:hover .pp26-btn__label, .pp2026:not(.pp26-bird) .pp26-hero__cta-mobile:focus-visible .pp26-btn__label { background: #b60018; }
  /* fonts: mockup sizes (hero 24 / 12 / bars 12, panels, tech, FAQ, step 4) */
  .pp2026:not(.pp26-bird) .pp26-hero .pp26-hero__content h1, .pp2026:not(.pp26-bird) .pp26-hero .pp26-hero__content h1 span { font-size: 24px !important; line-height: 31px !important; }
  .pp2026:not(.pp26-bird) .pp26-hero .pp26-hero__content p, .pp2026:not(.pp26-bird) .pp26-hero .pp26-hero__content p span { font-size: 12px !important; line-height: 16px !important; }
  .pp2026:not(.pp26-bird) .pp26-usp__inner p { font-size: 12px; line-height: 14px; }
  .pp2026:not(.pp26-bird) .pp26-panel__title { font-size: 21px; line-height: 25px; }
  .pp2026:not(.pp26-bird) .pp26-panel .pp26-feature__title, .pp2026:not(.pp26-bird) .pp26-panel .pp26-feature__title p { font-size: 10.5px !important; line-height: 14px !important; }
  .pp2026:not(.pp26-bird) .pp26-panel .pp26-feature__desc, .pp2026:not(.pp26-bird) .pp26-panel .pp26-feature__desc p { font-size: 10.5px !important; line-height: 14px !important; }
  .pp2026:not(.pp26-bird) .pp26-tech .pp26-feature__desc, .pp2026:not(.pp26-bird) .pp26-tech .pp26-feature__desc p { font-size: 13px !important; line-height: 18px !important; }
  .pp2026:not(.pp26-bird) .pp26-acc__question { font-size: 14px; font-weight: 400; }
  /* 1st FAQ: red "+" without circle (open = red "-") */
  .pp2026:not(.pp26-bird) .pp26-acc__question::after { width: 16px; height: 16px; margin-top: -8px; right: 2px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2 8h12M8 2v12' stroke='%23d6001c' stroke-width='2.4' stroke-linecap='square'/%3E%3C/svg%3E"); }
  .pp2026:not(.pp26-bird) .pp26-acc__item[open] > .pp26-acc__question::after { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2 8h12' stroke='%23d6001c' stroke-width='2.4' stroke-linecap='square'/%3E%3C/svg%3E"); }
  .pp2026:not(.pp26-bird) .pp26-faq .productfaq h5 { font-size: 11.5px !important; line-height: 15px !important; }
  .pp2026:not(.pp26-bird) .pp26-howto .bottom-image .bottom-img-text p, .pp2026:not(.pp26-bird) .pp26-howto .bottom-image .bottom-img-text span, .pp2026:not(.pp26-bird) .pp26-howto .bottom-image .bottom-img-text strong { font-family: 'montserrat-medium', Arial, sans-serif !important; font-weight: 400 !important; font-size: 15px !important; line-height: 19px !important; }
  /* breadcrumb 11px */
  .pp2026:not(.pp26-bird) .pp26-breadcrumb, .pp2026:not(.pp26-bird) .pp26-breadcrumb a, .pp2026:not(.pp26-bird) .pp26-breadcrumb li { font-size: 11px; }
  /* Problem / Solution headers left aligned with the icon column */
  .pp2026:not(.pp26-bird) .pp26-panel__header { justify-content: flex-start; padding-inline: 15px; }
  /* spacing between blocks */
  .pp2026:not(.pp26-bird) .pp26-product { padding-top: 0; }
  .pp2026:not(.pp26-bird) h2.pp26-advantages__title, .pp2026:not(.pp26-bird) h1.pp26-advantages__title { margin-top: 19.8px; }  /* solution -> title -29 */
  .pp2026:not(.pp26-bird) .pp26-product__gallery { margin-top: 10px; }                                                           /* description -> gallery 20.5 */
  .pp2026:not(.pp26-bird) .pp26-advantages__key { padding-bottom: 27px; }                                                       /* bottom padding 27 */
  .pp2026:not(.pp26-bird) .pp26-tech { padding-top: 2px; }                                                                      /* safety note -> technology 9 */
  .pp2026:not(.pp26-bird) .pp26-social { padding-top: 18.5px; }                                                                 /* technology -> reviews 18.5 */
  .pp2026:not(.pp26-bird) .pp26-howto { padding-top: 32px; }                                                                    /* last FAQ -> band 32 */
  .pp2026:not(.pp26-bird) .pp26-howto .howtousedesktop .product-usage-image { margin-top: 10px; }                               /* band -> step 1 image 10 */
  .pp2026:not(.pp26-bird) .pp26-faq { padding-top: 19px; }                                                                      /* BUY NOW -> FAQ title 20 */
  /* gallery: one row of 3 thumbnails with swipe, no outline on the active one */
  .pp2026:not(.pp26-bird) .pp26-product__gallery .slider-bottom { margin-top: 13px; }
  .pp2026:not(.pp26-bird) .pp26-product__gallery .cSlider--nav .slick-list { overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .pp2026:not(.pp26-bird) .pp26-product__gallery .cSlider--nav .slick-track { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: calc((100% - 22px) / 3); }
  .pp2026:not(.pp26-bird) .pp26-product__gallery .cSlider--nav .slick-slide { scroll-snap-align: start; }
  .pp2026:not(.pp26-bird) .pp26-product__gallery .cSlider--nav .slick-current, .pp2026:not(.pp26-bird) .pp26-product__gallery .cSlider--nav .slick-current *, .pp2026:not(.pp26-bird) .pp26-product__gallery .cSlider--nav .slick-slide * { outline: 0 !important; }
  .pp2026:not(.pp26-bird) .pp26-product__gallery .cSlider--nav .cSlider__item.slick-current { border-color: transparent; box-shadow: none; }
  /* key advantages: mockup order (row 2 = Hygienic / Indoor & outdoor, row 3 = Robust / Versatile) */
  .pp2026:not(.pp26-bird) .pp26-advantages__grid .pp26-feature:nth-child(3) { order: 1; }
  .pp2026:not(.pp26-bird) .pp26-advantages__grid .pp26-feature:nth-child(6) { order: 2; }
  /* full-width CTA card (item 7): frame -> card 6, card top -> title 14, title -> checks 14, icon 20, icon -> text 13, card -> button 6 */
  .pp2026:not(.pp26-bird) .pp26-cta__grid { gap: 6px; }
  .pp2026:not(.pp26-bird) .pp26-cta__info { padding-top: 13.5px; }
  .pp2026:not(.pp26-bird) .pp26-cta__checks { margin-top: 14px; }
  .pp2026:not(.pp26-bird) .pp26-check { gap: 13px; }
  .pp2026:not(.pp26-bird) .pp26-check__icon { width: 20px; height: 20px; }
  .pp2026:not(.pp26-bird) .pp26-cta__cta-mobile { margin-top: 6px; }
  /* technology block closer to the mockup height (250) */
  .pp2026:not(.pp26-bird) .pp26-tech__inner { gap: 8px; }
  /* steps 1-3 text 11 / 14 */
  .pp2026:not(.pp26-bird) .pp26-howto .howtousedesktop .product-usage-step p + p, .pp2026:not(.pp26-bird) .pp26-howto .howtousedesktop .product-usage-step p + p span { font-size: 11px !important; line-height: 14px !important; }
  /* steps 1-3: text aligned with the image, image 337x183 at x28 */
  .pp2026:not(.pp26-bird) .pp26-howto .accordion > .container { padding-inline: 28px; }
  .pp2026:not(.pp26-bird) .pp26-howto .howtousedesktop .product-usage-step img { height: auto; aspect-ratio: 1.84 / 1; object-fit: cover; }
  /* 2nd FAQ ("Fragen und Antworten") as wide as the 1st: margin 18.5 */
  .pp2026:not(.pp26-bird) .pp26-faq > .pp26-container { padding-inline: 18.5px; }
}