/* assets/css/tokens.css */
/* Versioned, semantic, product-agnostic design tokens. */
.gpp-product,
.gpp-modal-root,
.gpp-lightbox-root,
.gpp-catalog-card {
  /* Six levels only: 14 / 15 / 17 / 24 / 36 / 52 px. */
  --gpp-type-label: 14px;
  --gpp-type-caption: 15px;
  --gpp-type-body: 17px;
  --gpp-type-h3: 24px;
  --gpp-type-h2: 36px;
  --gpp-type-h1: 52px;
  --gpp-ink: #181b1e;
  --gpp-text: #30363c;
  --gpp-muted: #626b73;
  --gpp-canvas: #ffffff;
  --gpp-surface: #f4f5f6;
  --gpp-surface-alt: #ecf0f1;
  --gpp-border: #dce1e5;
  --gpp-accent: #225c6c;
  --gpp-on-accent: #fff;
  --gpp-radius-sm: 6px;
  --gpp-radius-md: 10px;
  --gpp-radius-lg: 16px;
  --gpp-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  --gpp-space-1: 4px;
  --gpp-space-2: 8px;
  --gpp-space-3: 12px;
  --gpp-space-4: 16px;
  --gpp-space-5: 24px;
  --gpp-space-6: 32px;
  --gpp-space-7: 48px;
  --gpp-space-8: 64px;
  --gpp-measure: 68ch;
  --gpp-section-gap: clamp(32px, 4.2vw, 58px);
  --gpp-content-max: 1160px;
}

