/* =========================================================
   Aqua One Production 2.5 — canonical responsive layer
   ---------------------------------------------------------
   Loaded AFTER theme.css. This file is the single source of truth for
   tablet/mobile behaviour and deliberately overrides earlier fidelity rules.
   Desktop (>900px) keeps the supplied reference-canvas composition.
   Tablet/mobile reflows live HTML text instead of scaling tiny absolute labels.
   ========================================================= */

/* Make every grid/flex child shrinkable; prevents accidental horizontal overflow. */
.aq-ref-stage *,
.aq-choice-grid > *,
.aq-use-grid > *,
.aq-process-track > *,
.aq-audience-grid > *,
.aq-contact-grid > *,
.footer-grid > * { min-width:0; }

html, body { max-width:100%; overflow-x:hidden; }

/* ---------- TABLET + NARROW DESKTOP: switch reference art to reflow ---------- */
@media (max-width:900px) {
  .container,
  .aq-ref-header-inner { width:min(100% - 32px,1180px); }

  /* Header */
  .aq-ref-header-inner { height:72px; }
  .aq-ref-brand .aqua-default-logo,
  .aq-ref-brand .custom-logo { width:88px; max-height:42px; object-fit:contain; }
  .menu-toggle { display:block; margin-left:auto; }
  .aq-ref-nav {
    position:absolute; display:none; left:0; right:0; top:71px; margin:0;
    background:#fff; border-bottom:1px solid #e2e6e8;
    box-shadow:0 12px 30px rgba(0,0,0,.08); z-index:110;
  }
  .aq-ref-nav.open { display:block; }
  .aq-ref-nav .aqua-menu { display:block; padding:10px 20px 18px; }
  .aq-ref-nav .aqua-menu > li > a { display:block; padding:12px 0; font-size:14px; }
  .aq-ref-actions { margin-left:14px; }
  .aq-ref-actions .lang { display:none; }
  .aq-ref-cta { min-width:0; padding:9px 12px; font-size:10px; }

  /* HOME HERO: live copy above a dedicated photographic crop. No absolute type. */
  .aq-ref-home-hero {
    display:flex; flex-direction:column; min-height:0; overflow:hidden; background:#eef7fc;
  }
  .aq-ref-home-hero::after { display:none !important; content:none !important; }
  .aq-ref-home-hero .aq-ref-home-copy {
    position:relative; inset:auto; width:auto; order:1; z-index:2;
    padding:34px 24px 26px; background:#fff;
  }
  .aq-ref-home-hero .aq-ref-eyebrow {
    font-size:clamp(18px,3.2vw,25px); line-height:1.1; white-space:normal; max-width:none;
  }
  .aq-ref-home-hero .aq-ref-home-copy h1 {
    font-size:clamp(38px,7vw,54px); line-height:1; margin:15px 0 18px; max-width:560px;
  }
  .aq-ref-home-hero .aq-ref-home-copy h1 span { white-space:normal; }
  .aq-ref-home-hero .aq-ref-home-copy p {
    font-size:clamp(15px,2.5vw,18px); line-height:1.3; max-width:520px; margin:0 0 20px;
  }
  .aq-ref-home-hero .aq-ref-button {
    display:inline-flex; width:auto; min-height:38px; padding:10px 15px;
    font-size:11px; line-height:1; border-radius:6px;
  }
  .aq-ref-home-hero .aq-ref-stage-bg {
    position:relative; inset:auto; order:2; width:100%; height:clamp(260px,43vw,360px);
    object-fit:cover; object-position:69% center; margin:0;
  }

  /* PRODUCT STORY / O PRODUKCIE: image and labels become normal flow. */
  .aq-ref-story {
    display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px 14px; padding:34px 20px 30px; overflow:visible; background:#f7f7f7;
  }
  .aq-ref-story .aq-ref-story-copy {
    position:relative; inset:auto; width:auto; grid-column:1/-1; grid-row:auto;
    text-align:left; padding:0 0 6px;
  }
  .aq-ref-story .aq-ref-story-copy h1,
  .aq-ref-story .aq-ref-story-copy h2 {
    font-size:clamp(34px,6.4vw,46px); line-height:.96; margin:0 0 18px;
  }
  .aq-ref-story .aq-ref-story-copy p {
    font-size:15px; line-height:1.35; max-width:520px; margin:0 0 18px;
  }
  .aq-ref-story .aq-ref-story-copy .aq-ref-button {
    font-size:10px; min-height:36px; padding:9px 12px; white-space:normal;
  }
  .aq-ref-story .aq-ref-stage-bg {
    position:relative; inset:auto; grid-column:1/-1; width:100%;
    height:clamp(235px,42vw,340px); object-fit:cover; object-position:center center;
    margin:4px 0 8px;
  }
  .aq-ref-story .aq-ref-callout,
  .aq-ref-story .aq-ref-story-tl,
  .aq-ref-story .aq-ref-story-tr,
  .aq-ref-story .aq-ref-story-bl,
  .aq-ref-story .aq-ref-story-br {
    position:relative; inset:auto; left:auto; right:auto; top:auto; bottom:auto;
    display:block; width:auto; max-width:none; min-height:74px;
    padding:13px 14px; border:1px solid #dce4e8; border-radius:8px;
    background:#fff; font-size:14px; line-height:1.25;
  }
  .aq-ref-story .aq-ref-callout::before,
  .aq-ref-story .aq-ref-callout::after { display:none !important; content:none !important; }
  .aq-ref-story .aq-ref-callout b { font-weight:600; }

  /* WODA Z TWOIM LOGO HERO: split live copy and artwork. */
  .aq-ref-subhero {
    display:flex; flex-direction:column; min-height:0; overflow:hidden; background:#eef8fd;
  }
  .aq-ref-subhero::after { display:none !important; content:none !important; }
  .aq-ref-subhero .aq-ref-subhero-copy {
    position:relative; inset:auto; width:auto; order:1; padding:32px 22px 24px; background:#fff;
  }
  .aq-ref-subhero .aq-ref-subhero-copy h1 {
    font-size:clamp(34px,6.2vw,46px); line-height:1; margin:0 0 17px; max-width:570px;
  }
  .aq-ref-subhero .aq-ref-subhero-copy p {
    font-size:15px; line-height:1.35; max-width:560px; margin:0 0 18px;
  }
  .aq-ref-subhero .aq-ref-subhero-buttons { display:flex; flex-wrap:wrap; gap:9px; }
  .aq-ref-subhero .aq-ref-subhero-buttons .aq-ref-button {
    min-height:35px; padding:9px 11px; font-size:9px; line-height:1.1;
  }
  .aq-ref-subhero .aq-ref-stage-bg {
    position:relative; inset:auto; order:2; width:100%; height:clamp(250px,43vw,340px);
    object-fit:cover; object-position:71% center; margin:0;
  }

  /* PERSONALISATION: no absolute overlays below 901px.
     Artwork remains a visual illustration; all six descriptions become cards. */
  .aq-ref-personal {
    display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px; min-height:0; padding:30px 20px 32px; overflow:visible;
    background:#e2e1db;
  }
  .aq-ref-personal .aq-ref-personal-intro {
    position:relative; inset:auto; width:auto; grid-column:1/-1; order:1;
    padding:0; text-align:left;
  }
  .aq-ref-personal .aq-ref-personal-intro h2 {
    font-size:clamp(30px,5.5vw,40px); line-height:.98; margin:0 0 20px; max-width:620px;
  }
  .aq-ref-personal .aq-ref-personal-intro h2 span { white-space:normal; }
  .aq-ref-personal .aq-ref-personal-intro p {
    font-size:14px; line-height:1.45; max-width:570px; margin:0 0 15px;
  }
  .aq-ref-personal .aq-ref-stage-bg {
    position:relative; inset:auto; grid-column:1/-1; order:2; width:100%;
    height:clamp(250px,42vw,340px); object-fit:cover; object-position:center center;
    margin:2px 0 6px;
  }
  .aq-ref-personal .aq-ref-spec,
  .aq-ref-personal .aq-ref-spec-1,
  .aq-ref-personal .aq-ref-spec-2,
  .aq-ref-personal .aq-ref-spec-3,
  .aq-ref-personal .aq-ref-spec-4,
  .aq-ref-personal .aq-ref-spec-5,
  .aq-ref-personal .aq-ref-spec-6 {
    position:relative; inset:auto; left:auto; right:auto; top:auto; bottom:auto;
    width:auto; order:3; padding:14px 15px; margin:0; min-height:96px;
    border:1px solid rgba(30,58,75,.10); border-radius:8px;
    background:rgba(255,255,255,.76); box-shadow:none;
    font-size:14px; line-height:1.25; text-align:left;
  }
  .aq-ref-personal .aq-ref-spec b,
  .aq-ref-personal .aq-ref-spec-2 b {
    display:block; margin:0 0 5px; font-size:14px; line-height:1.18; white-space:normal;
  }
  .aq-ref-personal .aq-ref-spec small,
  .aq-ref-personal .aq-ref-spec-2 small {
    display:block; width:auto; margin:0; padding:0; font-size:12px; line-height:1.32; text-align:left;
  }
  .aq-ref-personal .aq-ref-spec br { display:none; }
  .aq-ref-spec-line { display:none !important; }

  /* Generic content grids */
  .aq-choice-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:45px 14px; }
  .aq-use-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
  .aq-process-track { grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
  .aq-process-track::before,
  .aq-step-icon::before,
  .aq-step-icon::after { display:none !important; }
  .aq-audience-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
  .aq-contact-grid { grid-template-columns:1fr; gap:28px; }
  .gallery-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .footer-grid > div:first-child { grid-column:1/-1; }
}

