/* ==========================================================
   VIEWPORT CONTROL OWNER
   Scope: PL homepage only.

   Edit these variables to tune page rail, section padding,
   content rails and grid/card rhythm. Do not patch individual
   sections unless screenshot evidence proves a real exception.

   Viewport families covered by the variable formula below:
   - micro mobile / compact Android / iPhone: 320-430
   - large mobile / phablet: 480-640
   - tablet portrait / small laptop: 641-1180
   - laptop / desktop base: 1181-1919
   - desktop / 2K / large Mac / ultrawide / 4K: 1920+
   ========================================================== */

html[lang="pl"] body.dsk-page-home.dsk-home-owner-v4 {
  /* BASE CONTROL PANEL */
  --dsk-page-rail-max: 1680px;
  --dsk-page-rail-x: clamp(14px, 4vw, 18px);
  --dsk-section-x: var(--dsk-page-rail-x);
  --dsk-section-y: clamp(34px, 6vw, 48px);
  --dsk-content-rail-max: var(--dsk-page-rail-max);
  --dsk-narrow-rail-max: 980px;
  --dsk-hero-rail-max: var(--dsk-page-rail-max);
  --dsk-form-rail-max: var(--dsk-page-rail-max);
  --dsk-card-grid-gap: clamp(14px, 3vw, 20px);
  --dsk-card-min: 280px;
  --dsk-card-max: 1fr;
  --dsk-section-stack-gap: clamp(22px, 5vw, 34px);

  --dsk-page-rail-width: min(
    var(--dsk-page-rail-max),
    calc(100vw - (2 * var(--dsk-page-rail-x)))
  );
  --dsk-page-rail-left: calc((100vw - var(--dsk-page-rail-width)) / 2);
  --dsk-content-rail-width: min(var(--dsk-content-rail-max), var(--dsk-page-rail-width));
  --dsk-hero-rail-width: min(var(--dsk-hero-rail-max), var(--dsk-page-rail-width));
  --dsk-form-rail-width: min(var(--dsk-form-rail-max), var(--dsk-page-rail-width));

  --dsk-home-owner-v4-rail-max: var(--dsk-page-rail-max);
  --dsk-home-owner-v4-rail-width: var(--dsk-page-rail-width);
  --dsk-home-owner-v4-rail-left: var(--dsk-page-rail-left);
}

/* TABLET PORTRAIT / TABLET LANDSCAPE / SMALL LAPTOP */
@media (min-width: 641px) and (max-width: 1180px) {
  html[lang="pl"] body.dsk-page-home.dsk-home-owner-v4 {
    --dsk-page-rail-x: 18px;
    --dsk-section-y: clamp(34px, 4.6vw, 46px);
    --dsk-card-grid-gap: clamp(16px, 2.1vw, 22px);
    --dsk-section-stack-gap: clamp(26px, 3.6vw, 38px);
  }
}

/* LAPTOP / DESKTOP BASE */
@media (min-width: 1181px) {
  html[lang="pl"] body.dsk-page-home.dsk-home-owner-v4 {
    --dsk-page-rail-x: clamp(48px, 4vw, 90px);
    --dsk-section-y: clamp(32px, 2.4vw, 50px);
    --dsk-card-grid-gap: clamp(20px, 1.6vw, 28px);
    --dsk-section-stack-gap: clamp(28px, 1.9vw, 38px);
  }
}

/* DESKTOP / 2K / LARGE MAC / ULTRAWIDE / 4K */
@media (min-width: 1920px) {
  html[lang="pl"] body.dsk-page-home.dsk-home-owner-v4 {
    --dsk-page-rail-x: max(120px, calc((100vw - var(--dsk-page-rail-max)) / 2));
    --dsk-card-grid-gap: clamp(24px, 1.05vw, 34px);
  }
}

html[lang="pl"] body.dsk-page-home.dsk-home-owner-v4 main#main-content
  .dsk-home-rail:not(.dsk-home-footer-rail) {
  box-sizing: border-box;
  inline-size: var(--dsk-content-rail-width);
  width: var(--dsk-content-rail-width);
  max-inline-size: var(--dsk-content-rail-width);
  max-width: var(--dsk-content-rail-width);
  margin-left: var(--dsk-page-rail-left);
  margin-right: auto;
  padding-inline: 0;
}

html[lang="pl"] body.dsk-page-home.dsk-home-owner-v4 main#main-content
  #strona-glowna.dsk-home-hero-owner-v4 .dsk-home-hero-rail {
  inline-size: var(--dsk-hero-rail-width);
  width: var(--dsk-hero-rail-width);
  max-inline-size: var(--dsk-hero-rail-width);
  max-width: var(--dsk-hero-rail-width);
  margin-left: var(--dsk-page-rail-left);
  margin-right: auto;
  padding-inline: 0;
}

html[lang="pl"] body.dsk-page-home.dsk-home-owner-v4 main#main-content
  #formularz-zgloszeniowy.dsk-home-contact-owner-v4 .dsk-home-contact-rail {
  inline-size: var(--dsk-form-rail-width);
  width: var(--dsk-form-rail-width);
  max-inline-size: var(--dsk-form-rail-width);
  max-width: var(--dsk-form-rail-width);
}

/* home-mobile-footer-content-rail-relock-20260615:
   Footer wrapper owns the mobile rail; the visible footer grid must not add a
   second horizontal inset inside that rail. */
html[lang="pl"] body.dsk-page-home.dsk-home-owner-v4.dsk-page-home footer.dsk-site-footer.dsk-site-footer
  > .dsk-custom-footer.dsk-home-footer-owner-v4.dsk-custom-footer {
  box-sizing: border-box;
  inline-size: var(--dsk-page-rail-width);
  width: var(--dsk-page-rail-width);
  max-inline-size: var(--dsk-page-rail-width);
  max-width: var(--dsk-page-rail-width);
  margin-left: var(--dsk-page-rail-left);
  margin-right: auto;
  padding-inline: 0;
}

html[lang="pl"] body.dsk-page-home.dsk-home-owner-v4.dsk-page-home footer.dsk-site-footer.dsk-site-footer
  .dsk-grid.dsk-home-rail.dsk-home-footer-rail,
html[lang="pl"] body.dsk-page-home.dsk-home-owner-v4.dsk-page-home footer.dsk-site-footer.dsk-site-footer
  .dsk-home-footer-rail {
  box-sizing: border-box;
  inline-size: 100%;
  width: 100%;
  max-inline-size: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
  padding-inline: 0;
}

html[lang="pl"] body.dsk-page-home.dsk-home-owner-v4 main#main-content
  :where(
    .dsk-hero-utility__inner,
    .dsk-why-lab__grid,
    .dsk-process-timeline,
    .dsk-services-cards,
    .dsk-reviews-premium__grid,
    .dsk-about-benefits-list
  ) {
  gap: var(--dsk-card-grid-gap);
}

html[lang="pl"] body.dsk-page-home.dsk-home-owner-v4 main#main-content
  :where(
    .dsk-home-row,
    .dsk-home-column,
    .dsk-home-column-content,
    .dsk-contact-layout,
    .dsk-contact-panel,
    .dsk-service-card,
    .items-grid__item
  ) {
  min-width: 0;
}