/* assets/css/base.css */
/* All document/content rules are scoped to GPP's own root. */
.gpp-product { box-sizing: border-box; container-type: inline-size; width: 100%; color: var(--gpp-text); background: var(--gpp-canvas); font: 400 var(--gpp-type-body)/1.62 var(--gpp-font); }
.gpp-product *, .gpp-product *::before, .gpp-product *::after, .gpp-modal-root *, .gpp-modal-root *::before, .gpp-modal-root *::after { box-sizing: border-box; }
.gpp-product :is(h1,h2,h3,h4,p,ul,ol,figure,dl) { margin-block: 0; }
.gpp-product h1, .gpp-product h2, .gpp-product h3 { color: var(--gpp-ink); letter-spacing: -.035em; line-height: 1.13; }
.gpp-product h1 { font-size: var(--gpp-type-h1); letter-spacing: -.05em; font-weight: 750; }
.gpp-product h2 { font-size: var(--gpp-type-h2); font-weight: 720; }
.gpp-product h3 { font-size: var(--gpp-type-h3); font-weight: 670; letter-spacing: -.026em; }
.gpp-product p { max-width: var(--gpp-measure); }
.gpp-product a { color: var(--gpp-accent); }
.gpp-product button, .gpp-modal-root button, .gpp-modal-root input, .gpp-modal-root textarea { font: inherit; }
.gpp-product button { cursor: pointer; }
.gpp-product :focus-visible, .gpp-modal-root :focus-visible, .gpp-catalog-card:focus-visible { outline: 3px solid #e9a648; outline-offset: 3px; }
.gpp-product__inner { max-width: var(--gpp-content-max); margin-inline: auto; padding: clamp(24px, 3.2vw, 48px); padding-bottom: 88px; }
.gpp-product__sections { display: flex; flex-direction: column; gap: var(--gpp-section-gap); }
.gpp-section { min-width: 0; }
.gpp-section__head { display: flex; flex-direction: column; gap: 13px; margin-bottom: 25px; }
.gpp-section__intro { font-size: var(--gpp-type-body); line-height: 1.65; color: var(--gpp-muted); max-width: var(--gpp-measure); }
.gpp-eyebrow { display: inline-block; font-size: var(--gpp-type-label); font-weight: 750; letter-spacing: .145em; line-height: 1.4; color: var(--gpp-accent); text-transform: uppercase; }
.gpp-overline { font-size: var(--gpp-type-label); font-weight: 650; color: var(--gpp-muted); letter-spacing: .06em; text-transform: uppercase; }
.gpp-button { display: inline-flex; align-items: center; justify-content: center; gap: 11px; min-height: 46px; padding: 12px 23px; border: 1px solid var(--gpp-accent); border-radius: var(--gpp-radius-sm); background: var(--gpp-accent); color: var(--gpp-on-accent) !important; font-size: var(--gpp-type-body); font-weight: 680; line-height: 1.3; text-decoration: none; transition: background .16s ease, transform .16s ease; }
 .gpp-button:not([disabled]):hover { background: #164451; transform: translateY(-1px); }
.gpp-button[disabled] { opacity: .45; cursor: not-allowed; transform: none; }
.gpp-button[disabled]:hover { background: var(--gpp-accent); transform: none; }
.gpp-button--secondary { background: transparent; color: var(--gpp-accent) !important; }
.gpp-button--secondary:hover { color: var(--gpp-on-accent) !important; }
.gpp-button__arrow { display: inline-block; font-size: var(--gpp-type-body); font-weight: 400; line-height: .8; }
.gpp-muted { color: var(--gpp-muted); }
.gpp-product__empty { padding: 60px 24px; text-align: center; }
@media (prefers-reduced-motion: reduce) { .gpp-product *, .gpp-modal-root * { transition: none !important; scroll-behavior: auto !important; } }

/* assets/css/components.css */
/* 14 reusable component types. No brand/product-specific selectors. */
.gpp-hero { display: grid; grid-template-columns: minmax(0,1.03fr) minmax(0,.97fr); gap: clamp(22px,3vw,45px); align-items: center; min-height: 435px; padding: clamp(25px,3.3vw,52px); border-radius: var(--gpp-radius-lg); overflow: hidden; }
.gpp-hero__copy { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; min-width: 0; }
.gpp-hero__title { overflow-wrap: normal; word-break: normal; hyphens: none; }
.gpp-hero__title--long { font-size: var(--gpp-type-h2) !important; letter-spacing: -.047em; }
.gpp-hero__summary { color: var(--gpp-text); font-size: var(--gpp-type-body); max-width: 52ch; line-height: 1.55; }
.gpp-hero__visual { width: 100%; min-width: 0; }
.gpp-hero__visual img { display: block; width: 100%; aspect-ratio: 1.13; height: auto; object-fit: contain; border-radius: 11px; }
.gpp-hero__micro { color: var(--gpp-muted); font-size: var(--gpp-type-label); letter-spacing: .02em; }
.gpp-hero--text-only { grid-template-columns: 1fr; min-height: unset; max-width: 100%; }
.gpp-hero--text-only .gpp-hero__copy { max-width: 730px; }
.gpp-hero--stacked { grid-template-columns: 1fr; }
.gpp-hero--stacked .gpp-hero__visual img { aspect-ratio: 2.1; object-fit: cover; }
.gpp-section__kicker { margin-bottom: 12px; }
.gpp-rich { max-width: 72ch; display: flex; flex-direction: column; gap: 17px; }
.gpp-rich--lead p:first-of-type { font-size: var(--gpp-type-h3); line-height: 1.55; color: #25333b; }
.gpp-rich__list { padding-left: 1.3em; display: grid; gap: 9px; }
.gpp-feature-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.gpp-feature { min-width: 0; padding: clamp(22px,2.4vw,29px); background: var(--gpp-surface); border: 1px solid transparent; border-radius: var(--gpp-radius-md); }
.gpp-feature__index { color: var(--gpp-accent); font-size: var(--gpp-type-label); font-weight: 750; letter-spacing: .1em; margin-bottom: 34px; }
.gpp-feature h3 { font-size: var(--gpp-type-h3); margin-bottom: 12px; }
.gpp-feature p { font-size: var(--gpp-type-caption); line-height: 1.59; color: var(--gpp-muted); }
.gpp-feature-grid--rows { grid-template-columns: 1fr 1fr; gap: 0 28px; }
.gpp-feature-grid--rows .gpp-feature { background: none; border-top: 1px solid var(--gpp-border); border-radius: 0; padding-inline: 0; }
.gpp-feature-grid--rows .gpp-feature__index { margin-bottom: 16px; }
.gpp-facts { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); border-block: 1px solid var(--gpp-border); }
.gpp-fact { padding: 28px 20px; border-right: 1px solid var(--gpp-border); min-width: 0; }
.gpp-fact:last-child { border-right: 0; }
.gpp-fact__value { font-weight: 720; color: var(--gpp-ink); font-size: var(--gpp-type-h3); line-height: 1.13; letter-spacing: -.04em; overflow-wrap: anywhere; }
.gpp-fact__label { display: block; color: var(--gpp-muted); font-size: var(--gpp-type-label); line-height: 1.45; margin-top: 10px; }
.gpp-facts--grid { gap: 10px; border: none; }
.gpp-facts--grid .gpp-fact { background: var(--gpp-surface); border: 0; border-radius: var(--gpp-radius-sm); padding: 25px; }
.gpp-media-text { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: clamp(24px,4vw,50px); align-items: center; }
.gpp-media-text--media-right .gpp-media-text__media { order: 2; }
.gpp-media-text--stacked { grid-template-columns: 1fr; }
.gpp-media-text__media { overflow: hidden; border-radius: var(--gpp-radius-md); background: var(--gpp-surface); }
.gpp-media-text__media img { display: block; width: 100%; height: auto; aspect-ratio: 1.42; object-fit: contain; }
.gpp-media-text__copy { display: flex; flex-direction: column; gap: 16px; }
.gpp-media-text__copy p { font-size: var(--gpp-type-body); }
.gpp-gallery { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 13px; }
.gpp-gallery figure { min-width: 0; }
.gpp-gallery img { display: block; width: 100%; height: auto; aspect-ratio: auto; object-fit: contain; background: var(--gpp-surface); border-radius: 10px; }
.gpp-gallery figcaption { color: var(--gpp-muted); font-size: var(--gpp-type-label); padding: 9px 2px; }
.gpp-gallery--carousel { display: flex; max-width: 100%; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 12px; }
.gpp-gallery--carousel figure { flex: 0 0 min(72%, 385px); scroll-snap-align: start; }
.gpp-applications { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 13px; }
.gpp-application { padding: 26px; border: 1px solid var(--gpp-border); border-radius: var(--gpp-radius-md); min-width: 0; }
.gpp-application h3 { font-size: var(--gpp-type-h3); margin-bottom: 11px; }
.gpp-application p { font-size: var(--gpp-type-caption); color: var(--gpp-muted); }
.gpp-applications--list { grid-template-columns: 1fr; gap: 0; }
.gpp-applications--list .gpp-application { border-inline: 0; border-bottom: 0; border-radius: 0; padding-left: 0; }
.gpp-steps { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; }
.gpp-step { border-top: 2px solid var(--gpp-accent); padding-top: 19px; }
.gpp-step__count { color: var(--gpp-accent); font-size: var(--gpp-type-label); letter-spacing: .1em; font-weight: 760; display: block; margin-bottom: 22px; }
.gpp-step h3 { font-size: var(--gpp-type-h3); margin-bottom: 11px; }
.gpp-step p { font-size: var(--gpp-type-caption); color: var(--gpp-muted); }
.gpp-steps--timeline { grid-template-columns: 1fr; }
.gpp-steps--timeline .gpp-step { display: grid; grid-template-columns: 80px 1fr; gap: 14px; border-top: 1px solid var(--gpp-border); }
.gpp-steps--timeline .gpp-step__count { margin: 0; }
.gpp-table-scroll { overflow-x: auto; border: 1px solid var(--gpp-border); border-radius: var(--gpp-radius-md); max-width: 100%; }
.gpp-table { width: 100%; border-collapse: collapse; text-align: left; min-width: 520px; font-size: var(--gpp-type-body); }
.gpp-table th { background: var(--gpp-surface); color: var(--gpp-ink); font-weight: 680; }
.gpp-table :is(td,th) { padding: 15px 18px; border-bottom: 1px solid var(--gpp-border); vertical-align: top; }
.gpp-table tr:last-child td { border-bottom: none; }
.gpp-table tbody tr:hover { background: #fafbfb; }
.gpp-table tbody th { background: transparent; white-space: normal; }
.gpp-specs__group { margin-top: 27px; }
.gpp-specs__group:first-child { margin-top: 0; }
/* Explicit specificity wins over the scoped base reset on all heading margins. */
.gpp-product .gpp-specs__group-name { font-size: var(--gpp-type-body); font-weight: 720; margin-block: 0 16px; }
.gpp-specs__list { display: grid; grid-template-columns: 1fr 1fr; gap: 0 30px; }
.gpp-specs__row { display: flex; justify-content: space-between; gap: 12px; padding: 13px 0; border-bottom: 1px solid var(--gpp-border); font-size: var(--gpp-type-body); }
.gpp-specs__row dt { color: var(--gpp-muted); }
.gpp-specs__row dd { margin: 0; color: var(--gpp-ink); font-weight: 620; text-align: right; }
.gpp-compare-cards { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.gpp-compare-card { border: 1px solid var(--gpp-border); border-radius: 10px; padding: 21px; }
.gpp-compare-card h3 { margin-bottom: 15px; }
.gpp-compare-card dl { display: grid; gap: 13px; }
.gpp-compare-card dt { color: var(--gpp-muted); font-size: var(--gpp-type-label); }
.gpp-compare-card dd { margin: 2px 0 0; font-weight: 620; font-size: var(--gpp-type-label); }
.gpp-faq { border-top: 1px solid var(--gpp-border); }
.gpp-faq details { border-bottom: 1px solid var(--gpp-border); }
.gpp-faq summary { cursor: pointer; list-style: none; padding: 22px 38px 22px 0; position: relative; font-weight: 660; color: var(--gpp-ink); }
.gpp-faq summary::-webkit-details-marker { display: none; }
.gpp-faq summary::after { content: '+'; position: absolute; right: 8px; top: 17px; color: var(--gpp-accent); font-weight: 350; font-size: var(--gpp-type-h3); }
.gpp-faq details[open] summary::after { content: '−'; }
.gpp-faq__answer { padding-bottom: 22px; color: var(--gpp-muted); max-width: var(--gpp-measure); }
.gpp-callout { border-left: 3px solid var(--gpp-accent); background: var(--gpp-surface); padding: 21px 26px; border-radius: 0 var(--gpp-radius-sm) var(--gpp-radius-sm) 0; }
.gpp-callout p { font-size: var(--gpp-type-caption); }
.gpp-callout--note { border-color: #b48643; }
.gpp-contact-block { display: flex; gap: 26px; align-items: center; justify-content: space-between; background: #203c49; color: #f7fafb; padding: clamp(25px,4vw,44px); border-radius: var(--gpp-radius-lg); }
.gpp-contact-block h2 { color: #fff; margin-bottom: 10px; }
.gpp-contact-block p { color: #cbdae0; max-width: 52ch; }
.gpp-contact-block .gpp-button { background: #fff; border-color: #fff; color: #203c49 !important; flex: 0 0 auto; }
.gpp-contact-block .gpp-button:hover { background: #d9e5e8; }
.gpp-video-facade { width: 100%; aspect-ratio: 16/9; min-height: 230px; border-radius: 12px; background: var(--gpp-surface); display: flex; align-items: center; justify-content: center; overflow: hidden; position: relative; }
.gpp-video-facade button { border: 0; border-radius: 50%; background: var(--gpp-accent); color: #fff; font-size: var(--gpp-type-h3); width: 70px; height: 70px; }
.gpp-video-facade iframe, .gpp-video-facade video { width: 100%; height: 100%; position: absolute; inset: 0; border: 0; }
/* Contact modal is outside the gpp-product tree to avoid container overflow and theme stacking. */
.gpp-modal-root { font-family: var(--gpp-font); font-size: var(--gpp-type-body); color: var(--gpp-text); }
.gpp-modal { width: min(95vw, 570px); max-height: min(94dvh, 820px); padding: 0; border: 1px solid var(--gpp-border); border-radius: 14px; box-shadow: 0 22px 90px rgba(13,32,43,.28); background: #fff; color: var(--gpp-text); }
.gpp-modal::backdrop { background: rgba(13,26,34,.63); backdrop-filter: blur(3px); }
.gpp-modal__header { padding: 27px 28px 20px; display: flex; align-items: center; justify-content: space-between; gap: 14px; border-bottom: 1px solid var(--gpp-border); }
.gpp-modal__header h2 { margin: 0; line-height: 1.2; font-size: var(--gpp-type-h3); color: var(--gpp-ink); }
.gpp-modal__close { background: transparent; border: 1px solid var(--gpp-border); width: 38px; height: 38px; font-size: var(--gpp-type-h3) !important; line-height: 1; border-radius: 7px; cursor: pointer; flex-shrink: 0; }
.gpp-modal__form { padding: 26px 28px 28px; display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.gpp-modal__field { display: grid; gap: 6px; min-width: 0; }
.gpp-modal__field--full { grid-column: 1/-1; }
.gpp-modal__field label { font-size: var(--gpp-type-caption); font-weight: 660; }
.gpp-modal__field input, .gpp-modal__field textarea { border: 1px solid #bcc8cd; border-radius: 7px; padding: 12px; width: 100%; min-width: 0; color: #223039; font: 400 var(--gpp-type-body)/1.4 var(--gpp-font); background: #fff; }
.gpp-modal__field textarea { resize: vertical; min-height: 102px; }
.gpp-modal__field input[readonly] { background: #edf0f1; color: #5d656b; }
.gpp-modal__field small { font-size: var(--gpp-type-label); color: var(--gpp-muted); }
.gpp-modal__footer { grid-column: 1/-1; display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 12px; padding-top: 4px; }
.gpp-modal__notice { grid-column: 1/-1; margin: 0; padding: 12px; border-radius: 7px; background: #eaf2f3; font-size: var(--gpp-type-label); color: #234754; }
.gpp-modal__submit { border-radius: 6px; border: 1px solid var(--gpp-accent); background: var(--gpp-accent); color: #fff; padding: 12px 22px; font-size: var(--gpp-type-body); font-weight: 700; cursor: pointer; }
.gpp-modal__submit[disabled] { opacity: .6; cursor: wait; }
.gpp-modal__required { color: var(--gpp-muted); font-size: var(--gpp-type-label); }
/* Informational catalog cards have their own namespace, completely separate from regular catalog product cards. */
.gpp-catalog-card { display: flex; flex-direction: column; justify-content: space-between; min-height: 224px; border-radius: 9px; background: #f0f1f2; padding: 28px; color: #171a1c; text-decoration: none; cursor: pointer; overflow: hidden; }
.gpp-catalog-card:hover { background: #e7eaec; }
.gpp-catalog-card__kind { text-transform: uppercase; font-weight: 700; letter-spacing: .09em; color: #677078; font-size: var(--gpp-type-label); }
.gpp-catalog-card__name { text-align: left; font-size: var(--gpp-type-h3); font-weight: 770; line-height: 1.12; letter-spacing: -.045em; overflow-wrap: anywhere; }
.gpp-catalog-card__link { color: #565f66; font-weight: 680; font-size: var(--gpp-type-label); }

/* assets/css/site-printpack.css */
/* Printpack.lv: light corporate/editorial presentation. Does not modify FactoryHub global styles. */
.gpp-product--wp { --gpp-accent: #225c6c; --gpp-surface: #f4f6f6; --gpp-surface-alt: #eaf0f1; }
.gpp-product--wp .gpp-hero { background: linear-gradient(120deg, #f1f5f5, #f9faf9 77%); }

/* assets/css/responsive.css */
/* Container queries react to the actual article canvas, including PrestaShop sidebars. */
@container (max-width: 820px) {
 .gpp-hero { grid-template-columns: 1fr; min-height: 0; }
 .gpp-hero__visual img { aspect-ratio: 1.6; }
 .gpp-feature-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .gpp-steps { grid-template-columns: 1fr 1fr; }
 .gpp-facts { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .gpp-fact:nth-child(2) { border-right: 0; }
 .gpp-fact:nth-child(-n+2) { border-bottom: 1px solid var(--gpp-border); }
 .gpp-gallery { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .gpp-compare-cards { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@container (max-width: 600px) {
 .gpp-product h1 { font-size: var(--gpp-type-h2); }
 .gpp-product h2 { font-size: var(--gpp-type-h3); }
 .gpp-hero { padding: 27px 23px; gap: 27px; }
 .gpp-hero__visual img { aspect-ratio: 1.25; }
 .gpp-feature-grid, .gpp-feature-grid--rows, .gpp-media-text, .gpp-applications, .gpp-steps, .gpp-compare-cards { grid-template-columns: 1fr; }
 .gpp-feature { padding: 22px; }
 .gpp-feature__index { margin-bottom: 18px; }
 .gpp-steps--timeline .gpp-step { grid-template-columns: 65px 1fr; }
 .gpp-specs__list { grid-template-columns: 1fr; }
 .gpp-media-text--media-right .gpp-media-text__media { order: 0; }
 .gpp-contact-block { flex-direction: column; align-items: flex-start; }
 .gpp-contact-block .gpp-button { width: 100%; }
 .gpp-gallery { grid-template-columns: 1fr 1fr; }
}
@container (max-width: 410px) {
 .gpp-facts { grid-template-columns: 1fr 1fr; }
 .gpp-fact { padding: 20px 13px; }
 .gpp-fact__value { font-size: var(--gpp-type-h3); }
 .gpp-gallery { grid-template-columns: 1fr; }
 .gpp-hero__title { font-size: var(--gpp-type-h2); }
 .gpp-hero__title--long { font-size: var(--gpp-type-h3) !important; }
}
@media (max-width: 580px) {
 .gpp-modal__form { grid-template-columns: 1fr; padding: 20px; }
 .gpp-modal__header { padding: 20px; }
 .gpp-modal__header h2 { font-size: var(--gpp-type-h3); }
}
/* WordPress integration shell */
.gpp-page-shell{width:100%;margin:0;padding:0;background:#fff;}
.gpp-honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important;}


/* GPP 0.3.1 — component-level refinement, six-token typography */
.gpp-page-shell { margin: 0 !important; padding: 0 !important; }
.gpp-product__inner { padding-top: clamp(22px, 2.4vw, 34px); }
.gpp-product__sections { gap: 0; }
.gpp-section + .gpp-section { margin-top: var(--gpp-section-gap); padding-top: 0; border-top: 0; }
/* Section separation is assigned by the renderer after LV/EN and site filtering.
   No visual rule is attached to the hero, key facts, boxed note or primary CTA. */
.gpp-product .gpp-section--with-divider { border-top: 1px solid var(--gpp-border); padding-top: 30px; }

/* Slightly stronger contrast on the shared light surfaces. */
.gpp-product--wp { --gpp-surface: #eef1f2; --gpp-surface-alt: #e5eaec; }
.gpp-product--wp .gpp-hero { background: linear-gradient(120deg, #edf1f1, #f7f8f8 77%); }

/* GPP v0.3.4: enforce 20px breathing room on all four sides in mobile Safari.
   Percentage-height flex children previously sized themselves from an indefinite
   parent height, allowing images to force the 3:2 panel taller and touch its edges.
   Keep the panel in normal flow, but position its image/link into the inset area.
   This works with landscape/portrait images and optional non-linked fallbacks. */
.gpp-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(20px, 2.3vw, 30px); align-items: start; align-content: start; }
.gpp-gallery figure { margin: 0; min-width: 0; align-self: start; }
.gpp-product .gpp-gallery__media,
.gpp-product .gpp-media-text__media {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  min-width: 0;
  min-height: 0;
  aspect-ratio: 3 / 2;
  padding: 20px;
  background: var(--gpp-surface);
  border-radius: var(--gpp-radius-md);
  overflow: hidden;
}
.gpp-product .gpp-gallery__media > .gpp-lightbox-trigger,
.gpp-product .gpp-media-text__media > .gpp-lightbox-trigger {
  position: absolute;
  inset: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  height: auto;
  min-width: 0;
  min-height: 0;
}
.gpp-product .gpp-gallery__media > .gpp-lightbox-trigger > img,
.gpp-product .gpp-media-text__media > .gpp-lightbox-trigger > img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  aspect-ratio: auto;
  object-fit: contain;
  object-position: center;
  background: transparent;
  border-radius: 6px;
}
/* In rare cases an imported image has no full-size lightbox URL. */
.gpp-product .gpp-gallery__media > img,
.gpp-product .gpp-media-text__media > img {
  position: absolute;
  inset: 20px;
  display: block;
  width: calc(100% - 40px);
  height: calc(100% - 40px);
  max-width: calc(100% - 40px);
  max-height: calc(100% - 40px);
  aspect-ratio: auto;
  object-fit: contain;
  object-position: center;
  background: transparent;
  border-radius: 6px;
}
.gpp-gallery figcaption { padding: 10px 3px 0; font-size: var(--gpp-type-caption); line-height: 1.45; }
/* Split media/text preserves the 60/40 desktop layout. */
.gpp-media-text { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); }
.gpp-media-text.gpp-media-text--stacked { grid-template-columns: 1fr; }

/* Lightbox for product media. */
.gpp-lightbox-trigger { display: block; color: inherit !important; text-decoration: none !important; cursor: zoom-in; border-radius: inherit; }
.gpp-lightbox-trigger img { transition: transform .18s ease, opacity .18s ease; }
.gpp-lightbox-trigger:hover img { transform: scale(1.008); opacity: .96; }

/* GPP v0.3.3: mouse/touch clicks must not inherit the theme's dark link-focus ring.
   Keep an intentional visible focus ring for keyboard navigation only. */
.gpp-product a.gpp-lightbox-trigger,
.gpp-product a.gpp-lightbox-trigger:focus,
.gpp-product a.gpp-lightbox-trigger:active {
  border: 0 !important;
  box-shadow: none !important;
}
.gpp-product a.gpp-lightbox-trigger:focus:not(:focus-visible) {
  outline: none !important;
}
.gpp-product a.gpp-lightbox-trigger:focus-visible {
  outline: 2px solid var(--gpp-accent) !important;
  outline-offset: 4px;
}
.gpp-product a.gpp-lightbox-trigger img,
.gpp-product a.gpp-lightbox-trigger:focus img,
.gpp-product a.gpp-lightbox-trigger:active img {
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
}

.gpp-lightbox-root { font-family: var(--gpp-font); font-size: var(--gpp-type-body); }
.gpp-lightbox { width: min(96vw, 1440px); max-width: 1440px; max-height: 94dvh; padding: 18px; border: 0; border-radius: 12px; background: #101416; color: #fff; box-shadow: 0 24px 100px rgba(0,0,0,.45); }
.gpp-lightbox::backdrop { background: rgba(7,12,15,.86); backdrop-filter: blur(3px); }
.gpp-lightbox figure { margin: 0; display: grid; justify-items: center; gap: 10px; }
.gpp-lightbox img { display: block; max-width: 100%; max-height: calc(94dvh - 76px); width: auto; height: auto; object-fit: contain; }
.gpp-lightbox figcaption { max-width: 90ch; font-size: var(--gpp-type-label); line-height: 1.45; color: #d7dfe2; text-align: center; }
.gpp-lightbox__close { position: absolute; z-index: 2; top: 9px; right: 9px; width: 40px; height: 40px; border: 1px solid rgba(255,255,255,.3); border-radius: 50%; background: rgba(0,0,0,.58); color: #fff; font-size: var(--gpp-type-h3); line-height: 1; cursor: pointer; }

/* Comparison tables transform instead of scrolling horizontally on small canvases. */
.gpp-comparison-mobile { display: none; }
.gpp-comparison-item { padding: 20px; border: 1px solid var(--gpp-border); border-radius: var(--gpp-radius-md); background: #fff; }
.gpp-comparison-item h3 { margin-bottom: 17px; font-size: var(--gpp-type-h3); }
.gpp-comparison-item dl { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; }
.gpp-comparison-item dl > div { padding: 13px; border-radius: 7px; background: var(--gpp-surface); }
.gpp-comparison-item dt { color: var(--gpp-muted); font-size: var(--gpp-type-label); line-height: 1.35; }
.gpp-comparison-item dd { margin: 5px 0 0; color: var(--gpp-ink); font-size: var(--gpp-type-caption); font-weight: 680; line-height: 1.4; }

@container (max-width: 991px) {
  .gpp-media-text { grid-template-columns: 1fr; gap: 26px; }
  .gpp-media-text--media-right .gpp-media-text__media { order: 0; }
  .gpp-media-text--media-right .gpp-media-text__copy { order: 1; }
}
@container (max-width: 720px) {
  .gpp-gallery { grid-template-columns: 1fr; }
  .gpp-comparison-desktop { display: none; }
  .gpp-comparison-mobile { display: grid; gap: 12px; }
}
@container (max-width: 480px) {
  .gpp-comparison-item dl { grid-template-columns: 1fr; }
}


/* GPP v0.3.9 — compact mobile modal with comfortable full-width stacked fields.
   Preserve the desktop design and native dialog scrolling on short screens. */
@media (max-width: 580px) {
  .gpp-modal-root .gpp-modal {
    width: calc(100vw - 24px);
    max-width: 570px;
    max-height: calc(100dvh - 20px);
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .gpp-modal-root .gpp-modal__header {
    padding: 12px 16px;
    gap: 12px;
  }
  .gpp-modal-root .gpp-modal__header h2 {
    font-size: var(--gpp-type-h3);
    line-height: 1.2;
  }
  .gpp-modal-root .gpp-modal__close {
    width: 40px;
    height: 40px;
  }
  .gpp-modal-root .gpp-modal__form {
    grid-template-columns: minmax(0, 1fr);
    padding: 12px 16px 16px;
    gap: 8px;
  }
  .gpp-modal-root .gpp-modal__field {
    min-width: 0;
    gap: 4px;
  }
  .gpp-modal-root .gpp-modal__field label {
    font-size: var(--gpp-type-label);
    line-height: 1.3;
  }
  .gpp-modal-root .gpp-modal__field input {
    height: 44px;
    min-height: 44px;
    padding: 8px 10px;
    font-size: 16px; /* Prevent iOS Safari auto-zoom on focus. */
    line-height: 1.35;
  }
  .gpp-modal-root .gpp-modal__field textarea {
    min-height: 76px;
    height: 76px;
    padding: 9px 10px;
    font-size: 16px;
    line-height: 1.4;
  }
  .gpp-modal-root .gpp-modal__footer {
    padding-top: 0;
  }
  .gpp-modal-root .gpp-modal__submit {
    min-height: 44px;
    padding: 10px 20px;
  }
  .gpp-modal-root .gpp-modal__notice {
    padding: 9px 11px;
  }
}