/* ---------- PHONES ---------- */
@media (max-width:560px) {
  .container,
  .aq-ref-header-inner { width:min(100% - 28px,1180px); }

  .aq-ref-actions { display:none; }
  .aq-ref-brand .aqua-default-logo,
  .aq-ref-brand .custom-logo { width:82px; }

  .aq-ref-home-hero .aq-ref-home-copy { padding:28px 18px 22px; }
  .aq-ref-home-hero .aq-ref-eyebrow { font-size:18px; }
  .aq-ref-home-hero .aq-ref-home-copy h1 { font-size:clamp(34px,10vw,43px); }
  .aq-ref-home-hero .aq-ref-home-copy p { font-size:15px; }
  .aq-ref-home-hero .aq-ref-stage-bg { height:240px; object-position:70% center; }

  .aq-ref-story { grid-template-columns:1fr; padding:30px 16px 26px; }
  .aq-ref-story .aq-ref-story-copy,
  .aq-ref-story .aq-ref-stage-bg { grid-column:1; }
  .aq-ref-story .aq-ref-story-copy h1,
  .aq-ref-story .aq-ref-story-copy h2 { font-size:34px; }
  .aq-ref-story .aq-ref-stage-bg { height:220px; }
  .aq-ref-story .aq-ref-callout { min-height:0; font-size:13px; }

  .aq-ref-subhero .aq-ref-subhero-copy { padding:28px 18px 22px; }
  .aq-ref-subhero .aq-ref-subhero-copy h1 { font-size:34px; }
  .aq-ref-subhero .aq-ref-subhero-copy p { font-size:14px; }
  .aq-ref-subhero .aq-ref-subhero-buttons { flex-direction:column; align-items:flex-start; }
  .aq-ref-subhero .aq-ref-stage-bg { height:235px; object-position:72% center; }

  .aq-ref-personal { grid-template-columns:1fr; padding:28px 16px 30px; gap:10px; }
  .aq-ref-personal .aq-ref-personal-intro,
  .aq-ref-personal .aq-ref-stage-bg { grid-column:1; }
  .aq-ref-personal .aq-ref-personal-intro h2 { font-size:31px; }
  .aq-ref-personal .aq-ref-personal-intro p { font-size:13px; }
  .aq-ref-personal .aq-ref-stage-bg { height:250px; object-position:center center; }
  .aq-ref-personal .aq-ref-spec,
  .aq-ref-personal .aq-ref-spec-1,
  .aq-ref-personal .aq-ref-spec-2,
  .aq-ref-personal .aq-ref-spec-3,
  .aq-ref-personal .aq-ref-spec-4,
  .aq-ref-personal .aq-ref-spec-5,
  .aq-ref-personal .aq-ref-spec-6 {
    grid-column:1; min-height:0; padding:13px 14px; font-size:13px;
  }

  .aq-choice-grid,
  .aq-process-track,
  .aq-audience-grid,
  .gallery-grid,
  .form-grid { grid-template-columns:1fr; }
  .aq-use-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .footer-grid { grid-template-columns:1fr; }
  .footer-grid > div:first-child { grid-column:auto; }
}

/* Very narrow devices: keep padding and text inside viewport. */
@media (max-width:380px) {
  .aq-ref-home-hero .aq-ref-home-copy h1,
  .aq-ref-story .aq-ref-story-copy h1,
  .aq-ref-story .aq-ref-story-copy h2,
  .aq-ref-subhero .aq-ref-subhero-copy h1,
  .aq-ref-personal .aq-ref-personal-intro h2 { font-size:30px; }
  .aq-ref-home-hero .aq-ref-stage-bg,
  .aq-ref-subhero .aq-ref-stage-bg,
  .aq-ref-personal .aq-ref-stage-bg { height:220px; }
  .aq-use-grid { grid-template-columns:1fr; }
}

/* =========================================================
   Aqua One Production 2.6 — scalable personalisation canvas
   ---------------------------------------------------------
   The previous mobile card reflow separated labels from the reference art.
   In 2.6 the product, blue connectors and live HTML labels share ONE canvas.
   Labels remain editable/searchable HTML, but their anchors and typography
   scale with the same diagram container. This keeps the composition coherent
   at desktop, tablet and phone widths without turning the text into a raster.
   ========================================================= */
.aq-personal-v26{
  --aq-personal-bg:#e2e1db;
  background:var(--aq-personal-bg);
  overflow:hidden;
  padding:clamp(28px,3.2vw,52px) 0;
}
.aq-personal-v26__inner{
  width:min(1500px,calc(100% - 32px));
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(250px,28%) minmax(0,72%);
  gap:clamp(18px,2.8vw,44px);
  align-items:center;
}
.aq-personal-v26__intro{
  min-width:0;
  align-self:start;
  padding-top:clamp(4px,1vw,14px);
}
.aq-personal-v26__intro h2{
  margin:0 0 clamp(22px,2.1vw,34px);
  font-family:var(--aq-ref-display);
  font-size:clamp(30px,2.55vw,42px);
  line-height:.96;
  font-weight:800;
  letter-spacing:-.03em;
  color:#101214;
}
.aq-personal-v26__intro h2 span{color:var(--aq-ref-teal)}
.aq-personal-v26__intro p{
  margin:0 0 clamp(18px,1.8vw,28px);
  max-width:330px;
  font-family:var(--aq-ref-ui);
  font-size:clamp(13px,1.05vw,16px);
  line-height:1.45;
  color:#151718;
}
.aq-personal-v26__diagram{
  container-type:inline-size;
  position:relative;
  width:100%;
  aspect-ratio:485/317;
  min-width:0;
  isolation:isolate;
}
.aq-personal-v26__bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  user-select:none;
  pointer-events:none;
  z-index:0;
}
.aq-personal-v26__label{
  position:absolute;
  z-index:2;
  width:25%;
  padding:.55cqw .7cqw;
  font-family:var(--aq-ref-ui);
  font-size:clamp(10px,1.55cqw,16px);
  line-height:1.16;
  color:#0d1114;
  background:color-mix(in srgb,var(--aq-personal-bg) 92%,transparent);
  box-shadow:0 0 0 .55cqw color-mix(in srgb,var(--aq-personal-bg) 92%,transparent);
}
.aq-personal-v26__label b{
  display:block;
  margin:0 0 .42cqw;
  font-size:1em;
  line-height:1.1;
  font-weight:700;
}
.aq-personal-v26__label small{
  display:block;
  font-size:.76em;
  line-height:1.24;
  font-weight:400;
}
/* Text anchors are tied to the cropped connector artwork, not the viewport. */
.aq-personal-v26__label--1{left:0.5%;top:4.2%;width:26%}
.aq-personal-v26__label--2{right:.5%;top:4.2%;width:27%;text-align:left}
.aq-personal-v26__label--3{left:.5%;top:39.7%;width:25%}
.aq-personal-v26__label--4{right:.5%;top:39.7%;width:24%}
.aq-personal-v26__label--5{left:.5%;top:70.0%;width:27%}
.aq-personal-v26__label--6{right:.5%;top:70.0%;width:28%}

/* Tablet: intro moves above, diagram remains a single scalable composition. */
@media(max-width:900px){
  .aq-personal-v26{padding:30px 0 34px}
  .aq-personal-v26__inner{
    width:min(760px,calc(100% - 32px));
    grid-template-columns:1fr;
    gap:20px;
  }
  .aq-personal-v26__intro{padding:0}
  .aq-personal-v26__intro h2{font-size:clamp(31px,6vw,40px);margin-bottom:20px}
  .aq-personal-v26__intro p{max-width:620px;font-size:14px;margin-bottom:15px}
  .aq-personal-v26__diagram{width:min(100%,700px);margin:0 auto}
  .aq-personal-v26__label{font-size:clamp(10px,1.9cqw,14px)}
}

/* Phones: keep the diagram intact instead of generating detached cards. */
@media(max-width:560px){
  .aq-personal-v26{padding:28px 0 30px}
  .aq-personal-v26__inner{width:calc(100% - 24px);gap:16px}
  .aq-personal-v26__intro h2{font-size:31px;line-height:.98;margin-bottom:18px}
  .aq-personal-v26__intro p{font-size:13px;line-height:1.42;margin-bottom:13px}
  .aq-personal-v26__diagram{
    width:100%;
    max-width:520px;
    min-height:0;
    aspect-ratio:485/317;
  }
  .aq-personal-v26__label{
    font-size:clamp(9.5px,2.55cqw,12px);
    padding:.65cqw .75cqw;
    box-shadow:0 0 0 .7cqw color-mix(in srgb,var(--aq-personal-bg) 94%,transparent);
  }
  .aq-personal-v26__label small{font-size:.74em;line-height:1.2}
  .aq-personal-v26__label--1{left:0;top:2.8%;width:28%}
  .aq-personal-v26__label--2{right:0;top:2.8%;width:29%}
  .aq-personal-v26__label--3{left:0;top:38.5%;width:27%}
  .aq-personal-v26__label--4{right:0;top:38.5%;width:27%}
  .aq-personal-v26__label--5{left:0;top:69%;width:29%}
  .aq-personal-v26__label--6{right:0;top:69%;width:29%}
}

@media(max-width:380px){
  .aq-personal-v26__inner{width:calc(100% - 18px)}
  .aq-personal-v26__intro h2{font-size:28px}
  .aq-personal-v26__label{font-size:9.5px}
  .aq-personal-v26__label small{font-size:.72em}
}

/* =========================================================
   Aqua One Production 2.7 — artifact-free product diagram
   ---------------------------------------------------------
   The product/connector artwork is now stored with a transparent background.
   This removes the hard rectangular crop and the white horizontal edge
   artifacts that became visible when the diagram was scaled on mobile.
   The live HTML labels and all responsive anchors remain unchanged.
   ========================================================= */
.aq-personal-v26__bg{
  object-fit:contain;
  background:transparent;
}
@media(max-width:900px){
  .aq-personal-v26__diagram{
    background:transparent;
  }
}

/* =========================================================
   Aqua One Production 2.8 — unified responsive diagrams
   ---------------------------------------------------------
   Both complex reference sections now keep image geometry and live labels
   inside one responsive canvas. No detached mobile cards. Personalisation
   uses a lossless crop restored from the original PNG and is never enlarged
   far beyond the reference size, which keeps the carton visibly sharper.
   ========================================================= */

/* PRODUCT STORY: copy + one anchored diagram canvas. */
.aq-story-v28{
  background:#f7f7f7;
  overflow:hidden;
}
.aq-story-v28__inner{
  width:min(1180px,100%);
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(280px,33.333%) minmax(0,66.667%);
  align-items:center;
}
.aq-story-v28__copy{
  padding:clamp(26px,3vw,46px) clamp(20px,2.4vw,34px);
  min-width:0;
}
.aq-story-v28__copy h1,
.aq-story-v28__copy h2{
  margin:0 0 clamp(18px,2vw,26px);
  font-family:var(--aq-ref-display);
  font-size:clamp(34px,3.8vw,50px);
  line-height:.94;
  font-weight:800;
  letter-spacing:-.035em;
  color:#2e3032;
}
.aq-story-v28__copy h1 span,
.aq-story-v28__copy h2 span{color:var(--aq-ref-teal)}
.aq-story-v28__copy p{
  margin:0 0 22px;
  max-width:330px;
  font-size:clamp(14px,1.25vw,17px);
  line-height:1.35;
}
.aq-story-v28__copy .aq-ref-button{
  font-size:clamp(9px,.88vw,11px);
  white-space:normal;
}
.aq-story-v28__diagram{
  container-type:inline-size;
  position:relative;
  width:100%;
  max-width:900px;
  aspect-ratio:640/316;
  justify-self:center;
  isolation:isolate;
}
.aq-story-v28__diagram>img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  user-select:none;
  pointer-events:none;
}
.aq-story-v28__label{
  position:absolute;
  z-index:2;
  font-family:var(--aq-ref-ui);
  font-size:clamp(11px,2.15cqw,18px);
  line-height:1.18;
  font-weight:400;
  color:#2e3032;
  background:#f7f7f7;
  box-shadow:0 0 0 .35cqw #f7f7f7;
}
.aq-story-v28__label--tl{left:8.1%;top:8.0%;width:18.5%}
.aq-story-v28__label--bl{left:8.1%;top:61.5%;width:20.5%}
.aq-story-v28__label--tr{left:77.0%;top:7.8%;width:18.8%}
.aq-story-v28__label--br{left:77.0%;top:61.5%;width:19.5%}

/* PERSONALISATION: preserve original-size sharpness and keep labels anchored. */
.aq-personal-v26__inner{
  width:min(1180px,calc(100% - 32px));
  grid-template-columns:minmax(260px,30%) minmax(0,70%);
  gap:clamp(18px,2.4vw,34px);
}
.aq-personal-v26__diagram{
  width:min(100%,650px);
  max-width:650px;
  justify-self:center;
  aspect-ratio:485/317;
}
.aq-personal-v26__bg{
  image-rendering:auto;
  object-fit:contain;
}
.aq-personal-v26__label{
  font-size:clamp(10px,1.72cqw,14px);
  background:#e2e1db;
  box-shadow:0 0 0 .55cqw #e2e1db;
}
.aq-personal-v26__label small{font-size:.76em;line-height:1.22}

@media(max-width:900px){
  .aq-story-v28__inner{
    width:min(760px,100%);
    grid-template-columns:1fr;
  }
  .aq-story-v28__copy{
    padding:32px 20px 22px;
  }
  .aq-story-v28__copy h1,
  .aq-story-v28__copy h2{
    font-size:clamp(34px,6vw,44px);
    max-width:580px;
  }
  .aq-story-v28__copy p{max-width:600px;font-size:15px}
  .aq-story-v28__diagram{
    width:min(100%,700px);
    margin:0 auto 18px;
  }
  .aq-story-v28__label{
    font-size:clamp(11px,2.25cqw,15px);
  }

  .aq-personal-v26__inner{
    width:min(760px,calc(100% - 32px));
    grid-template-columns:1fr;
  }
  .aq-personal-v26__diagram{
    width:min(100%,620px);
    max-width:620px;
    margin:0 auto;
  }
  .aq-personal-v26__label{font-size:clamp(10px,1.95cqw,13px)}
}

@media(max-width:560px){
  .aq-story-v28__copy{padding:28px 16px 18px}
  .aq-story-v28__copy h1,
  .aq-story-v28__copy h2{font-size:33px;line-height:.96}
  .aq-story-v28__copy p{font-size:14px;line-height:1.4}
  .aq-story-v28__diagram{
    width:100%;
    max-width:none;
    margin:0 auto 12px;
  }
  .aq-story-v28__label{
    font-size:clamp(10px,2.55cqw,12px);
    line-height:1.16;
    box-shadow:0 0 0 .55cqw #f7f7f7;
  }
  .aq-story-v28__label--tl{left:8.5%;top:7.0%;width:20%}
  .aq-story-v28__label--bl{left:8.5%;top:60.5%;width:21%}
  .aq-story-v28__label--tr{left:76.2%;top:7%;width:20.5%}
  .aq-story-v28__label--br{left:76.2%;top:60.5%;width:21%}

  .aq-personal-v26__inner{width:calc(100% - 20px)}
  .aq-personal-v26__diagram{
    width:100%;
    max-width:485px; /* no desktop-style enlargement on phones */
  }
  .aq-personal-v26__label{
    font-size:clamp(9.5px,2.5cqw,11.5px);
    background:#e2e1db;
    box-shadow:0 0 0 .65cqw #e2e1db;
  }
}

@media(max-width:390px){
  .aq-story-v28__copy h1,
  .aq-story-v28__copy h2{font-size:30px}
  .aq-story-v28__label{font-size:9.5px}
  .aq-personal-v26__label{font-size:9px}
}

/* =========================================================
   Aqua One Production 2.9 — clean editable personalisation diagram
   ---------------------------------------------------------
   Product, connectors and live labels are separate layers inside one
   responsive canvas. Connector lines are vector SVG, so there are no
   raster erasing blocks/masks. Text stays editable in the Customizer.
   ========================================================= */
.aq-personal-v29{
  --aq-v29-bg:#e2e1db;
  background:var(--aq-v29-bg);
  padding:clamp(30px,3.2vw,52px) 0;
  overflow:hidden;
}
.aq-personal-v29__inner{
  width:min(1500px,calc(100% - 32px));
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(260px,29%) minmax(0,71%);
  gap:clamp(22px,2.6vw,44px);
  align-items:center;
}
.aq-personal-v29__intro{min-width:0;align-self:start;padding-top:clamp(4px,1vw,14px)}
.aq-personal-v29__intro h2{
  margin:0 0 clamp(22px,2.1vw,34px);
  font-family:var(--aq-ref-display);
  font-size:clamp(30px,2.55vw,42px);
  line-height:.96;
  font-weight:800;
  letter-spacing:-.03em;
  color:#101214;
}
.aq-personal-v29__intro h2 span{color:var(--aq-ref-teal)}
.aq-personal-v29__intro p{
  margin:0 0 clamp(18px,1.8vw,28px);
  max-width:360px;
  font-family:var(--aq-ref-ui);
  font-size:clamp(13px,1.05vw,16px);
  line-height:1.45;
  color:#151718;
}
.aq-personal-v29__diagram{
  container-type:inline-size;
  position:relative;
  width:min(100%,900px);
  aspect-ratio:1000/560;
  justify-self:center;
  isolation:isolate;
}
.aq-personal-v29__connectors{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:1;
  overflow:visible;
  pointer-events:none;
}
.aq-personal-v29__product{
  position:absolute;
  z-index:2;
  left:38.5%;
  top:4.0%;
  width:23%;
  height:auto;
  max-width:none;
  object-fit:contain;
  user-select:none;
  pointer-events:none;
  filter:none;
}
.aq-personal-v29__label{
  position:absolute;
  z-index:3;
  width:29%;
  padding:0;
  margin:0;
  background:transparent;
  box-shadow:none;
  font-family:var(--aq-ref-ui);
  line-height:1.18;
  color:#0c1013;
  overflow-wrap:break-word;
}
.aq-personal-v29__label b{
  display:block;
  margin:0 0 .45cqw;
  font-size:clamp(12px,1.80cqw,16px);
  line-height:1.12;
  font-weight:700;
}
.aq-personal-v29__label small{
  display:block;
  font-size:clamp(10px,1.35cqw,12.5px);
  line-height:1.28;
  font-weight:400;
}
.aq-personal-v29__label--1{left:0;top:3.2%;width:29%}
.aq-personal-v29__label--2{left:71%;top:3.2%;width:29%}
.aq-personal-v29__label--3{left:0;top:37.3%;width:29%}
.aq-personal-v29__label--4{left:71%;top:37.3%;width:29%}
.aq-personal-v29__label--5{left:0;top:70.0%;width:29%}
.aq-personal-v29__label--6{left:71%;top:70.0%;width:29%}

@media(max-width:900px){
  .aq-personal-v29{padding:30px 0 34px}
  .aq-personal-v29__inner{
    width:min(780px,calc(100% - 28px));
    grid-template-columns:1fr;
    gap:18px;
  }
  .aq-personal-v29__intro{padding:0}
  .aq-personal-v29__intro h2{font-size:clamp(31px,6vw,40px);margin-bottom:20px}
  .aq-personal-v29__intro p{max-width:650px;font-size:14px;margin-bottom:15px}
  .aq-personal-v29__diagram{width:min(100%,780px);margin:0 auto}
  .aq-personal-v29__label b{font-size:clamp(11.5px,1.9cqw,15px)}
  .aq-personal-v29__label small{font-size:clamp(9.8px,1.42cqw,12px)}
}

@media(max-width:560px){
  .aq-personal-v29{padding:28px 0 30px}
  .aq-personal-v29__inner{width:calc(100% - 18px);gap:14px}
  .aq-personal-v29__intro h2{font-size:31px;line-height:.98;margin-bottom:18px}
  .aq-personal-v29__intro p{font-size:13px;line-height:1.42;margin-bottom:13px}
  .aq-personal-v29__diagram{width:100%;max-width:520px}
  .aq-personal-v29__label b{font-size:12px;line-height:1.1;margin-bottom:3px}
  .aq-personal-v29__label small{font-size:10px;line-height:1.22}
  .aq-personal-v29__label--1,.aq-personal-v29__label--3,.aq-personal-v29__label--5{width:30%;left:0}
  .aq-personal-v29__label--2,.aq-personal-v29__label--4,.aq-personal-v29__label--6{width:30%;left:70%}
}

@media(max-width:390px){
  .aq-personal-v29__inner{width:calc(100% - 14px)}
  .aq-personal-v29__intro h2{font-size:28px}
  .aq-personal-v29__label b{font-size:11px}
  .aq-personal-v29__label small{font-size:9.5px}
}

/* Aqua One Production 3.0 — cleaner personalisation diagram */
.aq-personal-v29__diagram{overflow:visible}
.aq-personal-v29__connectors{z-index:3}
.aq-personal-v29__product{
  z-index:2;
  left:39.1%;
  top:4.7%;
  width:22.2%;
  image-rendering:auto;
}
.aq-personal-v29__label{
  z-index:4;
  width:31%;
}
.aq-personal-v29__label b{
  font-size:clamp(14px,2.05cqw,20px);
  line-height:1.12;
  margin-bottom:.50cqw;
}
.aq-personal-v29__label small{
  font-size:clamp(12px,1.58cqw,15px);
  line-height:1.26;
}
.aq-personal-v29__label--1{left:1.8%;top:3.4%;width:29%}
.aq-personal-v29__label--2{left:72.2%;top:3.4%;width:25.5%}
.aq-personal-v29__label--3{left:1.8%;top:38.2%;width:27.5%}
.aq-personal-v29__label--4{left:72.2%;top:38.2%;width:25.5%}
.aq-personal-v29__label--5{left:1.8%;top:71.5%;width:28.0%}
.aq-personal-v29__label--6{left:72.2%;top:71.5%;width:26.0%}
.aq-personal-v29__intro p{max-width:390px}

@media(max-width:900px){
  .aq-personal-v29__diagram{width:min(100%,820px)}
  .aq-personal-v29__product{left:39.0%;top:4.6%;width:22.4%}
  .aq-personal-v29__label b{font-size:clamp(13px,2.0cqw,18px)}
  .aq-personal-v29__label small{font-size:clamp(11px,1.52cqw,14px)}
}
@media(max-width:560px){
  .aq-personal-v29__diagram{max-width:560px}
  .aq-personal-v29__product{left:39.0%;top:5.0%;width:22.4%}
  .aq-personal-v29__label b{font-size:clamp(12px,2.15cqw,15px)}
  .aq-personal-v29__label small{font-size:clamp(10.5px,1.65cqw,12.5px)}
  .aq-personal-v29__label--1,.aq-personal-v29__label--3,.aq-personal-v29__label--5{left:2.4%;width:29%}
  .aq-personal-v29__label--2,.aq-personal-v29__label--4,.aq-personal-v29__label--6{left:71.4%;width:26.4%}
}

/* Aqua One Production 3.1 — fix line overlap + restore fuller product */
.aq-personal-v29__product{
  left:39.0%;
  top:4.1%;
  width:22.2%;
}
.aq-personal-v29__label{
  background:var(--aq-v29-bg);
  box-shadow:0 0 0 8px var(--aq-v29-bg);
}
.aq-personal-v29__label b{
  font-size:clamp(15px,2.15cqw,21px);
  line-height:1.10;
}
.aq-personal-v29__label small{
  font-size:clamp(12.5px,1.65cqw,16px);
  line-height:1.24;
}
.aq-personal-v29__label--1{left:1.6%;top:3.2%;width:28%}
.aq-personal-v29__label--2{left:71.8%;top:3.2%;width:25.5%}
.aq-personal-v29__label--3{left:1.6%;top:37.8%;width:27.0%}
.aq-personal-v29__label--4{left:71.8%;top:37.8%;width:25.5%}
.aq-personal-v29__label--5{left:1.6%;top:71.2%;width:28.0%}
.aq-personal-v29__label--6{left:71.8%;top:71.2%;width:26.0%}

@media(max-width:900px){
  .aq-personal-v29__product{left:39.0%;top:4.2%;width:22.4%}
  .aq-personal-v29__label b{font-size:clamp(14px,2.05cqw,18px)}
  .aq-personal-v29__label small{font-size:clamp(11.5px,1.58cqw,14px)}
}
@media(max-width:560px){
  .aq-personal-v29__label{box-shadow:0 0 0 5px var(--aq-v29-bg)}
  .aq-personal-v29__product{left:39.0%;top:4.4%;width:22.8%}
}

/* Aqua One Production 3.2 — fix product page callout backgrounds and cleaner personal product crop */
.aq-story-v28__label{
  background:transparent !important;
  box-shadow:none !important;
}

/* Personalisation diagram: use cleaner crop without bottom table reflection */
.aq-personal-v29__product{
  top:3.7%;
  width:22.2%;
}
.aq-personal-v29__label{
  box-shadow:0 0 0 10px var(--aq-v29-bg);
}
.aq-personal-v29__label b{font-size:clamp(16px,2.2cqw,22px)}
.aq-personal-v29__label small{font-size:clamp(13px,1.7cqw,16px)}
@media(max-width:900px){
  .aq-personal-v29__product{top:3.8%;width:22.4%}
  .aq-personal-v29__label{box-shadow:0 0 0 8px var(--aq-v29-bg)}
}
@media(max-width:560px){
  .aq-personal-v29__product{top:3.9%;width:22.8%}
  .aq-personal-v29__label{box-shadow:0 0 0 5px var(--aq-v29-bg)}
}

/* Aqua One Production 3.3 — larger navigation and product-page callout fix */
.aq-ref-nav .aqua-menu{gap:30px}
.aq-ref-nav .aqua-menu>li>a{
  font-size:13px;
  font-weight:500;
  letter-spacing:0;
}
.aq-ref-actions .lang{font-size:12px}
.aq-ref-cta{font-size:12px;min-width:138px;min-height:36px}

/* O produkcie: move top-right label away from the blue dot and keep labels legible */
.aq-story-v28__label{
  font-size:clamp(12px,2.05cqw,19px);
  line-height:1.16;
}
.aq-story-v28__label--tr{left:84.2%;top:7.8%;width:11.8%}
.aq-story-v28__label--br{left:83.8%;top:61.5%;width:12.8%}

@media(max-width:1100px){
  .aq-ref-nav .aqua-menu{gap:24px}
  .aq-ref-nav .aqua-menu>li>a{font-size:12px}
}
@media(max-width:560px){
  .aq-story-v28__label{font-size:clamp(10px,2.45cqw,12px)}
  .aq-story-v28__label--tr{left:78.0%;width:19.2%}
  .aq-story-v28__label--br{left:77.8%;width:19.8%}
}

/* Aqua One Production 3.4 — larger desktop menu only */
@media(min-width:861px){
  .aq-ref-nav .aqua-menu>li>a{
    font-size:15px;
    font-weight:500;
  }
}

/* Aqua One Production 3.5 — improve readability of top-right product label */
.aq-story-v28__label--tr{
  left:82.2%;
  top:6.8%;
  width:15.2%;
}
.aq-story-v28__label--tr br{display:none}
.aq-story-v28__label--tr{
  font-size:clamp(14px,2.2cqw,21px);
  line-height:1.12;
}
@media(max-width:900px){
  .aq-story-v28__label--tr{
    left:80.8%;
    width:17.5%;
    font-size:clamp(13px,2.1cqw,18px);
  }
}
@media(max-width:560px){
  .aq-story-v28__label--tr{
    left:76.8%;
    top:7.2%;
    width:21.5%;
    font-size:clamp(11px,2.7cqw,14px);
  }
}

/* Aqua One Production 3.6 — top-right product label readability */
.aq-story-v28__label--tr{
  left:84.4%;
  top:7.0%;
  width:12.6%;
  background:var(--aq-v29-bg);
  box-shadow:0 0 0 8px var(--aq-v29-bg);
  z-index:5;
}
.aq-story-v28__label--tr br{display:block}
@media(max-width:900px){
  .aq-story-v28__label--tr{
    left:83.0%;
    width:14.0%;
    box-shadow:0 0 0 6px var(--aq-v29-bg);
  }
}
@media(max-width:560px){
  .aq-story-v28__label--tr{
    left:78.8%;
    width:18.5%;
    box-shadow:0 0 0 4px var(--aq-v29-bg);
  }
}


/* Aqua One Production 3.7 — fix the top-right benefit marker.
   The old blue marker was baked into the raster and crossed the live HTML label.
   It is removed from the image and recreated as CSS to the right of the text. */
.aq-story-v28__label--tr{
  left:78.4%;
  top:6.8%;
  width:14.6%;
  background:transparent !important;
  box-shadow:none !important;
  z-index:5;
  padding-right:0;
  font-size:clamp(13px,2.05cqw,19px);
  line-height:1.14;
}
.aq-story-v28__label--tr::after{
  content:"";
  position:absolute;
  left:calc(100% + 1.15cqw);
  top:.3cqw;
  width:2.7cqw;
  height:2.7cqw;
  min-width:20px;
  min-height:20px;
  max-width:28px;
  max-height:28px;
  border:2px solid #4d9ad1;
  border-radius:50%;
  box-shadow:inset 0 0 0 3px #f6f6f6;
  background:#1d6fb5;
}
@media(max-width:900px){
  .aq-story-v28__label--tr{
    left:77.8%;
    width:15.0%;
    font-size:clamp(12px,2.15cqw,17px);
  }
  .aq-story-v28__label--tr::after{
    left:calc(100% + 1.0cqw);
  }
}
@media(max-width:560px){
  .aq-story-v28__label--tr{
    left:76.5%;
    width:17.5%;
    font-size:clamp(10.5px,2.65cqw,13px);
  }
  .aq-story-v28__label--tr::after{
    width:22px;
    height:22px;
    min-width:22px;
    min-height:22px;
  }
}

/* Aqua One Production 3.8 — align right-side labels and make both markers identical */
.aq-story-v28__label--tr,
.aq-story-v28__label--br{
  left:79.3% !important;
  width:14.2% !important;
  background:transparent !important;
  box-shadow:none !important;
  z-index:5;
}
.aq-story-v28__label--tr{top:7.0% !important;}
.aq-story-v28__label--br{top:61.4% !important;}
.aq-story-v28__label--tr::after,
.aq-story-v28__label--br::after{
  content:"";
  position:absolute;
  left:calc(100% + 1.05cqw);
  top:.35cqw;
  width:2.7cqw;
  height:2.7cqw;
  min-width:20px;
  min-height:20px;
  max-width:28px;
  max-height:28px;
  border:2px solid #4d9ad1;
  border-radius:50%;
  box-shadow:inset 0 0 0 3px #f6f6f6;
  background:#1d6fb5;
}
@media(max-width:900px){
  .aq-story-v28__label--tr,
  .aq-story-v28__label--br{
    left:78.8% !important;
    width:15.5% !important;
  }
  .aq-story-v28__label--tr::after,
  .aq-story-v28__label--br::after{left:calc(100% + 0.95cqw);}
}
@media(max-width:560px){
  .aq-story-v28__label--tr,
  .aq-story-v28__label--br{
    left:77.2% !important;
    width:18.8% !important;
  }
  .aq-story-v28__label--tr::after,
  .aq-story-v28__label--br::after{
    width:22px;height:22px;min-width:22px;min-height:22px;
  }
}

/* ================================================================
   Aqua One Production 4.2 — full client visualization structure
   ================================================================ */
:root{
  --aq42-teal:#20a7aa;
  --aq42-blue:#1186c3;
  --aq42-navy:#12284b;
  --aq42-soft:#f4f6f8;
  --aq42-text:#111318;
}
.aq42-section{padding:54px 0;background:#fff}
.aq42-soft{background:#f5f6f8}
.aq42-title{margin:0 0 22px;font-size:clamp(28px,3vw,42px);line-height:1.04;font-weight:900;letter-spacing:-.025em;color:#101216}
.aq42-title span{color:var(--aq42-teal)}
.aq42-center{text-align:center}
.aq42-lead{max-width:1050px;margin:-8px 0 28px;font-size:16px;line-height:1.45;color:#30343a}
.aq42-btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 17px;border-radius:6px;font-size:12px;font-weight:800;border:1px solid transparent;transition:.2s ease}
.aq42-btn:hover{transform:translateY(-1px);box-shadow:0 7px 18px rgba(16,53,82,.12)}
.aq42-btn--primary{background:#139ac4;color:#fff}
.aq42-btn--outline{background:rgba(255,255,255,.7);border-color:#1684bd;color:#116da0}
.aq42-buttons{display:flex;flex-wrap:wrap;gap:16px;margin-top:25px}

/* Generic visual hero matching the supplied Corel renders. */
.aq42-hero{position:relative;overflow:hidden;background:linear-gradient(90deg,#fff 0%,#fff 46%,#edf8ff 100%);border-bottom:1px solid #e6eaee}
.aq42-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;align-items:stretch;min-height:405px}
.aq42-hero-copy{align-self:center;padding:38px 0 36px;position:relative;z-index:2}
.aq42-hero-copy h1{font-size:clamp(40px,4.5vw,63px);line-height:.98;letter-spacing:-.035em;margin:0 0 23px;font-weight:900;color:#090b0e}
.aq42-hero-copy h1 span{color:var(--aq42-teal)}
.aq42-hero-copy p{font-size:clamp(16px,1.55vw,22px);line-height:1.28;max-width:610px;margin:0}
.aq42-hero-art{position:relative;min-height:100%;display:flex;align-items:stretch;justify-content:stretch}
.aq42-hero-art:before{content:"";position:absolute;inset:0 auto 0 -70px;width:130px;z-index:2;background:linear-gradient(90deg,#fff 12%,rgba(255,255,255,0))}
.aq42-hero-art img{width:100%;height:100%;object-fit:cover;object-position:center;min-height:405px}
.aq42-hero--water .aq42-hero-grid{min-height:430px}
.aq42-hero--water .aq42-hero-art img{min-height:430px}
.aq42-hero--water .aq42-hero-copy h1{font-size:clamp(38px,4.2vw,59px)}
.aq42-hero--packaging .aq42-hero-grid{min-height:300px}
.aq42-hero--packaging .aq42-hero-art img{min-height:300px}

/* Cards and feature grids */
.aq42-feature-grid{display:grid;gap:16px}
.aq42-feature-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.aq42-feature-grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.aq42-feature-grid--5{grid-template-columns:repeat(5,minmax(0,1fr))}
.aq42-feature-card{border:1px solid #d9e0e5;border-radius:14px;background:#fff;padding:24px 20px;text-align:center;box-shadow:0 8px 18px rgba(18,45,74,.06)}
.aq42-feature-card--plain{box-shadow:none;border:0;background:transparent;padding-inline:12px}
.aq42-feature-card--round .aq42-icon{border-radius:50%;width:92px;height:92px;background:#fff;box-shadow:0 5px 18px rgba(20,40,60,.12)}
.aq42-feature-card h3{font-size:18px;line-height:1.16;margin:12px 0 10px;font-weight:900}
.aq42-feature-card p{font-size:14px;line-height:1.44;margin:0;color:#343a40}
.aq42-icon{width:66px;height:66px;margin:0 auto 6px;display:grid;place-items:center;color:#0f84c5}
.aq42-icon svg{width:52px;height:52px;stroke:#0f84c5;fill:none;stroke-width:1.6}
.aq42-mini-grid{display:grid;gap:18px;margin-top:26px}
.aq42-mini-grid--5{grid-template-columns:repeat(5,minmax(0,1fr))}
.aq42-mini{text-align:center;padding:10px}
.aq42-mini b{display:block;font-size:15px;line-height:1.2}

/* Photo usage strips */
.aq42-photo-grid{display:grid;gap:14px}
.aq42-photo-grid--6{grid-template-columns:repeat(6,minmax(0,1fr))}
.aq42-photo-grid img{width:100%;aspect-ratio:1/1.1;object-fit:cover;border-radius:12px;box-shadow:0 4px 12px rgba(15,35,55,.12)}
.aq42-photo-grid strong{display:block;text-align:center;margin-top:9px;font-size:14px;line-height:1.15}

/* Process lines */
.aq42-process{display:grid;gap:0;margin-top:30px}
.aq42-process--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.aq42-process--5{grid-template-columns:repeat(5,minmax(0,1fr))}
.aq42-step{text-align:center;position:relative;padding:0 15px}
.aq42-step:not(:last-child):after{content:"";position:absolute;top:20px;left:62%;right:-38%;height:2px;background:#1b8ac7;z-index:0}
.aq42-step>span{position:relative;z-index:2;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;margin:0 auto 14px;border:3px solid #1386c5;background:#fff;color:#1278b1;font-size:18px;font-weight:900}
.aq42-step h3{font-size:16px;line-height:1.15;margin:9px 0 8px;font-weight:900}
.aq42-step p{font-size:13px;line-height:1.4;margin:0;color:#353b40}
.aq42-step .aq42-icon{height:50px;width:50px;margin-top:-2px}
.aq42-step .aq42-icon svg{width:39px;height:39px}

/* FAQ */
.aq42-faq{padding:44px 0;background:#f6f7f8}
.aq42-faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px 18px;max-width:1080px;margin:0 auto}
.aq42-faq-item{background:#fff;border:1px solid #aeb8c1;border-radius:5px;overflow:hidden}
.aq42-faq-item summary{list-style:none;cursor:pointer;min-height:48px;padding:11px 14px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:14px;font-weight:700}
.aq42-faq-item summary::-webkit-details-marker{display:none}
.aq42-faq-item summary span{font-size:23px;color:#0d86c6;line-height:1;transition:.2s transform}
.aq42-faq-item[open] summary span{transform:rotate(180deg)}
.aq42-faq-item p{margin:0;padding:0 14px 14px;font-size:13px;line-height:1.45;color:#48515a}

/* Compact contact zone from supplied visual */
.aq42-contact{background:linear-gradient(90deg,#fff 0%,#fff 51%,#e8f7ff 100%);overflow:hidden}
.aq42-contact-inner{display:grid;grid-template-columns:1.02fr .98fr;min-height:300px}
.aq42-contact-form-wrap{padding:25px 0 25px 34px;position:relative;z-index:2}
.aq42-contact-form-wrap h2{font-size:clamp(25px,2.55vw,37px);margin:0 0 12px;line-height:1.03;font-weight:900}
.aq42-contact-form-wrap h2 span{color:var(--aq42-teal)}
.aq42-contact-art{overflow:hidden;position:relative}
.aq42-contact-art:before{content:"";position:absolute;inset:0 auto 0 -45px;width:100px;background:linear-gradient(90deg,#fff,rgba(255,255,255,0));z-index:2}
.aq42-contact-art img{width:100%;height:100%;object-fit:cover;object-position:72% center}
.aq42-contact .aqua-form{padding:0;border:0;box-shadow:none;background:transparent;max-width:610px}
.aq42-contact .form-grid{grid-template-columns:1fr 1fr;gap:8px 10px}
.aq42-contact .aqua-form label{margin:0 0 7px;font-size:12px}
.aq42-contact .aqua-form input,.aq42-contact .aqua-form textarea{margin-top:4px;border:1px solid #89939d;border-radius:5px;padding:8px 10px;font-size:13px;min-height:36px}
.aq42-contact .aqua-form textarea{min-height:84px}
.aq42-contact .aqua-form .check{font-size:9px!important;max-width:450px;margin:4px 0 8px}
.aq42-contact .aqua-form button{min-width:210px;background:#148bc6;border-radius:4px}

/* CTA panel */
.aq42-campaign-cta{background:linear-gradient(90deg,#fff,#eefaff);overflow:hidden}
.aq42-campaign-cta-grid{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;min-height:250px}
.aq42-campaign-cta-grid>div{padding:42px 20px 38px 0;align-self:center}
.aq42-campaign-cta h2{font-size:clamp(28px,3vw,42px);margin:0 0 20px;font-weight:900;line-height:1.06}
.aq42-campaign-cta h2 span{color:var(--aq42-teal)}
.aq42-campaign-cta p{font-size:17px;line-height:1.45;max-width:580px}
.aq42-campaign-cta img{width:100%;height:100%;object-fit:cover}

/* Home water / packaging pair */
.aq42-home-duo{padding:0;background:#fff}
.aq42-home-duo-grid{display:grid;grid-template-columns:1fr 1fr;padding:0;width:min(100%,1180px)}
.aq42-duo-card{min-height:340px;padding:35px 32px;position:relative;overflow:hidden;background-size:cover;background-position:center}
.aq42-duo-card:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.9) 58%,rgba(255,255,255,.1) 100%)}
.aq42-duo-card>div{position:relative;z-index:2;max-width:360px}
.aq42-duo-card--water{background-image:url('../img/hero-water-v42.webp')}
.aq42-duo-card--pack{background-image:url('../img/hero-packaging-v42.webp')}
.aq42-duo-card h2{font-size:30px;margin:0 0 15px;font-weight:900}
.aq42-checks{list-style:none;padding:0;margin:0 0 20px}
.aq42-checks li{position:relative;padding-left:24px;margin:10px 0;font-size:14px;line-height:1.35}
.aq42-checks li:before{content:"✓";position:absolute;left:0;top:0;color:#12a8aa;font-weight:900}
.aq42-checks li small{display:block;margin-top:4px;color:#4e565d}
.aq42-personal-examples{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;align-items:end}
.aq42-personal-examples img{width:100%;height:270px;object-fit:contain;background:#fff}

/* Water and packaging details */
.aq42-two-col{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.aq42-media{width:100%;min-height:360px;object-fit:cover}
.aq42-water-params{padding:48px 0;background:linear-gradient(90deg,#effaff 0%,#fff 52%,#fff 100%)}
.aq42-water-wave{min-height:430px;background:url('../img/hero-home-ref-clean.webp') center/cover no-repeat;opacity:.8}
.aq42-table{border:1px solid #b7c6d2;margin:14px 0 5px;background:rgba(255,255,255,.85)}
.aq42-table>div{display:grid;grid-template-columns:1.3fr .8fr;border-bottom:1px solid #cbd4db}
.aq42-table>div:last-child{border-bottom:0}
.aq42-table span,.aq42-table b{padding:7px 12px;font-size:13px}
.aq42-table>div:first-child{background:#287fc1;color:#fff}
.aq42-quality .aq42-shield{width:180px;height:180px;border:12px solid #142d4d;border-radius:35% 35% 45% 45%;display:grid;place-items:center;margin:auto;color:#128cca;font-size:90px;font-weight:900}
.aq42-pack-spec{display:grid;grid-template-columns:1fr .6fr;gap:24px;align-items:center}
.aq42-pack-spec img{width:100%;max-height:310px;object-fit:contain}
.aq42-pack-spec ul{list-style:none;padding:18px;margin:0;background:#f4f6f8;border-radius:12px}
.aq42-pack-spec li{margin:11px 0;font-size:13px}
.aq42-pack-spec b{display:block;color:#66727c}
.aq42-pack-cane{background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.92) 48%,rgba(255,255,255,.38) 100%),url('../img/packaging-cane-v42.webp') right center/55% 100% no-repeat}
.aq42-pack-points{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:38px;text-align:center}
.aq42-pack-points b{font-size:17px}
.aq42-pack-points p{font-size:13px;line-height:1.42}
.aq42-pack-light{background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.92) 48%,rgba(255,255,255,.2) 100%),url('../img/packaging-light-v42.webp') right center/55% 100% no-repeat}

/* Footer aligned to client render */
.aq42-footer{background:#11284b;color:#fff;padding:26px 0 0}
.aq42-footer-grid{display:grid;grid-template-columns:1.45fr 1fr 1fr .9fr;gap:44px;padding-bottom:26px}
.aq42-footer-brand img{filter:brightness(0) invert(1);max-width:130px;margin-bottom:14px}
.aq42-footer-brand p{font-size:11px;letter-spacing:.08em;color:#d5deeb;margin:9px 0}
.aq42-footer h4{font-size:17px;margin:0 0 10px;color:#1dc0bd}
.aq42-footer a,.aq42-footer p{font-size:13px;color:#fff;margin:5px 0}
.aq42-socials{display:flex;gap:10px;margin-top:14px;padding-top:10px;border-top:1px solid rgba(28,189,187,.4)}
.aq42-socials span{width:28px;height:28px;border:2px solid #1bc0bd;border-radius:50%;display:grid;place-items:center;color:#1bc0bd;font-weight:800}
.aq42-footer-bottom{border-top:1px solid #19b8ba;display:flex;justify-content:space-between;gap:30px;padding:15px 0;font-size:11px;color:#d9e2ed}
.aq42-footer-bottom>div{display:flex;gap:0;align-items:center}
.aq42-footer-bottom a,.aq42-footer-bottom button{font:inherit;color:#fff;background:none;border:0;padding:0;cursor:pointer}
.aq42-footer-legal>*{padding:0 18px;white-space:nowrap}
.aq42-footer-legal>*:first-child{padding-left:0}
.aq42-footer-legal>*:last-child{padding-right:0}
.aq42-footer-legal>*+*{border-left:1px solid #19b8ba!important}

@media(max-width:1000px){
  .aq42-feature-grid--5{grid-template-columns:repeat(3,1fr)}
  .aq42-photo-grid--6{grid-template-columns:repeat(3,1fr)}
  .aq42-hero-copy h1{font-size:43px}
  .aq42-footer-grid{grid-template-columns:1.2fr 1fr 1fr}
  .aq42-footer-grid>div:last-child{grid-column:1/-1}
}
@media(max-width:760px){
  .aq42-section{padding:38px 0}
  .aq42-hero-grid{grid-template-columns:1fr;min-height:auto}
  .aq42-hero-copy{padding:34px 0 22px}
  .aq42-hero-copy h1,.aq42-hero--water .aq42-hero-copy h1{font-size:38px}
  .aq42-hero-copy p{font-size:16px}
  .aq42-hero-art{height:300px}
  .aq42-hero-art img,.aq42-hero--water .aq42-hero-art img,.aq42-hero--packaging .aq42-hero-art img{min-height:300px}
  .aq42-hero-art:before{inset:-50px 0 auto 0;width:100%;height:95px;background:linear-gradient(180deg,#fff 5%,rgba(255,255,255,0))}
  .aq42-feature-grid--4,.aq42-feature-grid--5,.aq42-mini-grid--5{grid-template-columns:repeat(2,1fr)}
  .aq42-process--4,.aq42-process--5{grid-template-columns:1fr 1fr;gap:26px 0}
  .aq42-step:not(:last-child):after{display:none}
  .aq42-faq-grid{grid-template-columns:1fr}
  .aq42-contact-inner{grid-template-columns:1fr}
  .aq42-contact-form-wrap{padding:28px 0}
  .aq42-contact-art{height:220px}
  .aq42-campaign-cta-grid{grid-template-columns:1fr}
  .aq42-campaign-cta-grid>div{padding-right:0}
  .aq42-campaign-cta img{max-height:260px}
  .aq42-home-duo-grid,.aq42-two-col{grid-template-columns:1fr}
  .aq42-personal-examples{grid-template-columns:repeat(2,1fr)}
  .aq42-pack-points{grid-template-columns:1fr}
  .aq42-footer-grid{grid-template-columns:1fr 1fr}
  .aq42-footer-grid>div:last-child{grid-column:auto}
  .aq42-footer-bottom{flex-direction:column}
}
@media(max-width:480px){
  .aq42-title{font-size:29px}
  .aq42-feature-grid--2,.aq42-feature-grid--4,.aq42-feature-grid--5,.aq42-mini-grid--5,.aq42-photo-grid--6{grid-template-columns:1fr}
  .aq42-process--4,.aq42-process--5{grid-template-columns:1fr}
  .aq42-contact .form-grid{grid-template-columns:1fr}
  .aq42-contact .aqua-form .form-wide{grid-column:auto}
  .aq42-personal-examples{grid-template-columns:1fr 1fr;gap:12px}
  .aq42-personal-examples img{height:190px}
  .aq42-pack-spec{grid-template-columns:1fr}
  .aq42-footer-grid{grid-template-columns:1fr}
  .aq42-footer-bottom>div{flex-wrap:wrap}
  .aq42-footer-legal>*{padding-left:12px;padding-right:12px}
  .aq42-footer-legal>*:first-child{padding-left:0}
}

/* --- Aqua One v4.4: cleaned Water page visuals and corrected contact form --- */
.aq42-hero--water-clean{
  background:url('../img/water-hero-clean-v44.webp') right center/cover no-repeat;
  min-height:325px;
}
.aq42-hero--water-clean:before{display:none}
.aq42-water-hero-inner{position:relative;z-index:2;min-height:325px;display:flex;align-items:center}
.aq42-water-hero-card{width:min(100%,600px);padding:24px 0 28px}
.aq42-hero--water-clean .aq42-hero-copy h1,
.aq42-hero--water-clean .aq42-hero-copy p{position:relative;z-index:2}
.aq42-hero--water-clean .aq42-hero-copy p{max-width:570px;margin-top:12px}

.aq42-water-params--visual{
  position:relative;
  background:url('../img/water-params-clean-v44.webp') left center/cover no-repeat;
  overflow:hidden;
}
.aq42-water-params--visual:before{display:none}
.aq42-water-params-wrap{position:relative;z-index:2;min-height:405px;display:flex;justify-content:flex-end;align-items:center}
.aq42-water-params-panel{width:min(100%,420px);background:#fff;padding:18px 16px 10px;border-radius:8px;box-shadow:0 10px 30px rgba(18,45,74,.08);margin:20px 0}
.aq42-water-params-panel .aq42-title{margin-top:0}
.aq42-water-params-panel p{margin-top:0}

.aq42-contact--visual{
  background:url('../img/contact-water-clean-v44.webp') right center/cover no-repeat;
  position:relative;
  overflow:hidden;
}
.aq42-contact--visual:before{display:none}
.aq42-contact-shell{position:relative;z-index:2;min-height:234px;display:flex;align-items:center}
.aq42-contact-overlay{width:min(100%,610px);padding:18px 0}
.aq42-contact-overlay h2{font-size:clamp(28px,2.7vw,40px);margin:0 0 12px;line-height:1.02;font-weight:900}
.aq42-contact-overlay h2 span{color:var(--aq42-teal)}
.aq42-contact--visual .aqua-form{padding:0;border:0;background:transparent;box-shadow:none;max-width:none}
.aq42-form-grid-visual{display:grid;grid-template-columns:1fr 1fr;grid-template-areas:'name type' 'company message' 'email message' 'phone message';gap:8px 8px;align-items:start}
.aq42-field{display:block;font-size:12px;font-weight:700;margin:0}
.aq42-field input,.aq42-field textarea,.aq42-field select{width:100%;margin-top:4px;border:1px solid #7f8891;border-radius:4px;padding:8px 10px;font:inherit;font-size:13px;background:#fff;min-height:36px}
.aq42-field textarea{min-height:100px;resize:vertical}
.aq42-field select{appearance:none;background-image:linear-gradient(45deg, transparent 50%, #148bc6 50%),linear-gradient(135deg, #148bc6 50%, transparent 50%);background-position:calc(100% - 18px) 16px,calc(100% - 11px) 16px;background-size:7px 7px,7px 7px;background-repeat:no-repeat;padding-right:34px}
.aq42-field--name{grid-area:name}
.aq42-field--type{grid-area:type}
.aq42-field--company{grid-area:company}
.aq42-field--email{grid-area:email}
.aq42-field--phone{grid-area:phone}
.aq42-field--message{grid-area:message}
.aq42-form-actions{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:end;margin-top:8px}
.aq42-form-required{font-size:10px;font-weight:700;margin-bottom:4px}
.aq42-form-consent .check{display:flex!important;gap:8px;align-items:flex-start;font-size:9px!important;line-height:1.35;margin:0;max-width:320px}
.aq42-form-consent .check input{width:auto;margin-top:2px}
.aq42-contact--visual .btn{background:#148bc6;border-radius:4px;min-width:205px;justify-content:center}

@media(max-width:1100px){
  .aq42-hero--water-clean{background-position:72% center}
  .aq42-water-hero-card{width:min(100%,560px)}
  .aq42-water-params-wrap{justify-content:flex-end}
  .aq42-water-params-panel{width:min(100%,400px)}
}

@media(max-width:860px){
  .aq42-hero--water-clean{background-position:78% center}
  .aq42-water-hero-card{width:min(100%,520px)}
  .aq42-contact-overlay{width:min(100%,560px)}
}

@media(max-width:760px){
  .aq42-hero--water-clean{background-position:82% center;min-height:auto}
  .aq42-water-hero-inner{min-height:auto;padding:24px 0 0}
  .aq42-water-hero-card{width:100%;padding:18px 0 24px}
  .aq42-water-params-wrap{min-height:auto;padding:22px 0;justify-content:stretch}
  .aq42-water-params-panel{width:100%;margin:0}
  .aq42-contact-shell{min-height:auto;padding:18px 0}
  .aq42-contact-overlay{width:100%}
  .aq42-form-grid-visual{grid-template-columns:1fr;grid-template-areas:'name' 'type' 'company' 'email' 'phone' 'message'}
  .aq42-form-actions{grid-template-columns:1fr}
  .aq42-form-consent .check{max-width:none}
  .aq42-contact--visual .btn{width:100%}
}


/* --- Aqua One v4.7: footer menu aligned to client visual --- */
.aq42-footer-menu{
  display:block;
  min-width:0;
}
.aq42-footer-menu h4{
  display:block;
  margin:0 0 12px;
  width:100%;
}
.aq42-footer-menu > a{
  display:block !important;
  width:100%;
  margin:0 0 6px !important;
  padding:0 !important;
  line-height:1.3;
  white-space:normal;
}
.aq42-footer-menu > a::first-letter{
  color:#1dc0bd;
}
.aq42-footer-contact > a{
  display:block !important;
  margin:4px 0 !important;
}
.aq42-footer-contact > p{
  margin:0 0 5px !important;
  line-height:1.4;
}

/* Aqua One v4.11 - final PDF structure */
.aq42-region-promo{background:linear-gradient(90deg,#f8fbfc 0%,#f8fbfc 58%,#e8f4f8 100%);overflow:hidden}
.aq42-region-promo__grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr);min-height:330px;padding:0}
.aq42-region-promo__content{padding:34px 28px 30px 0;align-self:center}
.aq42-region-promo__content h2{margin:0 0 22px;font-size:clamp(28px,3vw,42px);line-height:1.05;font-weight:900}
.aq42-region-promo__content h2 span{color:var(--aq42-teal)}
.aq42-region-promo__benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 22px;margin-bottom:24px}
.aq42-region-promo__benefits>div{display:flex;align-items:center;gap:10px;min-width:0}
.aq42-region-promo__benefits b{font-size:12px;line-height:1.25}
.aq42-region-promo__icon{width:42px;height:42px;display:grid;place-items:center;flex:0 0 42px;color:#1b8fbd}
.aq42-region-promo__icon svg{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.aq42-region-promo__actions{display:flex;gap:12px;flex-wrap:wrap}
.aq42-region-promo__visual{min-height:330px;background:radial-gradient(circle at 72% 38%,rgba(255,255,255,.9) 0 7%,transparent 8%),linear-gradient(145deg,#eef7fa 0%,#dbeaf0 55%,#bdd6e0 100%)}

@media(max-width:900px){
  .aq42-region-promo__grid{grid-template-columns:1fr}
  .aq42-region-promo__content{padding:30px 0 22px}
  .aq42-region-promo__visual{min-height:220px}
}
@media(max-width:620px){
  .aq42-region-promo__benefits{grid-template-columns:1fr 1fr;gap:14px}
  .aq42-region-promo__actions{display:grid;grid-template-columns:1fr}
  .aq42-region-promo__actions .aq42-btn{width:100%}
}


/* =========================================================
   Aqua One v4.13 — final PDF header + footer legal spacing
   ========================================================= */

/* The reference layout keeps the navigation group visually centered
   in the header, independently from the logo and CTA. */
@media (min-width:861px){
  .aq-ref-header-inner{
    position:relative;
  }
  .aq-ref-nav{
    position:absolute;
    left:50%;
    transform:translateX(-50%);
    margin:0 !important;
    white-space:nowrap;
  }
  .aq-ref-actions{
    margin-left:auto;
  }
}

/* Legal row: clear air on both sides of each turquoise divider,
   as in the supplied final footer visual. */
.aq42-footer-bottom{
  border-top:1px solid #19b8ba !important;
  align-items:center;
}
.aq42-footer-legal{
  display:flex !important;
  align-items:center;
  gap:0 !important;
}
.aq42-footer-legal > *{
  padding:0 !important;
  margin:0 !important;
  border-left:0 !important;
  white-space:nowrap;
  display:inline-flex;
  align-items:center;
}
.aq42-footer-legal > * + *{
  border-left:1px solid #19b8ba !important;
  padding-left:22px !important;
  margin-left:22px !important;
}

@media (max-width:900px) and (min-width:861px){
  .aq-ref-nav .aqua-menu{
    gap:20px;
  }
  .aq-ref-nav .aqua-menu > li > a{
    font-size:12px;
  }
  .aq42-footer-legal > * + *{
    padding-left:18px !important;
    margin-left:18px !important;
  }
}

@media (max-width:760px){
  .aq42-footer-legal{
    flex-wrap:wrap;
    row-gap:10px !important;
  }
  .aq42-footer-legal > * + *{
    padding-left:16px !important;
    margin-left:16px !important;
  }
}

@media (max-width:480px){
  .aq42-footer-legal{
    align-items:flex-start;
  }
  .aq42-footer-legal > * + *{
    padding-left:12px !important;
    margin-left:12px !important;
  }
}

/* =========================================================
   Aqua One v4.14 — main navigation spacing from final PDF
   ========================================================= */
/* At 861–900 px v4.13 compressed the menu to 20 px, which made
   the demo visibly tighter than the supplied reference. Keep the
   group centered, but preserve more air between menu items. */
@media (min-width:901px){
  .aq-ref-nav .aqua-menu{
    gap:34px !important;
  }
}
@media (max-width:900px) and (min-width:861px){
  .aq-ref-nav .aqua-menu{
    gap:30px !important;
  }
  .aq-ref-nav .aqua-menu > li > a{
    font-size:11px;
  }
}