@import url('https://fonts.googleapis.com/css2?family=Noto+Kufi+Arabic:wght@700&family=Raleway:wght@700&display=swap');
/* AQUA FLORA V4.3 typography baseline */
html[lang="ar"] body,html[dir="rtl"] body,html[lang="ar"] button,html[dir="rtl"] button,html[lang="ar"] input,html[dir="rtl"] input,html[lang="ar"] select,html[dir="rtl"] select,html[lang="ar"] textarea,html[dir="rtl"] textarea{font-family:'Noto Kufi Arabic',sans-serif!important;font-weight:700}
html[lang="en"] body,html[lang="fr"] body,html[lang="nl"] body,html[lang="en"] button,html[lang="fr"] button,html[lang="nl"] button,html[lang="en"] input,html[lang="fr"] input,html[lang="nl"] input,html[lang="en"] select,html[lang="fr"] select,html[lang="nl"] select,html[lang="en"] textarea,html[lang="fr"] textarea,html[lang="nl"] textarea{font-family:'Raleway',sans-serif!important;font-weight:700}

/* ==========================================================================
   Aqua Flora — azzaflora.com
   Design tokens
   ========================================================================== */
:root{
  --color-deep:      #0e3a5c;
  --color-aqua:      #1c7fb8;
  --color-aqua-light:#e7f3f8;
  --color-leaf:      #1f6f5c;
  --color-leaf-light:#e7f2ed;
  --color-cream:     #f7faf9;
  --color-ink:       #12283a;
  --color-ink-soft:  #4a5c68;
  --color-white:     #ffffff;
  --color-error:     #c0392b;

  --font-display: 'Outfit', 'Cairo', sans-serif;
  --font-body:    'Inter', 'Cairo', sans-serif;

  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 28px;

  --shadow-card: 0 12px 30px -14px rgba(14,58,92,0.25);
  --shadow-float: 0 10px 24px -6px rgba(14,58,92,0.35);

  --container-w: 1180px;
  --header-h: 76px;
}

html[lang="ar"] body, html[lang="ar"] * { font-family: var(--font-body); }
html[lang="ar"] h1, html[lang="ar"] h2, html[lang="ar"] h3,
html[lang="ar"] .brand-name, html[lang="ar"] .how-num {
  font-family: 'Cairo', sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; }
}

body{
  margin: 0;
  font-family: var(--font-body);
  color: var(--color-ink);
  background: var(--color-white);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3 { font-family: var(--font-display); color: var(--color-deep); margin: 0 0 .5em; line-height: 1.2; }
p { margin: 0 0 1em; color: var(--color-ink-soft); }
a { color: inherit; }
img { max-width: 100%; display: block; }
ul { list-style: none; margin: 0; padding: 0; }

.container{ max-width: var(--container-w); margin-inline: auto; padding-inline: 24px; }

.sr-only{
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0; padding: 0; margin: -1px;
}

.skip-link{
  position: absolute; inset-inline-start: 8px; top: -60px;
  background: var(--color-deep); color: #fff; padding: 10px 16px;
  border-radius: var(--radius-sm); z-index: 1000; transition: top .2s ease;
}
.skip-link:focus{ top: 8px; }

:focus-visible{ outline: 3px solid var(--color-aqua); outline-offset: 2px; }

.eyebrow{
  display: inline-block; font-family: var(--font-display); font-weight: 600;
  font-size: 13px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--color-leaf); margin-bottom: 10px;
}
.eyebrow.center{ display: block; text-align: center; }
.section-title{ font-size: clamp(26px, 3.2vw, 38px); }
.section-title.center{ text-align: center; max-width: 720px; margin-inline: auto 40px; }

/* ---------------- Buttons ---------------- */
.btn{
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 14px 28px; border-radius: 999px; font-weight: 600; font-size: 15px;
  text-decoration: none; border: 2px solid transparent; cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease, color .15s ease;
  font-family: var(--font-body);
}
.btn-primary{ background: linear-gradient(135deg, var(--color-aqua), var(--color-deep)); color: #fff; box-shadow: var(--shadow-float); }
.btn-primary:hover{ transform: translateY(-2px); }
.btn-ghost{ background: transparent; border-color: var(--color-deep); color: var(--color-deep); }
.btn-ghost:hover{ background: var(--color-aqua-light); }
.btn-small{ padding: 9px 18px; font-size: 13px; }
.btn-full{ width: 100%; }

/* ==========================================================================
   Header
   ========================================================================== */
.site-header{
  position: sticky; top: 0; z-index: 500;
  background: rgba(255,255,255,0.92); backdrop-filter: blur(8px);
  border-bottom: 1px solid rgba(14,58,92,0.08);
}
.header-inner{ display: flex; align-items: center; justify-content: space-between; height: var(--header-h); gap: 16px; }
.brand{ display: flex; align-items: center; gap: 10px; text-decoration: none; }
.brand-logo{ width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }
.brand-name{ font-family: var(--font-display); font-weight: 700; font-size: 19px; color: var(--color-deep); }

.main-nav ul{ display: flex; gap: 28px; }
.main-nav a{ text-decoration: none; font-weight: 500; font-size: 15px; color: var(--color-ink); position: relative; }
.main-nav a::after{
  content:""; position:absolute; inset-inline-start:0; bottom:-6px; width:0; height:2px;
  background: var(--color-leaf); transition: width .2s ease;
}
.main-nav a:hover::after{ width: 100%; }

.header-actions{ display: flex; align-items: center; gap: 14px; }
.af-account-entry{position:relative;display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:6px 11px;border:1px solid rgba(9,100,145,.24);border-radius:12px;background:#fff;color:var(--color-deep);text-decoration:none!important;box-shadow:0 7px 18px rgba(9,55,82,.08);white-space:nowrap;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.af-account-entry:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(9,55,82,.14);border-color:rgba(9,100,145,.48)}.af-account-entry.is-login{color:#fff;background:linear-gradient(135deg,#0b6998,#1185af);border-color:#0b6998;box-shadow:0 0 0 3px rgba(34,172,206,.12),0 8px 22px rgba(8,101,151,.25)}
.af-account-entry.is-login::after{content:"";position:absolute;inset:-3px;border:1px solid rgba(43,192,217,.38);border-radius:14px;pointer-events:none}.af-account-icon{font-size:8px;color:#80f3d1;text-shadow:0 0 8px #80f3d1}.af-account-avatar{display:grid;place-items:center;width:29px;height:29px;border-radius:9px;background:#dff3f6;color:#0a5d83;font-weight:900}
.af-account-copy{display:flex;flex-direction:column;line-height:1.15;text-align:start;max-width:155px}.af-account-copy strong{font-size:11px;overflow:hidden;text-overflow:ellipsis}.af-account-copy small{margin-top:3px;font-size:9px;opacity:.76;direction:ltr}.af-account-entry.is-login .af-account-copy small{opacity:.82}
@media(max-width:720px){.header-actions{gap:6px}.af-account-entry{min-height:40px;padding:5px 8px;gap:6px}.af-account-copy{max-width:96px}.af-account-avatar{width:26px;height:26px}.af-account-copy strong{font-size:10px}.af-account-copy small{font-size:8px}}
@media(max-width:390px){.af-account-entry{padding-inline:6px}.af-account-entry .af-account-icon,.af-account-entry .af-account-avatar{display:none}.af-account-copy{max-width:82px}.af-account-entry.is-login .af-account-copy small{display:none}}

/* Language switcher */
.lang-switcher{ position: relative; }
.lang-toggle{
  display: flex; align-items: center; gap: 6px; background: var(--color-aqua-light);
  border: 1px solid rgba(14,58,92,0.12); border-radius: 999px; padding: 8px 14px;
  font-size: 13px; font-weight: 600; color: var(--color-deep); cursor: pointer;
}
.lang-toggle-code{ font-weight: 800; }
.lang-menu{
  position: absolute; inset-inline-end: 0; top: calc(100% + 8px);
  background: #fff; border-radius: var(--radius-sm); box-shadow: var(--shadow-card);
  min-width: 160px; padding: 6px; display: none; z-index: 50;
}
.lang-menu.open{ display: block; }
.lang-menu button{
  width: 100%; text-align: start; background: none; border: none; padding: 10px 12px;
  border-radius: 6px; font-size: 14px; cursor: pointer; color: var(--color-ink);
}
.lang-menu button:hover, .lang-menu li[aria-selected="true"] button{ background: var(--color-aqua-light); color: var(--color-deep); font-weight: 600; }

.nav-toggle{ display: none; background: none; border: none; cursor: pointer; padding: 8px; }
.nav-toggle-bars{ display: flex; flex-direction: column; gap: 5px; width: 24px; }
.nav-toggle-bars i{ display: block; height: 2px; background: var(--color-deep); border-radius: 2px; }

/* ==========================================================================
   Hero
   ========================================================================== */
.hero{ position: relative; overflow: hidden; background: linear-gradient(180deg, var(--color-aqua-light) 0%, var(--color-white) 70%); padding-block: 72px 40px; }
.hero-ripple{
  position: absolute; inset-inline-end: -10%; top: -20%; width: 60%; aspect-ratio: 1;
  background: radial-gradient(circle, rgba(28,127,184,0.18) 0%, rgba(28,127,184,0) 70%);
  border-radius: 50%; pointer-events: none;
}
.hero-inner{ display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 48px; align-items: center; position: relative; }
.hero-copy h1{ font-size: clamp(32px, 4.2vw, 52px); }
.hero-sub{ font-size: 17px; max-width: 46ch; }
.hero-actions{ display: flex; gap: 14px; flex-wrap: wrap; margin-top: 24px; }
.hero-media{ position: relative; }
.hero-image{
  border-radius: var(--radius-lg); box-shadow: var(--shadow-card);
  width: 100%; height: auto; aspect-ratio: 5/6; object-fit: cover;
}

/* ==========================================================================
   Trust strip
   ========================================================================== */
.trust-strip{ background: var(--color-deep); padding-block: 22px; }
.trust-grid{ display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; }
.trust-item{ display: flex; align-items: center; gap: 10px; color: #fff; font-size: 14px; font-weight: 500; flex: 1 1 220px; }
.trust-icon{ font-size: 20px; }

/* ==========================================================================
   Why
   ========================================================================== */
.why{ padding-block: 88px; }
.why-grid{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }
.why-card{
  background: var(--color-cream); border-radius: var(--radius-md); padding: 28px 22px;
  border: 1px solid rgba(14,58,92,0.06); transition: transform .2s ease, box-shadow .2s ease;
}
.why-card:hover{ transform: translateY(-4px); box-shadow: var(--shadow-card); }
.why-icon{ font-size: 28px; margin-bottom: 14px; }
.why-card h3{ font-size: 18px; }
.why-card p{ font-size: 14.5px; margin: 0; }

/* ==========================================================================
   How it works
   ========================================================================== */
.how{ padding-block: 88px; background: var(--color-leaf-light); }
.how-steps{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; counter-reset: step; }
.how-step{ background: #fff; border-radius: var(--radius-md); padding: 26px 22px; box-shadow: var(--shadow-card); }
.how-num{ font-family: var(--font-display); font-weight: 800; font-size: 26px; color: var(--color-leaf); display: block; margin-bottom: 10px; }
.how-step h3{ font-size: 17px; }
.how-step p{ font-size: 14px; margin: 0; }

/* ==========================================================================
   Product
   ========================================================================== */
.product{ padding-block: 88px; }
.product-inner{ display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 56px; align-items: center; }
.product-media img{ border-radius: var(--radius-lg); box-shadow: var(--shadow-card); width: 100%; aspect-ratio: 4/5; object-fit: cover; }
.product-specs{ display: grid; gap: 10px; margin: 20px 0 28px; }
.product-specs li{
  position: relative; padding-inline-start: 26px; font-size: 15px; color: var(--color-ink);
}
.product-specs li::before{
  content: "✓"; position: absolute; inset-inline-start: 0; color: var(--color-leaf); font-weight: 700;
}

/* ==========================================================================
   Testimonials
   ========================================================================== */
.testimonials{ padding-block: 88px; background: var(--color-aqua-light); }
.testimonial-grid{ display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.testimonial-card{
  background: #fff; border-radius: var(--radius-md); padding: 26px; margin: 0;
  box-shadow: var(--shadow-card);
}
.testimonial-card p{ font-size: 15px; color: var(--color-ink); margin-bottom: 14px; }
.testimonial-card cite{ font-style: normal; font-weight: 700; color: var(--color-deep); }
.testimonial-note{ text-align: center; font-size: 12.5px; margin-top: 24px; opacity: .7; }

/* ==========================================================================
   FAQ
   ========================================================================== */
.faq{ padding-block: 88px; }
.faq-list{ max-width: 760px; margin-inline: auto; display: grid; gap: 12px; }
.faq-item{
  background: var(--color-cream); border-radius: var(--radius-sm); padding: 6px 20px;
  border: 1px solid rgba(14,58,92,0.06);
}
.faq-item summary{
  cursor: pointer; padding: 14px 0; font-weight: 600; font-size: 15.5px; color: var(--color-deep);
  list-style: none; display: flex; justify-content: space-between; align-items: center;
}
.faq-item summary::-webkit-details-marker{ display: none; }
.faq-item summary::after{ content: "+"; font-size: 20px; color: var(--color-leaf); }
.faq-item[open] summary::after{ content: "−"; }
.faq-item p{ padding-bottom: 16px; font-size: 14.5px; margin: 0; }

/* ==========================================================================
   Contact / Product request form
   ========================================================================== */
.contact{ padding-block: 88px; background: var(--color-deep); color: #fff; }
.contact-inner{ display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 56px; }
.contact-intro h2, .contact-intro p{ color: #fff; }
.contact-intro .eyebrow{ color: #8fd3c7; }
.whatsapp-link{
  display: inline-flex; align-items: center; gap: 10px; margin-top: 18px;
  background: rgba(255,255,255,0.1); padding: 12px 20px; border-radius: 999px;
  text-decoration: none; color: #fff; font-weight: 600; font-size: 14px;
}
.whatsapp-link:hover{ background: rgba(255,255,255,0.18); }

.quote-form{ background: #fff; border-radius: var(--radius-lg); padding: 32px; color: var(--color-ink); }
.form-row{ margin-bottom: 18px; display: flex; flex-direction: column; gap: 6px; }
.form-row label{ font-size: 13.5px; font-weight: 600; color: var(--color-deep); }
.form-row input[type="text"],
.form-row input[type="email"],
.form-row input[type="tel"],
.form-row textarea{
  border: 1.5px solid #d7e2e8; border-radius: var(--radius-sm); padding: 12px 14px;
  font-size: 14.5px; font-family: var(--font-body); color: var(--color-ink); background: #fff;
}
.form-row input:focus, .form-row textarea:focus{ border-color: var(--color-aqua); }
.form-row.invalid input, .form-row.invalid textarea{ border-color: var(--color-error); }
.field-error{ display: none; font-size: 12.5px; color: var(--color-error); }
.form-row.invalid .field-error{ display: block; }
.form-row-checkbox{ flex-direction: row; align-items: flex-start; gap: 10px; }
.form-row-checkbox label{ font-weight: 400; font-size: 13.5px; color: var(--color-ink-soft); }
.form-status{ font-size: 14px; font-weight: 600; margin: 0 0 6px; min-height: 20px; }
.form-status.success{ color: var(--color-leaf); }
.form-status.error{ color: var(--color-error); }

/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer{ background: #08243b; color: #cfe0ea; padding-top: 60px; }
.footer-inner{ display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 32px; padding-bottom: 40px; }
.footer-brand{ display: flex; flex-direction: column; gap: 12px; }
.footer-brand img{ border-radius: 50%; width: 40px; height: 40px; }
.footer-col h3{ color: #fff; font-size: 15px; margin-bottom: 14px; }
.footer-col ul{ display: grid; gap: 10px; }
.footer-col a{ text-decoration: none; color: #a9c1cf; font-size: 14px; }
.footer-col a:hover{ color: #fff; }
.footer-col li{ font-size: 14px; color: #a9c1cf; }
.footer-bottom{
  border-top: 1px solid rgba(255,255,255,0.1); padding: 18px 0; text-align: center; font-size: 13px; color: #7f97a6;
}

/* ==========================================================================
   WhatsApp float
   ========================================================================== */
.whatsapp-float{
  position: fixed; inset-inline-end: 22px; bottom: 22px; z-index: 400;
  width: 56px; height: 56px; border-radius: 50%; background: #fff;
  display: flex; align-items: center; justify-content: center; box-shadow: var(--shadow-float);
  transition: transform .2s ease;
}
.whatsapp-float:hover{ transform: scale(1.08); }

/* ==========================================================================
   Cookie banner
   ========================================================================== */
.cookie-banner{
  position: fixed; inset-inline: 0; bottom: 0; z-index: 600;
  background: #fff; border-top: 1px solid rgba(14,58,92,0.12); box-shadow: 0 -8px 24px rgba(14,58,92,0.1);
  padding: 18px 0; display: none;
}
.cookie-banner.visible{ display: block; }
.cookie-inner{
  max-width: var(--container-w); margin-inline: auto; padding-inline: 24px;
  display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap;
}
.cookie-inner p{ margin: 0; font-size: 13.5px; max-width: 60ch; color: var(--color-ink); }
.cookie-actions{ display: flex; gap: 10px; flex-wrap: wrap; }

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 980px){
  .why-grid, .how-steps{ grid-template-columns: repeat(2, 1fr); }
  .contact-inner{ grid-template-columns: 1fr; }
  .product-inner{ grid-template-columns: 1fr; }
  .product-media{ order: -1; }
  .testimonial-grid{ grid-template-columns: 1fr; }
}

@media (max-width: 860px){
  .main-nav{
    position: fixed; inset-inline: 0; top: var(--header-h); bottom: 0;
    background: #fff; padding: 24px; transform: translateY(-8px); opacity: 0;
    pointer-events: none; transition: transform .2s ease, opacity .2s ease; overflow-y: auto;
  }
  .main-nav.open{ transform: translateY(0); opacity: 1; pointer-events: auto; }
  .main-nav ul{ flex-direction: column; gap: 4px; }
  .main-nav a{ display: block; padding: 14px 4px; font-size: 17px; border-bottom: 1px solid #eef2f4; }
  .nav-toggle{ display: block; }
  .header-cta{ display: none; }
  .hero-inner{ grid-template-columns: 1fr; }
  .hero-media{ order: -1; }
  .why-grid, .how-steps{ grid-template-columns: 1fr; }
  .footer-inner{ grid-template-columns: 1fr 1fr; }
}

@media (max-width: 540px){
  .footer-inner{ grid-template-columns: 1fr; }
  .quote-form{ padding: 22px; }
  .hero{ padding-block: 48px 32px; }
}

/* ==========================================================================
   Responsive hardening — all devices
   ========================================================================== */
:root{
  --page-pad: clamp(16px, 3vw, 24px);
}

html{
  width: 100%;
  max-width: 100%;
  min-width: 320px;
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

@supports (overflow: clip){
  html{ overflow-x: clip; }
}

body{
  width: 100%;
  max-width: 100%;
  min-width: 320px;
  overflow-x: hidden;
  overscroll-behavior-x: none;
}

@supports (overflow: clip){
  body{ overflow-x: clip; }
}

body, header, main, footer, section, nav, form, dialog{
  max-width: 100%;
}

main, .site-header, .site-footer{
  width: 100%;
}

.container{
  width: 100%;
  max-width: var(--container-w);
  margin-inline: auto;
  padding-inline: var(--page-pad);
}

:where(.header-inner, .hero-inner, .trust-grid, .why-grid, .how-steps, .product-inner, .gallery-heading, .testimonial-grid, .contact-inner, .footer-inner) > *{
  min-width: 0;
}

h1, h2, h3, p, a, button, label, summary, li, blockquote{
  overflow-wrap: anywhere;
}

img, svg, video, canvas, iframe{
  max-inline-size: 100%;
}

input, textarea, select, button{
  max-width: 100%;
}

.btn{
  max-width: 100%;
  white-space: normal;
  text-align: center;
}

.hero-ripple{
  max-width: 100%;
}

.hero-image, .product-media img{
  width: 100%;
  max-width: 100%;
}

.main-nav{
  max-width: 100%;
}

.lang-menu{
  max-width: min(92vw, 240px);
}

.quote-form, .form-row, .form-row input, .form-row textarea{
  min-width: 0;
  width: 100%;
}

.whatsapp-float{
  inset-inline-end: max(20px, env(safe-area-inset-right));
  bottom: max(20px, env(safe-area-inset-bottom));
}

/* ==========================================================================
   Flexible language-specific image slider
   ========================================================================== */
.campaign-gallery{
  width: 100%;
  padding-block: clamp(56px, 7vw, 88px);
  background: var(--color-cream);
  overflow: hidden;
}

@supports (overflow: clip){
  .campaign-gallery{ overflow: clip; }
}

.gallery-heading{
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: clamp(14px, 3vw, 24px);
  margin-bottom: clamp(22px, 4vw, 32px);
}

.gallery-heading > div:first-child{
  min-width: 0;
}

.gallery-heading .section-title{
  margin-bottom: 0;
}

.gallery-controls{
  display: flex;
  flex: 0 0 auto;
  gap: 10px;
  direction: ltr;
}

.gallery-arrow{
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  width: clamp(42px, 4vw, 48px);
  height: clamp(42px, 4vw, 48px);
  padding: 0;
  border: 1px solid rgba(14,58,92,.16);
  border-radius: 50%;
  background: #fff;
  color: var(--color-deep);
  font-size: 30px;
  line-height: 1;
  cursor: pointer;
  box-shadow: var(--shadow-card);
  transition: transform .15s ease, opacity .15s ease, background .15s ease;
}

.gallery-arrow:hover:not(:disabled){
  transform: translateY(-2px);
  background: var(--color-aqua-light);
}

.gallery-arrow:disabled{
  opacity: .32;
  cursor: not-allowed;
}

.gallery-controls[hidden]{
  display: none !important;
}

.gallery-track{
  display: flex !important;
  flex-flow: row nowrap !important;
  align-items: stretch;
  gap: clamp(14px, 2vw, 22px);
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 6px 3px 18px;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  direction: ltr;
  list-style: none;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: 3px;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: rgba(14,58,92,.35) transparent;
  touch-action: pan-x pan-y;
  cursor: grab;
}

.gallery-track::-webkit-scrollbar{
  height: 8px;
}

.gallery-track::-webkit-scrollbar-track{
  background: transparent;
}

.gallery-track::-webkit-scrollbar-thumb{
  border-radius: 99px;
  background: rgba(14,58,92,.28);
}

.gallery-track.is-dragging{
  cursor: grabbing;
  user-select: none;
  scroll-snap-type: none;
}

.gallery-card{
  display: block;
  flex: 0 0 clamp(260px, 30vw, 380px) !important;
  width: clamp(260px, 30vw, 380px);
  max-width: calc(100vw - (2 * var(--page-pad)));
  min-width: 0;
  margin: 0;
  scroll-snap-align: start;
  scroll-snap-stop: always;
}

.gallery-card[hidden]{
  display: none !important;
}

.gallery-open{
  display: block;
  width: 100%;
  aspect-ratio: 4 / 5;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: var(--radius-md);
  background: #fff;
  box-shadow: var(--shadow-card);
  cursor: zoom-in;
}

.gallery-open img{
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  object-fit: contain;
  object-position: center;
  background: #fff;
  transition: transform .25s ease;
}

.gallery-open:hover img{
  transform: scale(1.012);
}

.gallery-lightbox{
  width: min(94vw, 1100px);
  max-width: 94vw;
  max-height: 94dvh;
  margin: auto;
  padding: clamp(12px, 2vw, 18px);
  overflow: hidden;
  border: 0;
  border-radius: var(--radius-md);
  background: #071a2a;
  box-shadow: 0 30px 80px rgba(0,0,0,.45);
}

.gallery-lightbox::backdrop{
  background: rgba(2,14,24,.84);
  backdrop-filter: blur(4px);
}

.gallery-lightbox img{
  display: block;
  width: 100%;
  height: calc(94dvh - 36px);
  max-height: calc(94dvh - 36px);
  object-fit: contain;
}

.gallery-lightbox-close{
  position: absolute;
  top: 12px;
  inset-inline-end: 12px;
  z-index: 2;
  width: 42px;
  height: 42px;
  padding: 0;
  border: 1px solid rgba(255,255,255,.28);
  border-radius: 50%;
  background: rgba(0,0,0,.6);
  color: #fff;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
}

body.lightbox-open{
  overflow: hidden;
}

/* ==========================================================================
   Adaptive layout breakpoints
   ========================================================================== */
@media (max-width: 1120px){
  .main-nav ul{ gap: 18px; }
  .main-nav a{ font-size: 14px; }
  .header-actions{ gap: 10px; }
}

@media (max-width: 980px){
  .gallery-card{
    flex-basis: clamp(270px, 43vw, 380px) !important;
    width: clamp(270px, 43vw, 380px);
  }
}

@media (max-width: 860px){
  .site-header, .header-inner{
    max-width: 100%;
  }

  .main-nav{
    inset-inline: 0;
    width: 100%;
    max-width: 100%;
  }

  .hero-inner{
    gap: clamp(26px, 6vw, 48px);
  }

  .hero-media{
    width: min(100%, 620px);
    margin-inline: auto;
  }

  .product-media{
    width: min(100%, 620px);
    margin-inline: auto;
  }
}

@media (max-width: 720px){
  :root{
    --header-h: 68px;
  }

  .container{
    padding-inline: clamp(14px, 4vw, 20px);
  }

  .header-inner{
    gap: 8px;
  }

  .brand-name{
    font-size: 17px;
  }

  .hero-copy h1{
    font-size: clamp(30px, 9vw, 42px);
  }

  .hero-sub{
    font-size: 16px;
  }

  .hero-actions{
    width: 100%;
  }

  .hero-actions .btn{
    flex: 1 1 210px;
  }

  .trust-grid{
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .trust-item{
    min-width: 0;
  }

  .gallery-heading{
    align-items: center;
  }

  .gallery-card{
    flex-basis: min(82vw, 420px) !important;
    width: min(82vw, 420px);
  }

  .gallery-controls{
    display: none;
  }

  .gallery-track{
    gap: 14px;
    padding-inline: 1px;
    scrollbar-width: none;
  }

  .gallery-track::-webkit-scrollbar{
    display: none;
  }

  .footer-inner{
    gap: 28px;
  }
}

@media (max-width: 540px){
  .brand-logo{
    width: 36px;
    height: 36px;
  }

  .lang-toggle{
    padding: 7px 10px;
  }

  .lang-toggle > span:not(.lang-toggle-code){
    display: none;
  }

  .hero{
    padding-block: 38px 28px;
  }

  .hero-actions{
    display: grid;
    grid-template-columns: 1fr;
  }

  .hero-actions .btn{
    width: 100%;
  }

  .trust-grid{
    grid-template-columns: 1fr;
  }

  .why, .how, .product, .testimonials, .faq, .contact{
    padding-block: clamp(54px, 14vw, 72px);
  }

  .why-card, .how-step, .testimonial-card{
    padding: 22px 18px;
  }

  .product-inner, .contact-inner{
    gap: 32px;
  }

  .quote-form{
    padding: 20px 16px;
    border-radius: 18px;
  }

  .gallery-heading{
    display: block;
  }

  .gallery-card{
    flex-basis: min(86vw, 400px) !important;
    width: min(86vw, 400px);
  }

  .gallery-open{
    border-radius: 14px;
  }

  .cookie-inner{
    padding-inline: 16px;
  }

  .cookie-actions{
    width: 100%;
  }

  .cookie-actions .btn{
    flex: 1 1 120px;
  }
}

@media (max-width: 390px){
  .brand-name{
    display: none;
  }

  .header-actions{
    gap: 6px;
  }

  .nav-toggle{
    padding: 6px;
  }

  .gallery-card{
    flex-basis: calc(100vw - 32px) !important;
    width: calc(100vw - 32px);
  }
}

@media (prefers-reduced-motion: reduce){
  .gallery-track{
    scroll-behavior: auto !important;
  }
}

/* ==========================================================================
   V4 — single-image responsive autoplay carousel + compact product image
   ========================================================================== */
.gallery-heading{
  align-items: center;
}

.gallery-controls{
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: clamp(7px, 2vw, 12px);
}

.gallery-status{
  min-width: 58px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.82);
  color: var(--color-deep);
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  box-shadow: 0 6px 18px rgba(14,58,92,.10);
}

.gallery-viewport{
  width: min(100%, 580px);
  max-width: 100%;
  margin-inline: auto;
  overflow: hidden;
  border-radius: var(--radius-md);
}

.gallery-track{
  width: 100% !important;
  max-width: 100% !important;
  margin-inline: auto !important;
  gap: 0 !important;
  padding: 0 !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
  scroll-snap-type: x mandatory !important;
  scroll-behavior: smooth;
}

.gallery-track::-webkit-scrollbar{
  display: none !important;
}

.gallery-track > .gallery-card{
  flex: 0 0 100% !important;
  flex-basis: 100% !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  scroll-snap-align: center !important;
}

.gallery-open{
  width: 100%;
  aspect-ratio: 4 / 5;
  border-radius: var(--radius-md);
}

.gallery-open img{
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
}

.product-media{
  display: grid;
  place-items: center;
  width: 100%;
  max-width: 100%;
}

.product-media img{
  width: min(100%, 470px) !important;
  height: auto !important;
  max-height: 470px !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: contain !important;
  object-position: center !important;
  margin-inline: auto;
  background: var(--color-cream);
}

@media (max-width: 720px){
  .gallery-heading{
    display: grid;
    grid-template-columns: 1fr;
    align-items: start;
    gap: 16px;
  }

  .gallery-controls{
    justify-self: center;
  }

  .gallery-arrow{
    width: 44px;
    height: 44px;
  }

  .gallery-viewport{
    width: min(100%, 520px);
  }

  .product-media img{
    width: min(100%, 420px) !important;
    max-height: 420px !important;
  }
}

@media (max-width: 390px){
  .gallery-viewport{
    width: 100%;
  }

  .gallery-arrow{
    width: 42px;
    height: 42px;
  }

  .product-media img{
    width: 100% !important;
    max-height: 360px !important;
  }
}


/* ==========================================================================
   Product showcase galleries and specification panels
   ========================================================================== */
.products-section{
  padding-block: clamp(62px, 7vw, 92px);
  background: linear-gradient(180deg, #ffffff 0%, var(--color-cream) 100%);
}

.products-container{ max-width: 1280px; }

.products-intro{
  max-width: 820px;
  margin: 0 auto clamp(30px, 4vw, 46px);
  text-align: center;
}

.products-lead{
  max-width: 740px;
  margin: 12px auto 0;
}

.products-list{
  display: grid;
  gap: clamp(26px, 4vw, 42px);
}

.product-showcase{
  display: grid;
  grid-template-columns: minmax(320px, .78fr) minmax(540px, 1.22fr);
  align-items: start;
  gap: clamp(24px, 4vw, 48px);
  padding: clamp(20px, 3vw, 34px);
  border: 1px solid rgba(14,58,92,.09);
  border-radius: clamp(22px, 3vw, 32px);
  background: rgba(255,255,255,.96);
  box-shadow: 0 20px 58px rgba(14,58,92,.09);
  direction: ltr;
}

.product-gallery{
  order: 1;
  min-width: 0;
  width: 100%;
  max-width: 480px;
  margin-inline: auto;
  direction: ltr;
}

.product-details{
  order: 2;
  min-width: 0;
  direction: ltr;
  text-align: left;
}

html[dir="rtl"] .product-gallery{ order: 2; }
html[dir="rtl"] .product-details{
  order: 1;
  direction: rtl;
  text-align: right;
}

.product-main-frame{
  position: relative;
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border: 1px solid rgba(14,58,92,.10);
  border-radius: clamp(18px, 3vw, 26px);
  background: #fff;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.9), 0 10px 30px rgba(14,58,92,.07);
  outline: none;
  touch-action: pan-y;
}

.product-main-frame:focus-visible{
  box-shadow: 0 0 0 4px rgba(28,157,183,.20), 0 10px 30px rgba(14,58,92,.07);
}

.product-main-image{
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  padding: clamp(6px, 1.5vw, 14px);
  object-fit: contain;
  object-position: center;
  user-select: none;
  -webkit-user-drag: none;
}

.product-gallery-arrow{
  position: absolute;
  top: 50%;
  z-index: 2;
  display: grid;
  place-items: center;
  width: clamp(40px, 4.5vw, 48px);
  height: clamp(40px, 4.5vw, 48px);
  padding: 0;
  border: 1px solid rgba(14,58,92,.13);
  border-radius: 50%;
  background: rgba(255,255,255,.94);
  color: var(--color-deep);
  font-size: 29px;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 8px 22px rgba(14,58,92,.13);
  transform: translateY(-50%);
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}

.product-gallery-arrow:hover{
  background: var(--color-aqua-light);
  box-shadow: 0 11px 28px rgba(14,58,92,.17);
}

.product-gallery-arrow:active{ transform: translateY(-50%) scale(.96); }
.product-gallery-prev{ left: clamp(9px, 1.8vw, 16px); }
.product-gallery-next{ right: clamp(9px, 1.8vw, 16px); }

.product-gallery-status{
  position: absolute;
  right: clamp(11px, 1.8vw, 16px);
  bottom: clamp(11px, 1.8vw, 16px);
  min-width: 56px;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(8,36,59,.82);
  color: #fff;
  font-size: 12.5px;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  direction: ltr;
  backdrop-filter: blur(8px);
}

.product-thumbnails{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(72px, 88px));
  justify-content: center;
  gap: 10px;
  margin-top: 12px;
  direction: ltr;
}

.product-thumbnail{
  position: relative;
  display: grid;
  place-items: center;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  padding: 4px;
  border: 2px solid transparent;
  border-radius: 13px;
  background: #fff;
  cursor: pointer;
  box-shadow: 0 5px 15px rgba(14,58,92,.08);
  transition: border-color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.product-thumbnail:hover{
  transform: translateY(-2px);
  box-shadow: 0 9px 22px rgba(14,58,92,.12);
}

.product-thumbnail.is-active{
  border-color: var(--color-aqua);
  box-shadow: 0 0 0 3px rgba(28,157,183,.13), 0 9px 22px rgba(14,58,92,.11);
}

.product-thumbnail img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

.product-model-label{
  margin: 0 0 6px;
  color: var(--color-leaf);
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.product-model{
  margin: 0 0 13px;
  color: var(--color-deep);
  font-family: var(--font-display);
  font-size: clamp(34px, 4vw, 50px);
  line-height: 1;
  letter-spacing: -.025em;
  direction: ltr;
  text-align: start;
}

html[dir="rtl"] .product-model{ text-align: right; }

.product-versions-label{
  margin: 0 0 15px;
  color: var(--color-ink-soft);
  font-size: 14.5px;
  font-weight: 700;
}

.product-configurations{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.product-configuration{
  min-width: 0;
  padding: 17px 16px;
  border: 1px solid rgba(14,58,92,.10);
  border-radius: 18px;
  background: var(--color-cream);
}

.product-configuration-accent{
  border-color: rgba(28,157,183,.22);
  background: linear-gradient(180deg, rgba(228,247,250,.92), rgba(255,255,255,.96));
}

.product-configuration h4{
  margin: 0 0 13px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(14,58,92,.10);
  color: var(--color-deep);
  font-size: clamp(18px, 2vw, 22px);
  line-height: 1.25;
}

.product-configuration-accent h4{ color: var(--color-aqua-dark, #117c91); }

.product-spec-list{
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.product-spec-list li{
  position: relative;
  padding-inline-start: 20px;
  color: var(--color-ink);
  font-size: 13.5px;
  line-height: 1.5;
}

.product-spec-list li::before{
  content: "•";
  position: absolute;
  inset-inline-start: 2px;
  top: 0;
  color: var(--color-leaf);
  font-size: 18px;
  font-weight: 900;
  line-height: 1.15;
}

.product-actions{
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 18px;
}

.product-actions .btn{ min-width: min(100%, 190px); }

/* Larger and clearer header logo */
.site-header .header-inner{ min-height: 86px; }
.brand-logo{
  width: 64px !important;
  height: 64px !important;
  padding: 3px;
  border-radius: 16px !important;
  background: #fff;
  object-fit: contain !important;
  box-shadow: 0 8px 22px rgba(14,58,92,.14);
}

@media (max-width: 1080px){
  .product-showcase{
    grid-template-columns: minmax(290px, .8fr) minmax(460px, 1.2fr);
    gap: 24px;
  }
  .product-configurations{ grid-template-columns: 1fr; }
}

@media (max-width: 820px){
  .product-showcase{ grid-template-columns: 1fr; }
  .product-gallery{
    order: 1 !important;
    max-width: 520px;
  }
  .product-details{
    order: 2 !important;
    max-width: 720px;
    margin-inline: auto;
    width: 100%;
  }
  .product-configurations{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px){
  .products-section{ padding-block: 54px; }
  .product-showcase{ padding: 15px; border-radius: 21px; }
  .product-main-frame{ border-radius: 17px; }
  .product-main-image{ padding: 5px; }
  .product-gallery-arrow{ width: 40px; height: 40px; font-size: 25px; }
  .product-thumbnails{ grid-template-columns: repeat(2, minmax(68px, 84px)); }
  .product-configurations{ grid-template-columns: 1fr; }
  .product-configuration{ padding: 15px 14px; }
  .product-actions{ display: grid; grid-template-columns: 1fr; }
  .product-actions .btn{ width: 100%; }
  .site-header .header-inner{ min-height: 72px; }
  .brand-logo{ width: 52px !important; height: 52px !important; border-radius: 13px !important; }
}


/* ==========================================================================
   V5 — adaptive single-image carousel, prominent section labels and ratings
   ========================================================================== */
.eyebrow{
  font-size: clamp(20px, 2.25vw, 30px) !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  margin-bottom: 14px !important;
}

.section-title{
  font-size: clamp(32px, 4.2vw, 52px) !important;
  line-height: 1.15 !important;
}

.section-title.center{
  max-width: 900px;
  margin-inline: auto !important;
  margin-bottom: clamp(28px, 4vw, 44px) !important;
}

.gallery-heading .section-title{
  margin-bottom: 0 !important;
}

.gallery-controls{
  flex-wrap: nowrap;
}

.gallery-pause{
  font-size: 18px;
}

.gallery-pause[aria-pressed="true"]{
  background: var(--color-deep);
  color: #fff;
}

.gallery-viewport{
  width: min(100%, 720px) !important;
  max-width: 100% !important;
  margin-inline: auto !important;
  overflow: hidden !important;
  border-radius: clamp(16px, 2vw, 24px) !important;
  background: transparent !important;
  box-shadow: 0 18px 46px rgba(14,58,92,.12);
  touch-action: pan-y;
}

.gallery-track{
  position: relative !important;
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  direction: ltr !important;
  list-style: none !important;
  scroll-snap-type: none !important;
  cursor: default !important;
}

.gallery-track > .gallery-card{
  display: none !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
}

.gallery-track > .gallery-card.is-active{
  display: block !important;
}

.gallery-track > .gallery-card.is-entering{
  animation: gallery-card-enter .38s cubic-bezier(.22,.61,.36,1) both;
}

@keyframes gallery-card-enter{
  from{ opacity: 0; transform: translateX(18px); }
  to{ opacity: 1; transform: translateX(0); }
}

html[dir="rtl"] .gallery-track > .gallery-card.is-entering{
  animation-name: gallery-card-enter-rtl;
}

@keyframes gallery-card-enter-rtl{
  from{ opacity: 0; transform: translateX(-18px); }
  to{ opacity: 1; transform: translateX(0); }
}

.gallery-open{
  display: block !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: inherit !important;
  background: transparent !important;
  box-shadow: none !important;
  line-height: 0;
}

.gallery-open img{
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  background: transparent !important;
}

.gallery-open:hover img{
  transform: none !important;
}

.gallery-viewport.is-paused{
  box-shadow: 0 18px 46px rgba(14,58,92,.18), 0 0 0 3px rgba(28,157,183,.14);
}

.testimonial-card{
  position: relative;
  overflow: hidden;
}

.testimonial-rating{
  display: flex;
  align-items: center;
  gap: 3px;
  width: max-content;
  margin-bottom: 16px;
  color: #f5b301;
  font-size: clamp(20px, 2vw, 24px);
  line-height: 1;
  direction: ltr;
}

.testimonial-rating .is-empty{
  color: #d3dce2;
}

.footer-brand{
  align-items: flex-start;
  gap: 10px !important;
}

html[dir="rtl"] .footer-brand{
  align-items: flex-end;
  text-align: right;
}

.footer-brand-logo{
  width: clamp(96px, 9vw, 132px) !important;
  height: auto !important;
  max-width: 100% !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  object-fit: contain !important;
  filter: drop-shadow(0 8px 18px rgba(0,0,0,.24));
}

.footer-brand-name{
  display: block;
  color: #fff;
  font-family: var(--font-display);
  font-size: clamp(22px, 2.3vw, 30px);
  font-weight: 800;
  letter-spacing: .12em;
  line-height: 1;
  direction: ltr;
}

.footer-brand p{
  margin: 4px 0 0;
  font-size: 15px;
}

@media (max-width: 720px){
  .eyebrow{
    font-size: clamp(19px, 6vw, 25px) !important;
  }

  .section-title{
    font-size: clamp(30px, 9vw, 42px) !important;
  }

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

  .gallery-controls{
    justify-self: center;
  }

  .gallery-viewport{
    width: 100% !important;
    border-radius: 16px !important;
  }

  .footer-brand,
  html[dir="rtl"] .footer-brand{
    align-items: center;
    text-align: center;
  }
}

@media (prefers-reduced-motion: reduce){
  .gallery-track > .gallery-card.is-entering{
    animation: none !important;
  }
}

/* ========================================================================== 
   Gallery V4 — cache-safe, one image only, intrinsic image ratio
   ========================================================================== */
#gallery .gallery-viewport{
  width: min(100%, 720px) !important;
  max-width: 100% !important;
  min-height: 0 !important;
  margin-inline: auto !important;
  overflow: hidden !important;
  border-radius: clamp(16px, 2vw, 24px) !important;
  background: transparent !important;
}

#gallery #gallery-track{
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  list-style: none !important;
}

#gallery #gallery-track > .gallery-card{
  display: none !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

#gallery #gallery-track > .gallery-card.is-active{
  display: block !important;
}

#gallery .gallery-open{
  display: block !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: inherit !important;
  background: transparent !important;
  box-shadow: none !important;
  line-height: 0 !important;
}

#gallery .gallery-open img{
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  background: transparent !important;
}

#gallery .gallery-load-error{
  max-width: 760px;
  margin: 20px auto 0;
  padding: 16px 18px;
  border: 1px solid rgba(190, 55, 55, .22);
  border-radius: 12px;
  background: rgba(255, 245, 245, .96);
  color: #8b1f1f;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.7;
  text-align: center;
}

#gallery .gallery-load-error[hidden]{
  display: none !important;
}


/* ========================================================================== 
   2026 conversion, product detail and mobile enhancements
   ========================================================================== */
:root{ --contact-dock-height: 66px; }

.site-header .header-inner{ min-height: 92px; }
.brand{ gap: 14px; }
.brand-logo{
  width: 72px;
  height: 72px;
  border-radius: 18px;
  object-fit: contain;
  background: #fff;
  box-shadow: 0 8px 22px rgba(12, 55, 70, .13);
}
.brand-name{ font-size: clamp(18px, 1.8vw, 23px); letter-spacing: .04em; }

.btn-soft{
  background: #eef9f7;
  color: var(--color-deep);
  border: 1px solid rgba(16, 130, 118, .22);
}
.btn-soft:hover{ background: #dff3ef; transform: translateY(-1px); }

.product-main-frame{ cursor: zoom-in; }
.product-main-image:focus-visible{ outline: 3px solid var(--color-leaf); outline-offset: -4px; }
.product-zoom-button{
  position: absolute;
  inset-block-start: clamp(10px, 2vw, 16px);
  inset-inline-end: clamp(10px, 2vw, 16px);
  z-index: 4;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(10, 54, 67, .12);
  border-radius: 999px;
  background: rgba(255,255,255,.94);
  color: var(--color-deep);
  box-shadow: 0 8px 20px rgba(10,54,67,.14);
  font-size: 25px;
  line-height: 1;
  cursor: pointer;
}
.product-zoom-button:hover{ transform: scale(1.06); }
.product-model a{ color: inherit; text-decoration: none; }
.product-model a:hover{ color: var(--color-leaf); }
.product-model a::after{ content: " ↗"; font-size: .48em; vertical-align: super; opacity: .65; }
.product-trust-badges{ display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 22px; }
.product-trust-badges span{
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 6px 11px;
  border-radius: 999px;
  background: #eef9f7;
  color: #155f62;
  border: 1px solid rgba(20, 125, 115, .16);
  font-size: 12px;
  font-weight: 700;
}
.product-trust-badges span::before{ content: "✓"; margin-inline-end: 6px; }
.product-actions{ align-items: stretch; }
.product-actions .btn{ min-width: 0; flex: 1 1 150px; }

.product-zoom-dialog{
  width: min(94vw, 1080px);
  max-height: 94vh;
  padding: 20px;
  border: 0;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 28px 80px rgba(3, 28, 36, .35);
  overflow: auto;
}
.product-zoom-dialog::backdrop{ background: rgba(3, 25, 32, .76); backdrop-filter: blur(4px); }
.product-zoom-dialog img{ width: 100%; max-height: 86vh; object-fit: contain; border-radius: 16px; }
.product-zoom-close{
  position: sticky;
  inset-block-start: 0;
  float: inline-end;
  z-index: 3;
  width: 44px;
  height: 44px;
  margin-block-end: -44px;
  border: 0;
  border-radius: 999px;
  background: var(--color-deep);
  color: #fff;
  font-size: 28px;
  cursor: pointer;
}

.confidence{ padding-block: 88px; background: linear-gradient(180deg,#f8fcfb 0%,#eef8f6 100%); }
.confidence-grid{ display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 18px; margin-top: 38px; }
.confidence-card{
  min-height: 230px;
  padding: 28px 24px;
  border: 1px solid rgba(13, 83, 87, .1);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 12px 34px rgba(11, 61, 72, .07);
}
.confidence-icon{
  display: grid;
  place-items: center;
  width: 50px;
  height: 50px;
  margin-bottom: 20px;
  border-radius: 15px;
  background: var(--color-deep);
  color: #fff;
  font-size: 22px;
  font-weight: 800;
}
.confidence-card h3{ color: var(--color-deep); margin: 0 0 10px; font-size: 19px; }
.confidence-card p{ margin: 0; font-size: 14.5px; line-height: 1.85; }

.quote-form select{
  width: 100%;
  min-height: 50px;
  padding: 12px 14px;
  border: 1px solid rgba(15, 74, 85, .2);
  border-radius: 12px;
  background: #fff;
  color: var(--color-ink);
  font: inherit;
}
.quote-form select:focus{ outline: 3px solid rgba(28, 162, 145, .18); border-color: var(--color-leaf); }
.form-row.invalid select{ border-color: #b42318; }

.contact-dock{
  position: fixed;
  z-index: 90;
  inset-inline-end: 18px;
  inset-block-end: 18px;
  display: grid;
  gap: 8px;
  width: min(260px, calc(100vw - 36px));
}
.contact-dock-item{
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 10px 15px;
  border-radius: 14px;
  color: #fff;
  text-decoration: none;
  font-weight: 700;
  font-size: 14px;
  box-shadow: 0 12px 30px rgba(5, 39, 48, .2);
  transition: transform .2s ease, box-shadow .2s ease;
}
.contact-dock-item:hover{ transform: translateY(-2px); box-shadow: 0 16px 34px rgba(5,39,48,.25); }
.contact-dock-item > span:first-child{ display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:rgba(255,255,255,.16); }
.contact-dock-whatsapp{ background: #159b5b; }
.contact-dock-quote{ background: var(--color-leaf); }

.site-footer a{ color: inherit; }
.faq-item summary{ min-height: 56px; display:flex; align-items:center; justify-content:space-between; gap:16px; }

@media (max-width: 1080px){
  .confidence-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (max-width: 820px){
  .site-header .header-inner{ min-height: 76px; }
  .brand-logo{ width: 56px; height: 56px; border-radius: 14px; }
  .brand-name{ font-size: 17px; }
  .product-actions .btn{ flex-basis: 100%; min-height: 50px; }
}

@media (max-width: 720px){
  body{ padding-bottom: calc(var(--contact-dock-height) + env(safe-area-inset-bottom)); }
  .confidence{ padding-block: 64px; }
  .confidence-grid{ grid-template-columns: 1fr; gap: 12px; margin-top: 26px; }
  .confidence-card{ min-height: 0; padding: 22px 20px; }
  .contact-dock{
    inset-inline: 0;
    inset-block-end: 0;
    width: 100%;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    padding-bottom: env(safe-area-inset-bottom);
    background: #fff;
    border-top: 1px solid rgba(10,55,65,.12);
    box-shadow: 0 -8px 28px rgba(5,39,48,.13);
  }
  .contact-dock-item{
    min-height: var(--contact-dock-height);
    padding: 8px 5px;
    border-radius: 0;
    flex-direction: column;
    justify-content: center;
    gap: 3px;
    box-shadow: none;
    font-size: 11px;
    text-align: center;
  }
  .contact-dock-item:hover{ transform:none; box-shadow:none; }
  .contact-dock-item > span:first-child{ width:25px; height:25px; font-size:14px; }
  .product-main-frame{ min-height: 330px; }
  .product-thumbnail{ width: 78px; height: 78px; }
  .product-gallery-arrow{ width: 46px; height: 46px; }
  .product-zoom-dialog{ width: 96vw; padding: 10px; border-radius: 16px; }
}

@media (max-width: 390px){
  .brand-name{ display:none; }
  .brand-logo{ width: 52px; height:52px; }
  .contact-dock-item{ font-size: 10px; }
}


/* ==========================================================================
   Owner-final refinements - conversion, trust, responsive design
   ========================================================================== */
:root{
  --font-display: "Segoe UI", Tahoma, Arial, sans-serif;
  --font-body: "Segoe UI", Tahoma, Arial, sans-serif;
  --header-h: 84px;
}
html[lang="ar"] body,html[lang="ar"] *,html[lang="ar"] h1,html[lang="ar"] h2,html[lang="ar"] h3,html[lang="ar"] .brand-name,html[lang="ar"] .how-num{font-family:"Segoe UI",Tahoma,Arial,sans-serif}
section[id]{scroll-margin-top:112px}
.announcement-bar{background:#082f49;color:#fff;font-size:13px}
.announcement-inner{min-height:34px;display:flex;align-items:center;justify-content:center;gap:24px;text-align:center}
.announcement-inner span{color:#fff}.announcement-inner a{color:#bff4df;font-weight:800;text-decoration:none;white-space:nowrap}
.site-header{top:0}.brand{gap:12px}.brand-logo{width:54px;height:54px;border-radius:0;object-fit:contain}.brand-name{font-size:21px;letter-spacing:.05em}.header-inner{height:var(--header-h)}
.hero{padding-block:72px 64px;background:linear-gradient(145deg,#eaf6fb 0%,#f8fcfb 55%,#e9f5f0 100%)}
.hero-inner{grid-template-columns:minmax(0,.88fr) minmax(500px,1.12fr);gap:58px}.hero-copy h1{font-size:clamp(38px,4.5vw,62px);max-width:14ch}.hero-sub{font-size:18px;line-height:1.85;max-width:55ch}
.hero-product-stage{position:relative;min-height:590px;border-radius:34px;background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(233,247,243,.9));border:1px solid rgba(14,58,92,.08);box-shadow:0 30px 75px rgba(9,53,75,.16);overflow:hidden;padding:28px}
.hero-product-stage::before{content:"";position:absolute;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle,rgba(28,127,184,.19),transparent 70%);inset-inline-end:-70px;top:-90px}
.hero-product-card{position:absolute;background:#fff;border:1px solid rgba(14,58,92,.08);border-radius:25px;box-shadow:0 18px 42px rgba(8,54,75,.13);overflow:hidden}
.hero-product-card img{width:100%;height:100%;object-fit:contain}.hero-product-card>span{position:absolute;z-index:2;top:14px;inset-inline-start:14px;background:#0e3a5c;color:#fff;border-radius:999px;padding:7px 12px;font-size:12px;font-weight:800}
.hero-product-krs{width:54%;height:55%;inset-inline-start:7%;top:8%;transform:rotate(-2deg)}.hero-product-lite{width:43%;height:55%;inset-inline-end:7%;top:16%;transform:rotate(3deg)}
.hero-visual-copy{position:absolute;inset-inline:7%;bottom:7%;padding:22px 24px;border-radius:22px;background:rgba(8,47,73,.95);color:#fff;backdrop-filter:blur(8px)}.hero-visual-copy small{display:block;color:#9ee5d2;font-weight:800;margin-bottom:4px}.hero-visual-copy strong{display:block;font-size:20px;line-height:1.5}.hero-visual-copy p{color:rgba(255,255,255,.78);margin:7px 0 0;font-size:14px}
.trust-strip{padding-block:18px}.trust-item{justify-content:center;text-align:center}
.products-section{padding-block:96px}.products-lead{max-width:780px}.product-showcase{align-items:stretch}.product-details{display:flex;flex-direction:column}.product-card-summary{font-size:16px;line-height:1.8;margin:4px 0 18px}.product-key-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:20px 0}.product-key-facts div{padding:14px;border-radius:15px;background:#f5faf9;border:1px solid rgba(14,58,92,.08)}.product-key-facts dt{font-size:12px;color:#61727c}.product-key-facts dd{margin:4px 0 0;font-weight:800;color:var(--color-deep);font-size:14px}.product-spec-note{font-size:12px;line-height:1.65;padding:10px 12px;border-inline-start:3px solid var(--color-aqua);background:#f6fafc;border-radius:8px}.product-actions{margin-top:auto;padding-top:14px}
.comparison{padding-block:96px;background:linear-gradient(180deg,#f7fbfa,#eaf5f2)}.comparison-intro{max-width:780px;text-align:center;margin:-20px auto 34px;font-size:16px}.comparison-wrap{overflow-x:auto;border-radius:24px;box-shadow:0 18px 45px rgba(8,53,65,.09);background:#fff}.comparison-table{width:100%;border-collapse:collapse;min-width:720px}.comparison-table th,.comparison-table td{padding:19px 22px;border-bottom:1px solid rgba(14,58,92,.09);text-align:start}.comparison-table thead th{background:#0e3a5c;color:#fff;font-size:15px}.comparison-table thead th:not(:first-child){text-align:center}.comparison-table tbody th{color:#0e3a5c;background:#f8fbfb;width:28%}.comparison-table tbody td{text-align:center}.comparison-table tbody tr:last-child>*{border-bottom:0}.comparison-help{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:26px;padding:24px 28px;border-radius:22px;background:#fff;border:1px solid rgba(14,58,92,.08)}.comparison-help p{margin:0;font-weight:600;color:#274c5c}
.order-process{padding-block:96px;background:#fff}.process-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;counter-reset:steps}.process-grid li{position:relative;padding:26px 22px;border-radius:22px;background:#f7faf9;border:1px solid rgba(14,58,92,.08);box-shadow:0 12px 30px rgba(8,53,65,.05)}.process-grid li>span{display:grid;place-items:center;width:46px;height:46px;border-radius:15px;background:#0e3a5c;color:#fff;font-weight:900;margin-bottom:18px}.process-grid h3{font-size:18px}.process-grid p{font-size:14px;margin:0}
.form-helper{font-size:12px;line-height:1.6;margin:0 0 12px;padding:10px 12px;background:#edf7f4;border-radius:10px}.form-row-checkbox label a{color:#0e6682;font-weight:800}.form-row-checkbox label{line-height:1.65}
.footer-brand-logo{width:74px;height:86px;object-fit:contain}.site-footer a:hover{text-decoration:underline}.product-zoom-dialog img{background:#fff}
@media(max-width:1100px){.hero-inner{grid-template-columns:1fr 1fr}.hero-product-stage{min-height:520px}.process-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.announcement-inner{min-height:38px}.hero-inner{grid-template-columns:1fr}.hero-copy{text-align:center}.hero-copy h1,.hero-sub{margin-inline:auto}.hero-actions{justify-content:center}.hero-product-stage{max-width:680px;width:100%;margin-inline:auto}.comparison-help{flex-direction:column;text-align:center}.comparison-help .btn{width:100%}}
@media(max-width:720px){:root{--header-h:72px}.announcement-inner{font-size:11px;gap:10px;justify-content:space-between}.announcement-inner span{max-width:75%;text-align:start}.brand-logo{width:46px;height:46px}.brand-name{font-size:16px}.hero{padding-block:44px 48px}.hero-copy h1{font-size:36px}.hero-sub{font-size:16px}.hero-actions .btn{width:100%}.hero-product-stage{min-height:445px;border-radius:24px;padding:16px}.hero-product-krs{width:58%;height:52%;inset-inline-start:3%;top:5%}.hero-product-lite{width:47%;height:52%;inset-inline-end:3%;top:12%}.hero-visual-copy{inset-inline:4%;bottom:4%;padding:16px}.hero-visual-copy strong{font-size:16px}.hero-visual-copy p{font-size:12px}.product-key-facts{grid-template-columns:1fr 1fr}.comparison,.order-process,.products-section{padding-block:68px}.comparison-wrap{border-radius:16px}.comparison-help{padding:20px}.process-grid{grid-template-columns:1fr}.process-grid li{display:grid;grid-template-columns:52px 1fr;column-gap:14px}.process-grid li>span{grid-row:1/3;margin:0}.process-grid h3{margin:4px 0 7px}.product-actions .btn{width:100%}}
@media(max-width:390px){.brand-name{display:none}.hero-copy h1{font-size:32px}.hero-product-stage{min-height:410px}.product-key-facts{grid-template-columns:1fr}.announcement-inner a{font-size:10px}}


/* Product-image contrast refinement */
.product-main-frame,.detail-main-image-wrap,.other-product-image{background:linear-gradient(145deg,#ffffff 0%,#edf6f5 100%)}
.product-main-image,.detail-main-image,.other-product-image img{filter:drop-shadow(0 18px 24px rgba(4,45,58,.12))}
.product-main-frame::after,.detail-main-image-wrap::after{content:"AQUA FLORA";position:absolute;inset-inline-end:14px;inset-block-end:14px;z-index:3;padding:6px 10px;border-radius:999px;background:rgba(8,47,73,.88);color:#fff;font-size:10px;font-weight:900;letter-spacing:.08em;pointer-events:none}
@media(max-width:720px){.product-main-frame::after,.detail-main-image-wrap::after{font-size:9px;padding:5px 8px;inset-inline-end:10px;inset-block-end:10px}}


/* ==========================================================================\n   Mobile navigation, fixed contact dock, five-stage presentation and official logo\n   ========================================================================== */
.site-header,
.detail-header,
.legal-header{ isolation:isolate; }

/* The supplied official artwork includes the AQUA FLORA name and WATER PURIFICATION line. */
.brand-logo{
  display:block !important;
  inline-size:176px !important;
  block-size:72px !important;
  max-inline-size:176px !important;
  border-radius:0 !important;
  object-fit:contain !important;
  object-position:center !important;
  background:#fff;
}
.brand-name{display:none !important;}
.footer-brand{align-items:flex-start;}
.footer-brand-logo{
  inline-size:150px !important;
  block-size:150px !important;
  max-inline-size:150px !important;
  padding:12px;
  border-radius:50% !important;
  object-fit:contain !important;
  background:#fff;
  border:1px solid rgba(255,255,255,.22);
  box-shadow:0 16px 38px rgba(0,0,0,.18);
}
.detail-footer-logo{
  inline-size:106px;
  block-size:106px;
  flex:0 0 106px;
  padding:8px;
  border-radius:50%;
  object-fit:contain;
  background:#fff;
  box-shadow:0 10px 28px rgba(0,0,0,.2);
}

/* Five real filtration components listed for both models. */
.how-steps{grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;}
.how-step{
  position:relative;
  min-height:280px;
  padding:24px 20px;
  border:1px solid rgba(14,58,92,.08);
  border-top:4px solid var(--color-leaf);
  box-shadow:0 14px 34px rgba(8,53,65,.075);
}
.how-num{
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  border-radius:15px;
  color:#fff;
  background:linear-gradient(135deg,var(--color-aqua),var(--color-deep));
  font-size:17px;
}
.how-step h3{font-size:16px;line-height:1.55;margin:14px 0 9px;}
.how-step p{line-height:1.8;color:#526873;}

/* Arabic desktop actions belong on the right; Latin languages on the left. */
@media (min-width:721px){
  html[dir="rtl"] .contact-dock{right:18px !important;left:auto !important;inset-inline:auto !important;}
  html[dir="ltr"] .contact-dock{left:18px !important;right:auto !important;inset-inline:auto !important;}
}

.comparison-scroll-hint{
  display:none;
  margin:0 0 12px;
  padding:10px 14px;
  border-radius:12px;
  background:#e8f4f1;
  color:#165d65;
  font-size:13px;
  font-weight:800;
  text-align:center;
}
.comparison-wrap{
  scrollbar-width:thin;
  scrollbar-color:var(--color-leaf) #dcebea;
  overscroll-behavior-inline:contain;
}
.comparison-wrap::-webkit-scrollbar{height:11px;}
.comparison-wrap::-webkit-scrollbar-track{background:#dcebea;border-radius:999px;}
.comparison-wrap::-webkit-scrollbar-thumb{background:var(--color-leaf);border-radius:999px;border:2px solid #dcebea;}

@media (max-width:980px){
  .how-steps{grid-template-columns:repeat(2,minmax(0,1fr));}
  .how-step{min-height:0;}
}

@media (max-width:860px){
  .site-header{z-index:3100 !important;overflow:visible !important;}
  .header-inner{position:relative;}
  .main-nav{
    position:absolute !important;
    z-index:3050 !important;
    top:100% !important;
    bottom:auto !important;
    left:0 !important;
    right:0 !important;
    inset-inline:0 !important;
    width:100vw !important;
    max-width:none !important;
    max-height:calc(100dvh - var(--header-h)) !important;
    padding:0 !important;
    overflow-y:auto !important;
    overscroll-behavior:contain;
    background:#fff !important;
    border-top:1px solid rgba(14,58,92,.08);
    box-shadow:0 22px 40px rgba(5,39,48,.2);
    transform:translateY(-12px) !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
    transition:transform .22s ease,opacity .2s ease,visibility .2s ease !important;
  }
  .main-nav.open{
    transform:translateY(0) !important;
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
  }
  .main-nav ul{
    display:flex !important;
    flex-direction:column !important;
    gap:0 !important;
    width:100%;
    max-width:var(--container-w);
    margin:0 auto;
    padding:12px var(--page-pad) max(34px,env(safe-area-inset-bottom));
    background:#fff;
  }
  .main-nav a{
    display:flex !important;
    align-items:center;
    min-height:56px;
    padding:12px 8px !important;
    border-bottom:1px solid #e8eef1 !important;
    color:var(--color-deep) !important;
    font-size:17px !important;
    font-weight:750;
  }
  .main-nav a::after{display:none !important;}
  body.nav-open{overflow:hidden !important;touch-action:none;}
  body.nav-open .contact-dock{display:none !important;}
  .nav-toggle{position:relative;z-index:3200;}
}

@media (max-width:720px){
  :root{--contact-dock-height:78px;}
  .brand-logo{
    inline-size:126px !important;
    block-size:58px !important;
    max-inline-size:126px !important;
  }
  .site-header .header-inner,.detail-header-inner,.legal-header-inner{min-height:72px;}
  .footer-brand{align-items:center;text-align:center;}
  .footer-brand-logo{inline-size:138px !important;block-size:138px !important;max-inline-size:138px !important;}
  .detail-footer-logo{inline-size:96px;block-size:96px;flex-basis:96px;}

  /* Physical bottom coordinates avoid logical-direction and iOS viewport glitches. */
  .contact-dock{
    position:fixed !important;
    z-index:2400 !important;
    left:0 !important;
    right:0 !important;
    top:auto !important;
    bottom:0 !important;
    inset:auto 0 0 0 !important;
    width:100% !important;
    min-width:100% !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:0 !important;
    padding:0 0 env(safe-area-inset-bottom) !important;
    background:#fff !important;
    border-top:1px solid rgba(7,48,61,.17);
    box-shadow:0 -10px 28px rgba(5,39,48,.2);
    transform:translateZ(0);
    -webkit-transform:translateZ(0);
    isolation:isolate;
  }
  .contact-dock::after{
    content:"";
    position:absolute;
    z-index:-1;
    left:0;
    right:0;
    bottom:-120px;
    height:120px;
    background:#fff;
    pointer-events:none;
  }
  .contact-dock-item{
    min-width:0 !important;
    min-height:var(--contact-dock-height) !important;
    padding:8px 4px !important;
    border-radius:0 !important;
    flex-direction:column !important;
    justify-content:center !important;
    overflow:hidden;
    color:#fff !important;
  }
  .contact-dock-item span:last-child{
    display:block;
    width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:11px;
    line-height:1.25;
  }
  body{padding-bottom:calc(var(--contact-dock-height) + env(safe-area-inset-bottom) + 8px) !important;}
  .site-footer{margin-bottom:0 !important;}

  .how-steps{grid-template-columns:1fr !important;gap:12px;}
  .how-step{display:grid;grid-template-columns:54px 1fr;column-gap:14px;padding:20px 18px;}
  .how-num{grid-row:1/3;margin:0;}
  .how-step h3{margin:2px 0 6px;}
  .how-step p{margin:0;}

  .comparison-scroll-hint{display:block;}
  .comparison-wrap{
    width:100%;
    border-radius:14px !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch;
    padding-bottom:4px;
  }
  .comparison-table{min-width:620px !important;font-size:13px;}
  .comparison-table th,.comparison-table td{padding:14px 12px !important;}
  .comparison-table thead th:first-child,
  .comparison-table tbody th{
    position:sticky;
    inset-inline-start:0;
    z-index:2;
    min-width:132px;
    box-shadow:5px 0 12px rgba(8,53,65,.08);
  }
  html[dir="rtl"] .comparison-table thead th:first-child,
  html[dir="rtl"] .comparison-table tbody th{box-shadow:-5px 0 12px rgba(8,53,65,.08);}
  .comparison-table thead th:first-child{z-index:3;background:#0e3a5c;}
}

@media (max-width:390px){
  .brand-logo{inline-size:112px !important;block-size:54px !important;max-inline-size:112px !important;}
  .lang-toggle{padding:7px 9px;}
  .contact-dock-item span:last-child{font-size:10px;}
}

/* Final sizing and full-screen mobile menu polish */
.brand-logo{
  inline-size:138px !important;
  block-size:107px !important;
  max-inline-size:138px !important;
}
.site-header .header-inner{min-height:108px;height:108px;}
.detail-header-inner{min-height:108px;}
.legal-header-inner{min-height:104px;}
@media(max-width:860px){
  .main-nav{
    height:calc(100dvh - var(--header-h)) !important;
    min-height:calc(100dvh - var(--header-h)) !important;
    max-height:calc(100dvh - var(--header-h)) !important;
  }
}
@media(max-width:720px){
  :root{--header-h:96px;}
  .brand-logo{
    inline-size:122px !important;
    block-size:95px !important;
    max-inline-size:122px !important;
  }
  .site-header .header-inner,.detail-header-inner,.legal-header-inner{min-height:96px;height:96px;}
  .contact-dock{transform:none !important;-webkit-transform:none !important;isolation:auto !important;}
}
@media(max-width:390px){
  .brand-logo{inline-size:112px !important;block-size:87px !important;max-inline-size:112px !important;}
}

/* Final consistency details */
:root{--header-h:108px;}
.footer-brand > p{color:#b8ccd6 !important;opacity:1 !important;}
.comparison-scroll-hint{letter-spacing:0;}
@media(max-width:720px){:root{--header-h:96px;}}


/* ========================================================================== 
   V6 — restored campaign gallery and image-enabled product request form
   ========================================================================== */
.campaign-gallery{
  padding-block:clamp(68px,8vw,104px);
  background:linear-gradient(180deg,#f7fbfa 0%,#eaf5f2 100%);
}
.gallery-language-note{
  max-width:720px;
  margin:16px auto 0;
  color:#60727b;
  font-size:12px;
  line-height:1.6;
  text-align:center;
}
.form-honeypot{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
  clip:rect(0 0 0 0) !important;
  clip-path:inset(50%) !important;
  white-space:nowrap !important;
}
.form-row-upload{
  padding:16px;
  border:1px dashed rgba(15,74,85,.28);
  border-radius:16px;
  background:#f8fcfb;
}
.file-input-native{
  position:absolute;
  inline-size:1px;
  block-size:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
.file-upload-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  margin-top:4px;
  padding:10px 17px;
  border:1px solid rgba(14,58,92,.18);
  border-radius:12px;
  background:#fff;
  color:var(--color-deep);
  font-weight:800;
  cursor:pointer;
  box-shadow:0 8px 20px rgba(8,53,65,.07);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.file-upload-button::before{content:"＋";margin-inline-end:7px;font-size:20px;line-height:1;}
.file-upload-button:hover{transform:translateY(-1px);border-color:var(--color-aqua);box-shadow:0 12px 24px rgba(8,53,65,.11);}
.file-input-native:focus-visible + .file-upload-button{outline:3px solid rgba(28,162,145,.2);outline-offset:3px;}
.form-upload-help,.file-selection-summary,.form-channel-note{
  margin:9px 0 0;
  color:#61727c;
  font-size:12px;
  line-height:1.65;
}
.file-selection-summary{font-weight:700;color:#315463;}
.image-preview-grid{display:grid;gap:10px;margin-top:12px;}
.image-preview-item{
  position:relative;
  display:grid;
  grid-template-columns:58px minmax(0,1fr) 38px;
  align-items:center;
  gap:11px;
  min-width:0;
  padding:9px;
  border:1px solid rgba(14,58,92,.1);
  border-radius:13px;
  background:#fff;
}
.image-preview-visual{
  display:grid;
  place-items:center;
  width:58px;
  height:58px;
  overflow:hidden;
  border-radius:10px;
  background:#eaf5f2;
  color:#1d6670;
  font-size:11px;
  font-weight:900;
}
.image-preview-visual img{width:100%;height:100%;object-fit:cover;}
.image-preview-meta{display:grid;min-width:0;gap:3px;}
.image-preview-meta strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;color:var(--color-deep);}
.image-preview-meta span{font-size:11px;color:#71818a;}
.image-preview-remove{
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border:0;
  border-radius:50%;
  background:#fff0f0;
  color:#9f2424;
  font-size:22px;
  cursor:pointer;
}
.image-preview-remove:hover{background:#ffe3e3;}
.form-row-upload.invalid{border-color:#b42318;background:#fff8f7;}
.form-delivery-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.btn-whatsapp{background:#178a50;color:#fff;border-color:#178a50;}
.btn-whatsapp:hover{background:#117443;border-color:#117443;}
.btn[disabled]{opacity:.58;cursor:wait;transform:none !important;}
.form-status.pending{color:#155d73;background:#edf7fa;border-color:rgba(21,93,115,.2);}
.form-status.error{color:#8b1f1f;background:#fff4f4;border-color:rgba(180,35,24,.2);}
.form-channel-note{padding:9px 11px;border-inline-start:3px solid #d7a21d;background:#fff9e9;border-radius:8px;color:#67531e;}

@media(max-width:720px){
  .campaign-gallery{padding-block:64px;}
  .form-row-upload{padding:14px 12px;}
  .file-upload-button{width:100%;}
  .form-delivery-actions{grid-template-columns:1fr;}
  .form-delivery-actions .btn{min-height:52px;}
  .image-preview-item{grid-template-columns:52px minmax(0,1fr) 38px;}
  .image-preview-visual{width:52px;height:52px;}
}

/* V6 mobile overflow containment */
html,body{max-width:100%;overflow-x:hidden;}
.hero{overflow:hidden;}
.hero-product-stage{overflow:clip !important;max-width:100%;}
.file-input-native{
  width:1px !important;
  height:1px !important;
  min-width:1px !important;
  max-width:1px !important;
  min-height:1px !important;
  max-height:1px !important;
}


/* V6.1 FINAL FIXES */
:root{
  --contact-dock-actual-height:78px;
  --visual-viewport-bottom:0px;
}

/* Restore the successful V5 opening layout: two equal, independent square cards. */
.hero-product-stage{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  grid-template-rows:auto auto !important;
  align-items:start !important;
  gap:18px !important;
  min-height:0 !important;
  padding:22px !important;
  overflow:hidden !important;
}
.hero-product-stage > *{position:relative !important;z-index:1;}
.hero-product-card,
.hero-product-krs,
.hero-product-lite{
  position:relative !important;
  inset:auto !important;
  inline-size:100% !important;
  block-size:auto !important;
  aspect-ratio:1 / 1 !important;
  transform:none !important;
  margin:0 !important;
  border:1px solid rgba(14,58,92,.10) !important;
  border-radius:22px !important;
  background:#fff !important;
  box-shadow:0 16px 36px rgba(8,54,75,.13) !important;
  overflow:hidden !important;
}
.hero-product-card img{
  display:block !important;
  inline-size:100% !important;
  block-size:100% !important;
  object-fit:cover !important;
  object-position:center !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
}
.hero-product-card > span{
  top:12px !important;
  inset-inline-start:12px !important;
  padding:6px 11px !important;
  font-size:11px !important;
  box-shadow:0 6px 18px rgba(4,35,54,.22);
}
.hero-visual-copy{
  position:relative !important;
  grid-column:1 / -1 !important;
  inset:auto !important;
  inline-size:100% !important;
  margin:0 !important;
  padding:20px 22px !important;
  border-radius:18px !important;
}

/* Clear, high-visibility instruction for the horizontally scrollable comparison. */
.comparison-scroll-hint{
  position:relative;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:56px;
  margin:0 auto 16px !important;
  padding:12px 18px 12px 54px !important;
  border:2px solid rgba(17,117,103,.34) !important;
  border-radius:16px !important;
  background:linear-gradient(135deg,#e5f7f1,#f8fffc) !important;
  color:#0c5c57 !important;
  box-shadow:0 10px 25px rgba(8,83,73,.11);
  font-size:15px !important;
  font-weight:900 !important;
  line-height:1.55;
  text-align:center;
}
html[dir="rtl"] .comparison-scroll-hint{padding:12px 54px 12px 18px !important;}
.comparison-scroll-hint::before{
  content:"⇆";
  position:absolute;
  inset-inline-start:14px;
  display:grid;
  place-items:center;
  width:32px;
  height:32px;
  border-radius:50%;
  background:#117567;
  color:#fff;
  font-size:20px;
  line-height:1;
  animation:comparison-swipe-cue 1.8s ease-in-out infinite;
}
@keyframes comparison-swipe-cue{
  0%,100%{transform:translateX(-3px)}
  50%{transform:translateX(3px)}
}
@media (prefers-reduced-motion:reduce){.comparison-scroll-hint::before{animation:none;}}

.comparison-help p{
  font-size:15px;
  line-height:1.9;
  text-wrap:pretty;
}

/* Fixed contact dock: physical coordinates, solid background, measured spacer and visual-viewport correction. */
@media (max-width:720px){
  html{
    scroll-padding-bottom:calc(var(--contact-dock-actual-height) + var(--visual-viewport-bottom) + 24px);
  }
  body{
    padding-bottom:calc(var(--contact-dock-actual-height) + var(--visual-viewport-bottom) + 20px) !important;
  }
  .contact-dock{
    position:fixed !important;
    z-index:2147483000 !important;
    inset:auto !important;
    left:0 !important;
    right:0 !important;
    top:auto !important;
    bottom:var(--visual-viewport-bottom) !important;
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    width:100% !important;
    min-width:100% !important;
    max-width:none !important;
    height:auto !important;
    margin:0 !important;
    padding:0 0 env(safe-area-inset-bottom) !important;
    gap:0 !important;
    overflow:visible !important;
    background:#fff !important;
    border-top:1px solid rgba(7,48,61,.2) !important;
    box-shadow:0 -10px 30px rgba(5,39,48,.20) !important;
    transform:none !important;
    -webkit-transform:none !important;
    isolation:isolate;
  }
  .contact-dock::after{display:none !important;content:none !important;}
  .contact-dock-item{
    display:flex !important;
    min-width:0 !important;
    min-height:76px !important;
    padding:7px 4px 8px !important;
    border:0 !important;
    border-radius:0 !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:5px !important;
    overflow:hidden !important;
    color:#fff !important;
    text-align:center !important;
    box-shadow:none !important;
    transform:none !important;
  }
  .contact-dock-item > span:first-child{
    width:29px !important;
    height:29px !important;
    flex:0 0 29px;
    font-size:15px !important;
  }
  .contact-dock-item > span:last-child{
    display:-webkit-box !important;
    width:100% !important;
    max-width:100% !important;
    min-height:30px;
    overflow:hidden !important;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    white-space:normal !important;
    text-overflow:clip !important;
    font-size:11.5px !important;
    font-weight:800 !important;
    line-height:1.28 !important;
  }
  .contact-dock-whatsapp{background:#129d59 !important;}
  
  .contact-dock-quote{background:#1c7f68 !important;}
  .site-footer{margin-bottom:0 !important;}

  .hero-product-stage{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:11px !important;
    padding:12px !important;
    border-radius:22px !important;
  }
  .hero-product-card,
  .hero-product-krs,
  .hero-product-lite{border-radius:16px !important;}
  .hero-product-card > span{
    top:8px !important;
    inset-inline-start:8px !important;
    padding:5px 8px !important;
    font-size:9px !important;
  }
  .hero-visual-copy{padding:16px !important;border-radius:15px !important;}
  .hero-visual-copy strong{font-size:15px !important;}
  .hero-visual-copy p{font-size:12px !important;line-height:1.65 !important;}

  .comparison-scroll-hint{display:flex !important;}
}

@media (min-width:721px){
  .comparison-scroll-hint{display:none !important;}
}

@media (max-width:390px){
  .hero-product-stage{gap:8px !important;padding:9px !important;}
  .hero-product-card > span{font-size:8px !important;padding:4px 6px !important;}
  .contact-dock-item > span:last-child{font-size:10.5px !important;}
}


/* ========================================================================== 
   V6.2 — pricing section and highlighted navigation link
   ========================================================================== */

.offers-section{
  position:relative;
  padding-block:clamp(68px,8vw,104px);
  overflow:hidden;
  background:
    radial-gradient(circle at 12% 18%,rgba(28,127,184,.13),transparent 31%),
    linear-gradient(180deg,#ffffff 0%,#eff8fa 100%);
}
.offer-shell{
  position:relative;
  padding:clamp(18px,2.6vw,34px);
  border:1px solid rgba(14,58,92,.12);
  border-radius:clamp(22px,3vw,34px);
  background:rgba(255,255,255,.94);
  box-shadow:0 26px 60px -34px rgba(8,53,65,.45);
}
.offer-shell::before{
  content:"";
  position:absolute;
  inset-inline-start:0;
  top:clamp(22px,4vw,48px);
  width:5px;
  height:96px;
  border-radius:0 6px 6px 0;
  background:linear-gradient(180deg,#d72822,#f0a527);
}
html[dir="rtl"] .offer-shell::before{border-radius:6px 0 0 6px;}
.offer-grid{
  display:grid;
  grid-template-columns:minmax(0,.88fr) minmax(320px,1.12fr);
  gap:clamp(28px,5vw,64px);
  align-items:center;
}
.offer-content{min-width:0;padding-inline:clamp(4px,1vw,12px);}
.offer-content .eyebrow{
  color:#b2211d;
  font-weight:900;
  letter-spacing:0;
  text-transform:none;
  font-size:clamp(14px,1.4vw,17px);
}
.offer-content .section-title{
  max-width:15ch;
  margin-bottom:16px;
  font-size:clamp(30px,3.8vw,48px);
}
.offer-intro{max-width:58ch;font-size:clamp(15px,1.4vw,18px);line-height:1.8;}
.offer-prices{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin-block:24px 18px;
}
.offer-price-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:14px 16px;
  border:1px solid rgba(14,58,92,.12);
  border-radius:16px;
  background:linear-gradient(145deg,#f8fcfd,#eef7fa);
}
.offer-price-card span{font-weight:850;color:var(--color-deep);}
.offer-price-card strong{font-size:clamp(24px,2.5vw,34px);line-height:1;color:#08779a;}
.offer-benefits{display:grid;gap:10px;margin-block:18px;}
.offer-benefits li{
  display:flex;
  align-items:center;
  gap:10px;
  color:#244552;
  font-weight:750;
}
.offer-benefits li>span:first-child{
  display:grid;
  place-items:center;
  width:30px;
  height:30px;
  flex:0 0 30px;
  border-radius:50%;
  background:#e5f4ee;
  color:#167b58;
  font-size:15px;
}
.offer-limited{
  display:flex;
  align-items:center;
  gap:9px;
  width:fit-content;
  margin:20px 0 0;
  padding:10px 14px;
  border-radius:12px;
  background:#fff4f1;
  color:#a32020;
  font-weight:850;
}
.offer-limited span:last-child{color:inherit;}
.offer-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px;}
.offer-whatsapp{border-color:#168450;color:#146d46;background:#f3fbf7;}
.offer-whatsapp:hover{background:#e2f5ea;}
.offer-media{
  min-width:0;
  margin:0;
  padding:10px;
  border-radius:26px;
  background:#fff;
  box-shadow:0 22px 48px -28px rgba(8,53,65,.5);
}
.offer-media[hidden]{display:none !important;}
.offer-image-link{
  position:relative;
  display:block;
  border-radius:19px;
  cursor:pointer;
  overflow:hidden;
  outline:none;
  -webkit-tap-highlight-color:transparent;
  transition:transform .22s ease,box-shadow .22s ease;
}
.offer-image-link:hover{
  transform:translateY(-3px);
  box-shadow:0 18px 34px -22px rgba(8,53,65,.7);
}
.offer-image-link:focus-visible{
  box-shadow:0 0 0 4px rgba(15,127,177,.25),0 18px 34px -22px rgba(8,53,65,.7);
}
.offer-image-link:active{transform:scale(.992);}
.offer-media img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:1;
  object-fit:cover;
  border-radius:19px;
}
@media (prefers-reduced-motion:reduce){
  .offer-image-link{transition:none;}
  .offer-image-link:hover,.offer-image-link:active{transform:none;}
}
.offers-section.is-text-only .offer-grid{grid-template-columns:minmax(0,820px);justify-content:center;}
.offers-section.is-text-only .offer-content{text-align:center;}
.offers-section.is-text-only .offer-content .section-title,
.offers-section.is-text-only .offer-intro{margin-inline:auto;}
.offers-section.is-text-only .offer-benefits{max-width:520px;margin-inline:auto;}
.offers-section.is-text-only .offer-benefits li{justify-content:center;}
.offers-section.is-text-only .offer-limited{margin-inline:auto;}
.offers-section.is-text-only .offer-actions{justify-content:center;}

@media(max-width:980px){
  .offer-grid{grid-template-columns:minmax(0,1fr) minmax(300px,.9fr);gap:28px;}
  .offer-content .section-title{font-size:clamp(29px,4vw,40px);}
}
@media(max-width:860px){
  .offer-grid{grid-template-columns:1fr;}
  .offer-content{order:1;text-align:center;}
  .offer-media{order:0;max-width:620px;margin-inline:auto;}
  .offer-content .section-title,.offer-intro{margin-inline:auto;}
  .offer-benefits{max-width:520px;margin-inline:auto;}
  .offer-benefits li{justify-content:center;}
  .offer-limited{margin-inline:auto;}
  .offer-actions{justify-content:center;}
}
@media(max-width:560px){
  .offers-section{padding-block:58px;}
  .offer-shell{padding:14px;border-radius:22px;}
  .offer-shell::before{display:none;}
  .offer-media{padding:6px;border-radius:18px;}
  .offer-media img{border-radius:14px;}
  .offer-content{padding:6px 4px 10px;}
  .offer-content .section-title{font-size:30px;}
  .offer-prices{grid-template-columns:1fr;}
  .offer-price-card{padding:13px 15px;}
  .offer-actions .btn{width:100%;min-height:52px;}
  .offer-limited{width:100%;justify-content:center;text-align:center;}
}


/* V6.4 Belgian address fields and visible form result dialog */
.form-address-group{
  margin:0 0 20px;
  padding:18px;
  border:1.5px solid #cfe0e6;
  border-radius:16px;
  background:linear-gradient(180deg,#f8fcfc 0%,#f2f9f8 100%);
}
.form-address-group legend{
  padding:0 8px;
  color:var(--color-deep);
  font-size:15px;
  font-weight:800;
}
.form-address-help,.city-data-status{
  margin:0 0 14px;
  color:var(--color-ink-soft);
  font-size:12.5px;
  line-height:1.65;
}
.city-data-status{margin:2px 0 0;color:#155d73;font-weight:650;}
.address-fields{display:grid;grid-template-columns:1fr 1fr;gap:0 14px;}
.address-fields .form-row{min-width:0;}
.address-fields .form-row-wide{grid-column:1/-1;}
.quote-form input[list]{background-image:none;}

.form-notice-dialog{
  width:min(92vw,480px);
  max-width:480px;
  padding:0;
  border:0;
  border-radius:22px;
  background:transparent;
  color:var(--color-ink);
  overflow:visible;
}
.form-notice-dialog::backdrop{background:rgba(3,28,43,.62);backdrop-filter:blur(4px);}
.form-notice-card{
  position:relative;
  padding:34px 30px 28px;
  border-radius:22px;
  background:#fff;
  box-shadow:0 24px 80px rgba(0,28,46,.32);
  text-align:center;
  border:2px solid rgba(22,139,117,.18);
}
.form-notice-icon{
  display:grid;
  place-items:center;
  width:70px;
  height:70px;
  margin:0 auto 18px;
  border-radius:50%;
  background:#e8f8f1;
  color:#118451;
  font-size:38px;
  font-weight:900;
}
.form-notice-dialog[data-type="error"] .form-notice-card,
.form-notice-dialog[data-type="validation"] .form-notice-card{border-color:rgba(180,35,24,.22);}
.form-notice-dialog[data-type="error"] .form-notice-icon,
.form-notice-dialog[data-type="validation"] .form-notice-icon{background:#fff0ef;color:#b42318;}
.form-notice-dialog[data-type="whatsapp"] .form-notice-icon{background:#e8f8ef;color:#128c4b;}
.form-notice-card h3{margin:0 0 10px;color:var(--color-deep);font-size:24px;line-height:1.25;}
.form-notice-card p{margin:0 auto 22px;max-width:390px;color:var(--color-ink-soft);font-size:15px;line-height:1.8;}
.form-notice-close{
  position:absolute;
  inset-block-start:12px;
  inset-inline-end:14px;
  width:36px;
  height:36px;
  border:0;
  border-radius:50%;
  background:#eef4f6;
  color:#294b5a;
  font-size:25px;
  cursor:pointer;
}
.form-notice-close:hover{background:#dfecef;}
.form-notice-action{min-width:150px;justify-content:center;}

@media(max-width:720px){
  .form-address-group{padding:15px 12px;}
  .address-fields{grid-template-columns:1fr;gap:0;}
  .address-fields .form-row-wide{grid-column:auto;}
  .form-notice-card{padding:32px 20px 24px;}
  .form-notice-card h3{font-size:21px;}
}

/* V6.6 — transparent header logo: remove the white card around the artwork */
.site-header .brand-logo,
.detail-header .brand-logo,
.legal-header .brand-logo{
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  object-fit: contain !important;
  object-position: center !important;
}

/* ========================================================================== 
   V6.3 — contact trust card and real customer reviews readiness
   ========================================================================== */
.contact-inner{
  grid-template-columns:minmax(0,.82fr) minmax(440px,1.18fr);
  align-items:start;
}
.contact-support-column{
  display:grid;
  align-content:start;
  gap:24px;
  min-width:0;
}
.contact-intro{
  max-width:580px;
}
.contact-intro > p:not(.eyebrow){
  max-width:52ch;
  line-height:1.9;
}
.contact-trust-card,
.customer-reviews-panel{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.18);
  border-radius:24px;
  background:
    radial-gradient(circle at 100% 0,rgba(48,183,156,.18),transparent 38%),
    linear-gradient(145deg,rgba(255,255,255,.13),rgba(255,255,255,.07));
  box-shadow:0 20px 50px rgba(0,22,39,.22);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.contact-trust-card{
  padding:clamp(22px,3vw,30px);
}
.contact-trust-card::before,
.customer-reviews-panel::before{
  content:"";
  position:absolute;
  inset-inline-start:0;
  top:0;
  width:100%;
  height:4px;
  background:linear-gradient(90deg,#2ca7d8 0 48%,#35ad77 52% 100%);
}
.contact-trust-heading{
  display:flex;
  align-items:flex-start;
  gap:14px;
  margin-bottom:20px;
}
.contact-trust-mark{
  display:grid;
  place-items:center;
  width:46px;
  height:46px;
  flex:0 0 46px;
  border:1px solid rgba(255,255,255,.25);
  border-radius:15px;
  background:linear-gradient(145deg,#279bc6,#24966a);
  color:#fff;
  font-size:23px;
  font-weight:900;
  box-shadow:0 10px 24px rgba(0,35,49,.24);
}
.contact-trust-eyebrow,
.customer-reviews-eyebrow{
  margin:0 0 5px;
  color:#8fd9cb !important;
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
}
.brand-inline{unicode-bidi:isolate;font-family:Arial,Tahoma,sans-serif;letter-spacing:.01em;}
.contact-trust-card h3,
.customer-reviews-panel h3{
  margin:0;
  color:#fff;
  font-size:clamp(20px,2.5vw,25px);
  line-height:1.35;
}
.contact-trust-list{
  display:grid;
  gap:12px;
  margin:0 0 22px;
  padding:0;
  list-style:none;
}
.contact-trust-list li{
  display:grid;
  grid-template-columns:26px minmax(0,1fr);
  align-items:start;
  gap:10px;
  color:#f4fbfd;
  font-size:14.5px;
  line-height:1.65;
}
.contact-trust-list li > span:first-child{
  display:grid;
  place-items:center;
  width:24px;
  height:24px;
  margin-top:1px;
  border-radius:50%;
  background:rgba(67,190,145,.18);
  color:#8fe1b8;
  font-size:13px;
  font-weight:900;
}
.contact-trust-cta{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  width:100%;
  min-height:50px;
  padding:12px 18px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:15px;
  background:#fff;
  color:var(--color-deep);
  text-decoration:none;
  font-weight:850;
  box-shadow:0 12px 28px rgba(0,21,38,.18);
  transition:transform .2s ease,box-shadow .2s ease,background .2s ease;
}
.contact-trust-cta:hover{
  transform:translateY(-2px);
  background:#f7fffd;
  box-shadow:0 16px 34px rgba(0,21,38,.26);
}
.contact-trust-arrow{
  font-size:20px;
  transition:transform .2s ease;
}
html[dir="ltr"] .contact-trust-arrow{transform:rotate(180deg);}
.contact-trust-cta:hover .contact-trust-arrow{transform:translateX(-3px);}
html[dir="ltr"] .contact-trust-cta:hover .contact-trust-arrow{transform:rotate(180deg) translateX(-3px);}
.contact-trust-note{
  margin:14px 0 0 !important;
  color:#cce0e8 !important;
  font-size:12.5px;
  line-height:1.7;
  text-align:center;
}

.customer-reviews-panel{
  padding:clamp(20px,3vw,26px);
}
.customer-reviews-panel[hidden]{display:none !important;}
.customer-reviews-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:18px;
}
.customer-reviews-score{
  display:grid;
  justify-items:end;
  min-width:112px;
  color:#fff;
  text-align:end;
}
.customer-reviews-score strong{
  color:#fff;
  font-size:28px;
  line-height:1;
}
.customer-reviews-score > span:last-child{
  margin-top:4px;
  color:#c9dde5;
  font-size:10.5px;
  line-height:1.35;
}
.customer-reviews-stars,
.customer-review-stars{color:#f5c451;letter-spacing:1px;white-space:nowrap;}
.customer-reviews-stars{font-size:13px;}
.customer-reviews-viewport{
  overflow:hidden;
  border-radius:18px;
}
.customer-reviews-track{
  display:flex;
  direction:ltr;
  width:100%;
  transition:transform .45s cubic-bezier(.22,.61,.36,1);
  will-change:transform;
}
.customer-review-card{
  flex:0 0 100%;
  min-width:100%;
  padding:20px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:18px;
  background:rgba(3,38,58,.45);
  color:#fff;
  text-align:start;
}
.customer-review-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}
.customer-review-stars{display:inline-flex;font-size:15px;}
.customer-review-stars .is-empty{color:rgba(255,255,255,.22);}
.customer-review-verified{
  padding:5px 9px;
  border:1px solid rgba(125,226,184,.24);
  border-radius:999px;
  background:rgba(35,152,105,.18);
  color:#a4e8c5;
  font-size:10.5px;
  font-weight:800;
}
.customer-review-card blockquote{
  margin:0 0 18px;
  color:#f7fcfe;
  font-size:15px;
  line-height:1.9;
}
.customer-review-footer{
  display:flex;
  align-items:center;
  gap:11px;
}
.customer-review-avatar{
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  flex:0 0 42px;
  border-radius:50%;
  background:linear-gradient(145deg,#2ca7d8,#35ad77);
  color:#fff;
  font-weight:900;
}
.customer-review-identity{
  display:grid;
  min-width:0;
  margin-inline-end:auto;
}
.customer-review-identity strong{color:#fff;font-size:13.5px;}
.customer-review-identity span{color:#bcd2dc;font-size:11.5px;line-height:1.5;}
.customer-review-source{
  color:#9ee2d1;
  font-size:11px;
  font-weight:750;
  text-underline-offset:3px;
}
.customer-reviews-controls{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  margin-top:16px;
}
.customer-reviews-button{
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  padding:0;
  border:1px solid rgba(255,255,255,.2);
  border-radius:50%;
  background:rgba(255,255,255,.1);
  color:#fff;
  font-size:24px;
  line-height:1;
  cursor:pointer;
}
.customer-reviews-button:hover{background:rgba(255,255,255,.18);}
.customer-reviews-position{
  min-width:58px;
  color:#c7dae2;
  font-size:12px;
  text-align:center;
}

@media (min-width:981px){
  .contact-support-column{
    position:sticky;
    top:calc(var(--header-h) + 24px);
  }
}
@media (max-width:980px){
  .contact-inner{grid-template-columns:1fr;}
  .contact-support-column{max-width:760px;margin-inline:auto;width:100%;}
  .quote-form{max-width:760px;margin-inline:auto;}
}
@media (max-width:600px){
  .contact-support-column{gap:18px;}
  .contact-trust-card,.customer-reviews-panel{border-radius:20px;}
  .contact-trust-heading{gap:11px;}
  .contact-trust-mark{width:42px;height:42px;flex-basis:42px;border-radius:13px;}
  .customer-reviews-heading{display:grid;}
  .customer-reviews-score{justify-items:start;text-align:start;}
  .customer-review-top{align-items:flex-start;}
  .customer-review-footer{align-items:flex-start;flex-wrap:wrap;}
  .customer-review-source{width:100%;margin-inline-start:53px;}
}
@media (prefers-reduced-motion:reduce){
  .customer-reviews-track,.contact-trust-cta,.contact-trust-arrow{transition:none !important;}
}



/* 2026-08 AQUA FLORA prices, clickable products and compact mobile comparison */
.hero-product-card{display:block;text-decoration:none;color:inherit}.product-page-click{cursor:pointer}.product-page-click:focus-visible{outline:3px solid var(--color-aqua);outline-offset:4px}
.offer-prices{grid-template-columns:repeat(3,minmax(0,1fr))}.offer-price-card .price-line{display:flex;align-items:baseline;justify-content:center;gap:10px;flex-wrap:wrap}.offer-price-card del{opacity:.65;font-size:16px}.offer-price-card strong{font-size:30px}.offer-price-card small{display:block;margin-top:4px}.offer-price-card small b{background:#d93333;color:#fff;border-radius:999px;padding:3px 7px}
.product-price-box{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:10px 0 18px;padding:13px 15px;border-radius:16px;background:linear-gradient(135deg,#eef8f6,#fff);border:1px solid rgba(14,58,92,.1)}.product-price-box>div{display:flex;align-items:baseline;gap:10px}.product-price-box del{color:#71818a;font-size:16px}.product-price-box strong{font-size:30px;color:var(--color-deep)}.product-price-box>span{background:#d93333;color:#fff;font-weight:900;border-radius:999px;padding:5px 9px}.product-price-box small{font-weight:800;color:var(--color-leaf)}
.product-filter-set .product-main-image{object-fit:cover}.comparison-price-row td strong{display:block;color:var(--color-leaf);font-size:17px}.comparison-price-row td del{font-size:11px;opacity:.62}
@media(max-width:720px){.offer-prices{grid-template-columns:1fr}.comparison-wrap{overflow-x:auto;scroll-snap-type:x proximity}.comparison-table{min-width:560px!important;table-layout:fixed;font-size:11px!important}.comparison-table th,.comparison-table td{padding:9px 5px!important;line-height:1.3!important;word-break:normal}.comparison-table thead th:first-child,.comparison-table tbody th{width:92px!important;min-width:92px!important}.comparison-table thead th:not(:first-child){width:156px}.comparison-scroll-hint{font-size:12px!important;padding-block:10px!important}.product-price-box strong{font-size:27px}}
@media(max-width:390px){.comparison-table{min-width:530px!important}.comparison-table th,.comparison-table td{padding:8px 4px!important;font-size:10.5px!important}.comparison-table thead th:first-child,.comparison-table tbody th{width:82px!important;min-width:82px!important}.comparison-table thead th:not(:first-child){width:149px}}


/* 2026-08-06 — price bidi, mobile offers and compact comparison corrections */
.offer-price-card{
  display:grid;
  grid-template-columns:minmax(120px,1fr) auto minmax(112px,.75fr);
  align-items:center;
  column-gap:14px;
  row-gap:5px;
  text-align:start;
}
.offer-price-card .offer-product-name{min-width:0;line-height:1.25;overflow-wrap:anywhere}
.offer-price-card .price-line{display:flex;align-items:baseline;justify-content:center;gap:8px;white-space:nowrap;unicode-bidi:isolate}
.offer-price-card .price-line del{font-size:16px;color:#5d6c75;text-decoration-thickness:1.5px}
.offer-price-card .price-line strong{font-size:clamp(26px,3vw,34px);line-height:1;color:#08779a;white-space:nowrap}
.offer-price-card small{display:flex;align-items:center;justify-content:flex-end;gap:6px;min-width:0;font-size:13px;line-height:1.25;text-align:end}
.offer-price-card small b{flex:none;direction:ltr;unicode-bidi:isolate}
.table-price{display:flex;flex-direction:column;align-items:center;gap:2px;white-space:nowrap;unicode-bidi:isolate}
.table-price del{font-size:.82em;color:#64747d;text-decoration-thickness:1.3px}
.table-price strong{font-size:1.08em;color:var(--color-deep)}

@media(max-width:720px){
  .offer-price-card{grid-template-columns:minmax(0,1fr) auto;column-gap:10px;padding:14px 12px!important}
  .offer-price-card .offer-product-name{font-size:15px;font-weight:850}
  .offer-price-card .price-line{justify-content:flex-end}
  .offer-price-card small{grid-column:1/-1;justify-content:flex-start;border-top:1px solid rgba(14,58,92,.08);padding-top:7px;font-size:12px}
  html[dir="rtl"] .offer-price-card small{justify-content:flex-start}

  .comparison-wrap{overflow-x:auto;overscroll-behavior-inline:contain;border-radius:18px}
  .comparison-table{width:100%!important;min-width:0!important;table-layout:fixed!important;font-size:9.5px!important}
  .comparison-table th,.comparison-table td{padding:7px 3px!important;line-height:1.25!important;overflow-wrap:anywhere;word-break:normal;hyphens:auto}
  .comparison-table thead th:first-child,.comparison-table tbody th{width:24%!important;min-width:0!important;position:static!important}
  .comparison-table thead th:not(:first-child),.comparison-table tbody td{width:25.333%!important;min-width:0!important}
  .comparison-table thead th{font-size:10px!important;letter-spacing:0!important}
  .comparison-price-row td{padding-inline:2px!important}
  .comparison-scroll-hint{font-size:11px!important;padding:9px 10px!important;line-height:1.35!important}
}
@media(max-width:390px){
  .comparison-table{font-size:8.8px!important}
  .comparison-table th,.comparison-table td{padding:6px 2px!important}
  .comparison-table thead th{font-size:9px!important}
}

/* 2026-08-06 — force the complete comparison table to fit inside phone screens */
@media (max-width:720px){
  .comparison-wrap{
    width:100% !important;
    overflow-x:visible !important;
    overflow-y:visible !important;
    border-radius:14px !important;
  }
  .comparison-table{
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    table-layout:fixed !important;
    font-size:8px !important;
  }
  .comparison-table th,
  .comparison-table td{
    min-width:0 !important;
    padding:6px 2px !important;
    line-height:1.18 !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    word-break:break-word !important;
    hyphens:auto !important;
  }
  .comparison-table thead th:first-child,
  .comparison-table tbody th{
    width:22% !important;
    position:static !important;
  }
  .comparison-table thead th:not(:first-child),
  .comparison-table tbody td{
    width:26% !important;
  }
  .comparison-table thead th{
    font-size:8.3px !important;
    padding-inline:1px !important;
  }
  .comparison-price-row td strong{
    font-size:9px !important;
    line-height:1.05 !important;
  }
  .comparison-price-row td del{
    font-size:6.8px !important;
    line-height:1 !important;
  }
  .comparison-scroll-hint{display:none !important;}
}
@media (max-width:390px){
  .comparison-table{font-size:7.2px !important;}
  .comparison-table th,.comparison-table td{padding:5px 1px !important;}
  .comparison-table thead th{font-size:7.5px !important;}
  .comparison-price-row td strong{font-size:8px !important;}
  .comparison-price-row td del{font-size:6px !important;}
}


/* 2026-08-06 — comparison contains purification systems only; filter set is an accessory */
@media (max-width:720px){
  .comparison-table{
    width:100% !important;
    min-width:0 !important;
    table-layout:fixed !important;
    font-size:11px !important;
  }
  .comparison-table thead th:first-child,
  .comparison-table tbody th{
    width:28% !important;
    min-width:0 !important;
  }
  .comparison-table thead th:not(:first-child),
  .comparison-table tbody td{
    width:36% !important;
    min-width:0 !important;
  }
  .comparison-table th,
  .comparison-table td{
    padding:8px 4px !important;
    line-height:1.35 !important;
    overflow-wrap:anywhere;
  }
  .comparison-table thead th{font-size:11px !important;}
  .comparison-price-row td strong{font-size:12px !important;}
  .comparison-price-row td del{font-size:8px !important;}
  .comparison-scroll-hint{display:none !important;}
}
@media (max-width:390px){
  .comparison-table{font-size:9.5px !important;}
  .comparison-table th,.comparison-table td{padding:7px 2px !important;}
  .comparison-table thead th{font-size:10px !important;}
  .comparison-price-row td strong{font-size:10.5px !important;}
}


/* 2026-08-07 Phase 2 — CSP-safe 404 layout */
.error-page-main{min-height:100vh;display:grid;place-items:center;background:#eef7f5;padding:24px;}
.error-page-card{max-width:650px;text-align:center;background:#fff;padding:48px 30px;border-radius:28px;box-shadow:var(--shadow-card);}
.error-page-logo{margin:0 auto 20px;}

/* ========================================================================== 
   2026-08-07 — UX phase 3: compact confidence cards + standalone FAQ/quote
   ========================================================================== */

/* Homepage FAQ is now a compact gateway to the dedicated FAQ page. */
.faq-gateway{
  padding-block:72px;
  background:linear-gradient(180deg,#ffffff 0%,#f5faf9 100%);
}
.faq-gateway-card{
  display:grid;
  justify-items:center;
  gap:14px;
  max-width:760px;
  padding:clamp(28px,5vw,46px);
  border:1px solid rgba(14,58,92,.10);
  border-radius:28px;
  background:#fff;
  box-shadow:0 18px 52px rgba(7,49,62,.08);
  text-align:center;
}
.faq-gateway-card .eyebrow,.faq-gateway-card .section-title{margin:0;}
.faq-gateway-button{margin-top:4px;min-width:min(100%,300px);justify-content:center;}

/* Dedicated lightweight pages. */
.standalone-page{background:#f4f8f8;}
.standalone-main{min-height:62vh;}
.standalone-hero{
  padding:58px 0 34px;
  background:
    radial-gradient(circle at 15% 0,rgba(42,167,216,.10),transparent 34%),
    radial-gradient(circle at 88% 15%,rgba(53,173,119,.10),transparent 32%),
    linear-gradient(180deg,#ffffff,#f5faf9);
  border-bottom:1px solid rgba(14,58,92,.08);
}
.standalone-hero-inner{max-width:860px;}
.standalone-back{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:24px;
  color:var(--color-deep);
  font-weight:800;
  text-decoration:none;
}
.standalone-back:hover{text-decoration:underline;}
.standalone-hero .eyebrow{margin-bottom:10px;}
.standalone-hero h1{
  max-width:780px;
  margin:0 0 14px;
  color:var(--color-deep);
  font-size:clamp(34px,6vw,60px);
  line-height:1.12;
}
.standalone-hero p:last-child{
  max-width:680px;
  margin:0;
  color:var(--color-ink-soft);
  font-size:clamp(15px,2.2vw,18px);
  line-height:1.85;
}
.quote-page-section{padding:38px 0 92px;}
.quote-page-grid{display:grid;gap:18px;max-width:860px;}
.quote-page .quote-form{
  width:100%;
  max-width:none;
  margin:0;
  border:1px solid rgba(14,58,92,.10);
  box-shadow:0 22px 65px rgba(7,49,62,.10);
}

.faq-page-content{padding:40px 0 92px;}
.faq-page-content .faq-list{max-width:860px;}
.faq-page-content .faq-item{
  border:1px solid rgba(14,58,92,.10);
  border-radius:18px;
  background:#fff;
  box-shadow:0 10px 28px rgba(7,49,62,.05);
}
.faq-page-content .faq-item summary{padding-inline:20px;}
.faq-page-content .faq-item p{padding-inline:20px;padding-bottom:20px;}
.faq-page-cta{display:flex;justify-content:center;margin-top:30px;}

/* Legacy pricing-section visibility support. Turning the global
   promotion flag off hides only campaign/pricing UI; product content remains. */

@media (max-width:720px){
  /* Keep the four trust items compact and side by side in a 2×2 mobile grid. */
  .confidence{padding-block:54px;}
  .confidence-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
    margin-top:24px;
  }
  .confidence-card{
    min-height:188px;
    padding:16px 14px;
    border-radius:18px;
  }
  .confidence-icon{
    width:40px;
    height:40px;
    margin-bottom:13px;
    border-radius:12px;
    font-size:18px;
  }
  .confidence-card h3{margin-bottom:7px;font-size:16px;line-height:1.35;}
  .confidence-card p{font-size:12.2px;line-height:1.62;}

  .faq-gateway{padding-block:50px;}
  .faq-gateway-card{gap:12px;padding:26px 18px;border-radius:22px;}
  .faq-gateway-card .section-title{font-size:clamp(25px,8vw,34px);}
  .faq-gateway-button{width:100%;min-width:0;}

  .standalone-hero{padding:34px 0 24px;}
  .standalone-back{margin-bottom:18px;font-size:13px;}
  .standalone-hero h1{font-size:34px;}
  .quote-page-section,.faq-page-content{padding-top:22px;padding-bottom:70px;}
  .quote-page .quote-form{padding:20px 16px;border-radius:20px;}
  .faq-page-content .faq-item summary{padding-inline:16px;font-size:15px;}
  .faq-page-content .faq-item p{padding-inline:16px;}
}

@media (max-width:360px){
  .confidence-card{min-height:196px;padding:15px 12px;}
  .confidence-card h3{font-size:15px;}
  .confidence-card p{font-size:11.5px;}
}

/* ========================================================================== 
   2026-08-07 — UX phase 3.3: compact mobile homepage
   Owner request: shorten the homepage, use 2×2 card grids where practical,
   and remove oversized vertical whitespace between homepage sections.
   Desktop/tablet layouts remain unchanged; these rules target phones only.
   ========================================================================== */
@media (max-width:720px){
  /* Compact section typography so headings do not create large vertical gaps. */
  .eyebrow{
    font-size:clamp(16px,4.8vw,20px) !important;
    line-height:1.25 !important;
    margin-bottom:5px !important;
  }
  .section-title{
    font-size:clamp(25px,7.2vw,32px) !important;
    line-height:1.18 !important;
  }
  .section-title.center{
    margin-inline:auto !important;
    margin-bottom:14px !important;
  }

  /* Remove general empty vertical space across the mobile homepage. */
  .why,
  .how{
    padding-block:28px !important;
  }
  .offers-section{
    padding-block:38px !important;
  }
  .products-section{
    padding-top:34px !important;
    padding-bottom:14px !important;
  }
  .comparison{
    padding-top:16px !important;
    padding-bottom:18px !important;
  }
  .confidence{
    padding-top:18px !important;
    padding-bottom:18px !important;
  }
  .campaign-gallery{
    padding-top:18px !important;
    padding-bottom:18px !important;
  }
  .order-process{
    padding-top:18px !important;
    padding-bottom:18px !important;
  }
  .faq-gateway{
    padding-top:18px !important;
    padding-bottom:26px !important;
  }

  /* Product area: trim only empty spacing, without removing product information. */
  .products-intro{
    margin-bottom:20px !important;
  }
  .products-lead{
    margin-top:8px !important;
  }
  .products-list{
    gap:22px !important;
  }
  .product-showcase{
    padding:13px !important;
  }

  /* 1) "Why AQUA FLORA" — four compact cards in a true 2×2 phone grid. */
  .why-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
  }
  .why-card{
    min-width:0;
    padding:12px 10px !important;
    border-radius:16px !important;
  }
  .why-icon{
    font-size:20px !important;
    line-height:1 !important;
    margin-bottom:7px !important;
  }
  .why-card h3{
    margin:0 0 5px !important;
    font-size:13.2px !important;
    line-height:1.38 !important;
  }
  .why-card p{
    margin:0 !important;
    font-size:10.5px !important;
    line-height:1.55 !important;
  }

  /* 2) Purification technology — 2 + 2 + one compact full-width fifth step. */
  .how-steps{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
    margin:0 !important;
    padding:0 !important;
    list-style:none !important;
  }
  .how-step{
    display:block !important;
    min-width:0 !important;
    min-height:0 !important;
    padding:12px 10px !important;
    border-top-width:3px !important;
    border-radius:16px !important;
  }
  .how-num{
    display:grid !important;
    place-items:center !important;
    width:34px !important;
    height:34px !important;
    margin:0 0 8px !important;
    border-radius:10px !important;
    font-size:12px !important;
    line-height:1 !important;
  }
  .how-step h3{
    margin:0 0 5px !important;
    font-size:12.4px !important;
    line-height:1.4 !important;
  }
  .how-step p{
    margin:0 !important;
    font-size:10.2px !important;
    line-height:1.52 !important;
  }
  .how-step:last-child{
    grid-column:1 / -1;
    display:grid !important;
    grid-template-columns:38px minmax(0,1fr) !important;
    grid-template-rows:auto auto !important;
    column-gap:10px !important;
    align-items:start !important;
  }
  .how-step:last-child .how-num{
    grid-row:1 / 3 !important;
    margin:0 !important;
  }
  .how-step:last-child h3{
    margin-top:0 !important;
  }

  /* 3) Comparison — specifically keep the gap from the previous section below 1 cm. */
  .comparison-intro{
    max-width:34rem !important;
    margin:0 auto 14px !important;
    font-size:12.5px !important;
    line-height:1.62 !important;
  }
  .comparison-help{
    gap:10px !important;
    margin-top:12px !important;
    padding:14px !important;
    border-radius:16px !important;
  }
  .comparison-help p{
    font-size:12px !important;
    line-height:1.6 !important;
  }
  .comparison-help .btn{
    min-height:44px !important;
    padding:10px 18px !important;
    font-size:13px !important;
  }

  /* 4) Trust/service cards — preserve 2×2, but make the whole section shorter. */
  .confidence-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
    margin-top:14px !important;
  }
  .confidence-card{
    min-width:0 !important;
    min-height:0 !important;
    padding:12px 10px !important;
    border-radius:16px !important;
  }
  .confidence-icon{
    width:34px !important;
    height:34px !important;
    margin-bottom:8px !important;
    border-radius:10px !important;
    font-size:15px !important;
  }
  .confidence-card h3{
    margin:0 0 5px !important;
    font-size:13.2px !important;
    line-height:1.38 !important;
  }
  .confidence-card p{
    margin:0 !important;
    font-size:10.4px !important;
    line-height:1.55 !important;
  }

  /* 5) Gallery — remove the large blank band before/after the section. */
  .gallery-heading{
    gap:8px !important;
    margin-bottom:14px !important;
  }
  .gallery-heading .eyebrow{
    margin-bottom:5px !important;
  }

  /* 6) Ordering process — four cards in a compact 2×2 phone grid. */
  .process-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
    margin:0 !important;
    padding:0 !important;
    list-style:none !important;
  }
  .process-grid li{
    display:block !important;
    min-width:0 !important;
    min-height:0 !important;
    padding:12px 10px !important;
    border-radius:16px !important;
  }
  .process-grid li > span{
    display:grid !important;
    place-items:center !important;
    width:34px !important;
    height:34px !important;
    margin:0 0 8px !important;
    border-radius:10px !important;
    font-size:12px !important;
    line-height:1 !important;
  }
  .process-grid h3{
    margin:0 0 5px !important;
    font-size:13.2px !important;
    line-height:1.38 !important;
  }
  .process-grid p{
    margin:0 !important;
    font-size:10.4px !important;
    line-height:1.55 !important;
  }

  /* 7) FAQ gateway — compact card and small transition from the process section. */
  .faq-gateway-card{
    gap:8px !important;
    padding:18px 14px !important;
    border-radius:20px !important;
  }
  .faq-gateway-card .eyebrow{
    margin:0 !important;
  }
  .faq-gateway-card .section-title{
    margin:0 !important;
    font-size:clamp(24px,7vw,30px) !important;
  }
  .faq-gateway-button{
    width:100% !important;
    min-width:0 !important;
    min-height:44px !important;
    margin-top:2px !important;
    padding:10px 18px !important;
    font-size:13px !important;
  }
}

@media (max-width:390px){
  /* Keep 2×2 layouts even on narrow iPhones while preserving legibility. */
  .why-grid,
  .how-steps,
  .confidence-grid,
  .process-grid{
    gap:7px !important;
  }
  .why-card,
  .how-step,
  .confidence-card,
  .process-grid li{
    padding:11px 9px !important;
  }
  .why-card h3,
  .confidence-card h3,
  .process-grid h3{
    font-size:12.5px !important;
  }
  .why-card p,
  .confidence-card p,
  .process-grid p{
    font-size:10px !important;
  }
  .how-step h3{font-size:11.8px !important;}
  .how-step p{font-size:9.7px !important;}
}

/* ========================================================================== 
   AQUA FLORA — Phase 4 mobile UX refinements — 2026-08-07
   ========================================================================== */

/* Phone numbers must remain readable inside RTL layouts. */
.footer-phone-link,
#footer-phone a{
  display:inline-block;
  direction:ltr !important;
  unicode-bidi:isolate !important;
  text-align:left;
  white-space:nowrap;
}

/* Discreet designer signature / watermark in the site footer. */
.site-designer-signature{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  margin-top:10px;
  color:rgba(207,224,234,.72);
  font-size:11px;
  line-height:1.35;
  text-align:center;
}
.site-designer-signature .designer-name{
  font-weight:700;
  letter-spacing:.035em;
}
.site-designer-signature .designer-telegram{
  display:inline-flex;
  align-items:center;
  gap:5px;
  color:rgba(207,224,234,.82);
  text-decoration:none;
  direction:ltr;
  unicode-bidi:isolate;
}
.site-designer-signature .designer-telegram:hover{color:#fff;}
.site-designer-signature .designer-telegram svg{flex:0 0 16px;}
.detail-footer .site-designer-signature{
  flex:1 0 100%;
  margin-top:8px;
}

/* Contact dock toggle — open on every fresh page load, collapsible by the visitor. */
.contact-dock{position:fixed;}
.contact-dock-toggle{
  position:absolute;
  z-index:4;
  inset-inline-end:8px;
  inset-block-start:-20px;
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  padding:0;
  border:1px solid rgba(8,54,67,.16);
  border-radius:999px;
  background:#fff;
  color:var(--color-deep,#0e3a5c);
  box-shadow:0 7px 20px rgba(5,39,48,.18);
  cursor:pointer;
  transition:transform .2s ease, background .2s ease, color .2s ease;
}
.contact-dock-toggle:hover{transform:translateY(-1px);}
.contact-dock-toggle-icon{font-size:22px;font-weight:900;line-height:1;transform:translateY(-1px);}
.contact-dock.is-collapsed .contact-dock-item{display:none !important;}
.contact-dock.is-collapsed .contact-dock-toggle{
  position:relative;
  inset:auto !important;
  width:58px;
  height:58px;
  border:0;
  background:#12667e;
  color:#fff;
  box-shadow:0 12px 30px rgba(5,39,48,.28);
}
.contact-dock.is-collapsed{
  display:grid !important;
  place-items:center;
  width:58px !important;
  min-width:58px !important;
  height:58px !important;
  min-height:58px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:999px !important;
  background:transparent !important;
  box-shadow:none !important;
  overflow:visible !important;
}

@media (max-width:720px){
  /* Pricing section now sits immediately after the hero products. */
  #hero + #offers,
  .hero + .offers-section{
    margin-top:0 !important;
    padding-top:10px !important;
  }
  .offers-section{
    padding-bottom:16px !important;
  }
  .offers-section + .trust-strip{
    margin-top:0 !important;
  }

  /* Product thumbnails: one compact, horizontal, touch-scrollable row.
     Extra images stay clipped outside the viewport and never create a second row. */
  .product-thumbnails{
    display:flex !important;
    flex-wrap:nowrap !important;
    justify-content:flex-start !important;
    align-items:center !important;
    gap:8px !important;
    width:100% !important;
    max-width:100% !important;
    margin-top:9px !important;
    padding:4px 2px 7px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    overscroll-behavior-inline:contain;
    scroll-snap-type:x proximity;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
    direction:ltr !important;
  }
  .product-thumbnails::-webkit-scrollbar{display:none !important;width:0;height:0;}
  .product-thumbnail{
    flex:0 0 clamp(58px,20vw,72px) !important;
    width:clamp(58px,20vw,72px) !important;
    height:clamp(58px,20vw,72px) !important;
    min-width:0 !important;
    aspect-ratio:1/1 !important;
    padding:3px !important;
    border-radius:12px !important;
    scroll-snap-align:start;
  }

  /* Open dock: rounded/oval cards, never sharp 90-degree rectangles. */
  .contact-dock:not(.is-collapsed){
    left:8px !important;
    right:8px !important;
    bottom:calc(var(--visual-viewport-bottom) + 7px) !important;
    width:auto !important;
    min-width:0 !important;
    max-width:none !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:6px !important;
    padding:7px !important;
    border:1px solid rgba(7,48,61,.12) !important;
    border-radius:22px !important;
    background:rgba(255,255,255,.96) !important;
    box-shadow:0 -7px 26px rgba(5,39,48,.18) !important;
    overflow:visible !important;
    backdrop-filter:blur(12px);
  }
  .contact-dock:not(.is-collapsed) .contact-dock-item{
    min-height:68px !important;
    padding:7px 4px !important;
    border-radius:17px !important;
  }
  .contact-dock:not(.is-collapsed) .contact-dock-toggle{
    inset-inline-end:12px !important;
    inset-block-start:-21px !important;
  }

  /* Collapsed state becomes a clear circular communication control. */
  .contact-dock.is-collapsed{
    left:auto !important;
    right:14px !important;
    top:auto !important;
    bottom:calc(var(--visual-viewport-bottom) + 14px) !important;
    inset-inline:auto !important;
    margin:0 !important;
  }
  html[dir="rtl"] .contact-dock.is-collapsed,
  html[dir="ltr"] .contact-dock.is-collapsed{
    right:14px !important;
    left:auto !important;
  }
  .contact-dock.is-collapsed .contact-dock-toggle::before{
    content:"💬";
    position:absolute;
    inset:0;
    display:grid;
    place-items:center;
    font-size:21px;
  }
  .contact-dock.is-collapsed .contact-dock-toggle-icon{
    position:absolute;
    right:5px;
    top:3px;
    display:grid;
    place-items:center;
    width:18px;
    height:18px;
    border-radius:50%;
    background:#fff;
    color:#12667e;
    font-size:13px;
    line-height:1;
  }
  body:has(.contact-dock.is-collapsed){
    padding-bottom:calc(72px + var(--visual-viewport-bottom)) !important;
  }

  .site-designer-signature{font-size:10.5px;margin-top:8px;}
}
.footer-contact-line{
  display:inline-block;
  direction:ltr !important;
  unicode-bidi:isolate !important;
  white-space:nowrap;
}
@media (max-width:720px){
  .product-thumbnail{
    flex-basis:clamp(64px,calc((100% - 24px)/4),82px) !important;
    width:clamp(64px,calc((100% - 24px)/4),82px) !important;
    height:clamp(64px,calc((100% - 24px)/4),82px) !important;
  }
  .contact-dock.is-collapsed{
    grid-template-columns:58px !important;
    grid-template-rows:58px !important;
  }
}


/* ========================================================================== 
   AQUA FLORA — Phase 5 footer density + compact mobile hero — 2026-08-07
   ========================================================================== */

/* Supplied footer banner replaces the former circular footer logo. */
.site-footer{
  padding-top:0 !important;
  overflow:hidden;
}
.footer-inner{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:20px !important;
  padding-bottom:24px !important;
}
.footer-brand{
  grid-column:1 / -1 !important;
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  width:100% !important;
  max-width:none !important;
}
.footer-banner-image{
  display:block;
  width:100vw !important;
  max-width:none !important;
  height:auto !important;
  aspect-ratio:16 / 9;
  object-fit:cover;
  margin-inline:calc(50% - 50vw) !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
.footer-bottom{
  padding-block:14px 18px !important;
}

/* Product/detail footers use the same brand banner instead of a round logo. */
.detail-footer{overflow:hidden;}
.detail-footer .container{gap:12px !important;}
.detail-footer-banner{
  flex:1 0 100%;
  display:block;
  width:100vw;
  max-width:none;
  height:auto;
  aspect-ratio:16 / 9;
  object-fit:cover;
  margin-inline:calc(50% - 50vw);
  border-radius:0;
}

@media (max-width:720px){
  /* Hero copy: keep the opening message dense and avoid a four-line headline. */
  .hero{
    padding-block:22px 24px !important;
  }
  .hero-inner{
    gap:18px !important;
  }
  .hero-copy .eyebrow{
    margin-bottom:6px !important;
    font-size:15px !important;
    line-height:1.35 !important;
  }
  .hero-copy h1{
    max-width:100% !important;
    margin-block:0 9px !important;
    font-size:clamp(25px,7.15vw,29px) !important;
    line-height:1.32 !important;
    letter-spacing:-.02em !important;
    text-wrap:balance;
  }
  html[lang="ar"] .hero-copy h1{
    font-size:clamp(24px,6.8vw,28px) !important;
  }
  .hero-sub{
    max-width:100% !important;
    margin-block:0 !important;
    font-size:13px !important;
    line-height:1.65 !important;
  }
  .hero-actions{
    margin-top:14px !important;
    gap:8px !important;
  }
  .hero-actions .btn{
    min-height:44px !important;
    padding-block:10px !important;
  }

  /* Footer: banner occupies the full width; the three information groups share one row. */
  .site-footer{
    padding-top:0 !important;
  }
  .site-footer .container.footer-inner{
    width:100% !important;
    max-width:none !important;
    padding-inline:0 !important;
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    align-items:start !important;
    gap:0 !important;
    padding-bottom:10px !important;
  }
  .footer-brand{
    grid-column:1 / -1 !important;
    margin:0 0 10px !important;
  }
  .footer-banner-image{
    width:100% !important;
    margin-inline:0 !important;
    aspect-ratio:16 / 9 !important;
  }
  .footer-col{
    min-width:0 !important;
    padding:7px 7px 9px !important;
    text-align:center !important;
  }
.footer-col h3{
    margin:0 0 7px !important;
    font-size:11.5px !important;
    line-height:1.35 !important;
    white-space:nowrap;
  }
  .footer-col ul{
    display:grid !important;
    gap:5px !important;
    justify-items:center !important;
  }
  .footer-col li,
  .footer-col a{
    max-width:100%;
    font-size:9.8px !important;
    line-height:1.35 !important;
    overflow-wrap:anywhere;
  }
  #footer-phone a{
    font-size:9.4px !important;
  }
  .footer-bottom{
    margin-top:0 !important;
    padding:9px 10px 13px !important;
    gap:6px !important;
  }
  .footer-bottom > p{
    margin:0 !important;
    font-size:9.5px !important;
  }
  .site-designer-signature{
    margin-top:3px !important;
    gap:2px !important;
    font-size:9.5px !important;
  }

  .detail-footer{
    padding-top:0 !important;
  }
  .detail-footer .container{
    padding-inline:0 !important;
    gap:8px !important;
  }
  .detail-footer-banner{
    width:100% !important;
    margin-inline:0 !important;
  }
}

@media (max-width:390px){
  html[lang="ar"] .hero-copy h1{
    font-size:24px !important;
    line-height:1.3 !important;
  }
  .footer-col{padding-inline:5px !important;}
  .footer-col h3{font-size:10.8px !important;}
  .footer-col li,.footer-col a{font-size:9.1px !important;}
  #footer-phone a{font-size:8.8px !important;}
}

/* AQUA FLORA — Phase 6 footer refinement — 2026-08-08 */
.footer-contact-item,
.footer-hours{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-width:0;
}
.footer-contact-icon{flex:0 0 auto; line-height:1; opacity:.95;}
.footer-hours-text{display:flex;flex-direction:column;gap:2px;align-items:center;line-height:1.3;}
.footer-services-col li{color:#a9c1cf;}
.site-designer-signature .designer-by{
  font-size:.88em;
  font-weight:500;
  opacity:.72;
  letter-spacing:.01em;
}
/* Banner is intentionally about 22% shorter than the original 16:9 block. */
.footer-banner-image,
.detail-footer-banner{
  aspect-ratio:16 / 7 !important;
  object-fit:cover !important;
  object-position:center 48% !important;
}
.footer-inner{grid-template-columns:repeat(4,minmax(0,1fr)) !important;}

@media (max-width:720px){
  /* Four compact footer groups in one row: quick links, contact, legal, services. */
  .site-footer .container.footer-inner{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    padding-bottom:4px !important;
  }
  .footer-brand{margin-bottom:6px !important;}
  .footer-banner-image{aspect-ratio:16 / 7 !important;}
  .footer-col{padding:6px 4px 7px !important;}
  .footer-col h3{font-size:10.4px !important;margin-bottom:6px !important;}
  .footer-col ul{gap:4px !important;}
  .footer-col li,.footer-col a{font-size:8.45px !important;line-height:1.28 !important;}
  #footer-phone a{font-size:8.25px !important;}
  .footer-contact-item,.footer-hours{gap:3px !important;}
  .footer-contact-icon{font-size:10px !important;}
  .footer-hours-text{gap:1px !important;}
  .footer-bottom{padding:7px 8px 9px !important;gap:3px !important;}
  .footer-bottom > p{font-size:8.7px !important;}
  .site-designer-signature{margin-top:2px !important;gap:1px !important;font-size:9px !important;}
  .site-designer-signature .designer-by{font-size:7.8px !important;}

  /* When collapsed, do not manufacture a white spacer below the footer. */
  body:has(.contact-dock.is-collapsed){padding-bottom:0 !important;}
  html:has(.contact-dock.is-collapsed){scroll-padding-bottom:24px !important;}
  /* Keep the circular contact control visibly above the browser chrome/footer edge. */
  .contact-dock.is-collapsed,
  html[dir="rtl"] .contact-dock.is-collapsed,
  html[dir="ltr"] .contact-dock.is-collapsed{
    right:14px !important;
    left:auto !important;
    bottom:calc(var(--visual-viewport-bottom) + 82px) !important;
  }
}
@media (max-width:390px){
  .footer-col{padding-inline:3px !important;}
  .footer-col h3{font-size:9.7px !important;}
  .footer-col li,.footer-col a{font-size:7.9px !important;}
  #footer-phone a{font-size:7.7px !important;}
}

/* AQUA FLORA — Phase 7 water header + footer/contact polish — 2026-08-08 */
/* Light custom water banner behind all primary site headers. The right side is deliberately quieter/lighter for maximum logo clarity. */
.site-header,
.detail-header,
.legal-header{
  background-color:#f5fbfe !important;
  background-image:linear-gradient(rgba(255,255,255,.08),rgba(255,255,255,.08)),linear-gradient(135deg,rgba(237,249,251,.94),rgba(223,242,245,.94) 52%,rgba(232,246,242,.94)) !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  border-bottom:1px solid rgba(14,58,92,.10) !important;
}
.site-header .brand-logo,
.detail-header .brand-logo,
.legal-header .brand-logo{
  filter:drop-shadow(0 2px 3px rgba(255,255,255,.95)) drop-shadow(0 2px 5px rgba(8,47,73,.16)) !important;
}
/* Keep controls readable over the water artwork without reverting to a solid white header. */
.site-header .lang-toggle,
.site-header .nav-toggle,
.detail-header .detail-language button,
.legal-header .detail-language button{
  background:rgba(255,255,255,.80) !important;
  border-color:rgba(14,58,92,.16) !important;
  box-shadow:0 5px 15px rgba(14,58,92,.06) !important;
  backdrop-filter:blur(7px) !important;
  -webkit-backdrop-filter:blur(7px) !important;
}

/* Restore a little more vertical breathing room to the supplied footer banner so its embedded headline is fully legible. */
.footer-banner-image,
.detail-footer-banner{
  aspect-ratio:16 / 8.5 !important;
  object-fit:cover !important;
  object-position:center center !important;
}

@media (max-width:720px){
  .site-header,
  .detail-header,
  .legal-header{
    background-position:center center !important;
  }
  .footer-banner-image,
  .detail-footer-banner{
    aspect-ratio:16 / 8.5 !important;
    object-position:center center !important;
  }

  /* Lower the collapsed contact button so it does not cover the quick-links copy in the footer. */
  .contact-dock.is-collapsed,
  html[dir="rtl"] .contact-dock.is-collapsed,
  html[dir="ltr"] .contact-dock.is-collapsed{
    right:14px !important;
    left:auto !important;
    bottom:calc(var(--visual-viewport-bottom) + 28px) !important;
  }
}

/* AQUA FLORA — Phase 7.1 footer contact alignment + smaller floating contact button — 2026-08-08 */
@media (max-width:720px){
  /* Contact column: keep all icons in one fixed left column regardless of text length. */
  #footer-contact ul{
    width:100% !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:5px !important;
  }
  #footer-contact li{
    width:100% !important;
  }
  #footer-contact .footer-contact-item,
  #footer-contact .footer-hours{
    width:100% !important;
    display:grid !important;
    grid-template-columns:16px minmax(0,1fr) !important;
    align-items:center !important;
    justify-content:start !important;
    justify-items:start !important;
    column-gap:7px !important;
    direction:ltr !important;
    text-align:left !important;
  }
  #footer-contact .footer-contact-icon{
    width:16px !important;
    min-width:16px !important;
    display:grid !important;
    place-items:center !important;
    justify-self:start !important;
    line-height:1 !important;
    font-size:14px !important;
  }
  #footer-contact .footer-contact-item > span:last-child,
  #footer-contact .footer-contact-item > .footer-contact-line{
    justify-self:start !important;
    text-align:left !important;
    direction:ltr !important;
    unicode-bidi:isolate !important;
    white-space:nowrap !important;
  }
  #footer-contact .footer-hours{
    align-items:start !important;
  }
  #footer-contact .footer-hours-text{
    justify-self:start !important;
    align-items:flex-start !important;
    text-align:right !important;
    direction:rtl !important;
    line-height:1.25 !important;
    gap:1px !important;
  }
  #footer-contact .footer-hours-text > span:last-child{
    direction:ltr !important;
    text-align:left !important;
  }

  /* Make the collapsed circular contact control a bit smaller and lighter. */
  .contact-dock.is-collapsed,
  html[dir="rtl"] .contact-dock.is-collapsed,
  html[dir="ltr"] .contact-dock.is-collapsed{
    width:50px !important;
    min-width:50px !important;
    height:50px !important;
    min-height:50px !important;
    bottom:calc(var(--visual-viewport-bottom) + 24px) !important;
  }
  .contact-dock.is-collapsed .contact-dock-toggle{
    width:50px !important;
    height:50px !important;
    min-width:50px !important;
    min-height:50px !important;
    box-shadow:0 10px 24px rgba(5,39,48,.24) !important;
  }
  .contact-dock.is-collapsed .contact-dock-toggle::before{
    font-size:18px !important;
  }
  .contact-dock.is-collapsed .contact-dock-toggle-icon{
    width:16px !important;
    height:16px !important;
    right:4px !important;
    top:3px !important;
    font-size:12px !important;
  }
}


/* AQUA FLORA — Phase 8 product cleanup + seamless footer blend — 2026-08-08 */
/* Product cards: after removing the long descriptive lines and third maintenance badge,
   keep the next block tight so no artificial blank band remains. */
.product-trust-badges{
  margin:10px 0 8px !important;
}
.product-key-facts{
  margin:8px 0 12px !important;
}
.product-price-box{
  margin-top:6px !important;
  margin-bottom:10px !important;
}

/* Treat the supplied footer banner and the navy footer as one continuous visual surface. */
.footer-brand{
  position:relative !important;
  overflow:hidden !important;
  margin-bottom:0 !important;
  background:#08243b !important;
}
.footer-brand::after{
  content:"";
  position:absolute;
  z-index:2;
  left:0;
  right:0;
  bottom:-1px;
  height:18%;
  pointer-events:none;
  background:linear-gradient(to bottom, rgba(8,36,59,0) 0%, rgba(8,36,59,.42) 55%, #08243b 100%);
}
.footer-banner-image{
  margin-bottom:-1px !important;
}
.site-footer .footer-col{
  position:relative;
  z-index:3;
}

@media (max-width:720px){
  .product-trust-badges{
    margin:8px 0 6px !important;
    gap:6px !important;
  }
  .product-key-facts{
    margin:6px 0 10px !important;
  }
  .product-price-box{
    margin:4px 0 8px !important;
  }
  .product-showcase .product-details{
    padding-top:0 !important;
  }
  .footer-brand{
    margin:0 !important;
  }
  .site-footer .container.footer-inner{
    row-gap:0 !important;
  }
  .footer-banner-image{
    display:block !important;
    margin-bottom:-1px !important;
  }
  .footer-brand::after{
    height:20% !important;
    background:linear-gradient(to bottom, rgba(8,36,59,0) 0%, rgba(8,36,59,.35) 45%, rgba(8,36,59,.82) 78%, #08243b 100%) !important;
  }
}

/* AQUA FLORA — Phase 9 seamless header-to-page blend — 2026-08-08 */
/* Remove the hard edge under the water header and feather its lower tones into the page. */
.site-header,
.detail-header,
.legal-header{
  border-bottom:0 !important;
  box-shadow:none !important;
}
.site-header{
  overflow:visible !important;
}
.site-header .header-inner{
  position:relative;
  z-index:2;
}
.site-header::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-58px;
  height:60px;
  pointer-events:none;
  z-index:1;
  background:linear-gradient(
    to bottom,
    rgba(158,215,235,.96) 0%,
    rgba(190,229,241,.82) 34%,
    rgba(220,241,246,.58) 66%,
    rgba(234,246,249,0) 100%
  );
}
.hero{
  background:linear-gradient(
    180deg,
    #d9eff6 0%,
    #e8f6f9 76px,
    #f5fbfb 190px,
    #e9f5f0 100%
  ) !important;
}
@media (max-width:720px){
  .site-header::after{
    bottom:-54px;
    height:56px;
    background:linear-gradient(
      to bottom,
      rgba(158,215,235,.96) 0%,
      rgba(191,229,241,.84) 35%,
      rgba(220,241,246,.58) 68%,
      rgba(234,246,249,0) 100%
    );
  }
  .hero{
    background:linear-gradient(
      180deg,
      #d9eff6 0%,
      #e9f6f9 64px,
      #f5fbfb 150px,
      #e9f5f0 100%
    ) !important;
  }
}

/* AQUA FLORA — Phase 9.1 hard-seam removal — 2026-08-08
   Remove the artificial feather strip completely. The header now ends directly
   into the hero with a 1px overlap so no horizontal seam can render. */
.site-header::after{
  content:none !important;
  display:none !important;
  background:none !important;
  height:0 !important;
}
.site-header{
  margin-bottom:0 !important;
  border-bottom:0 !important;
  box-shadow:none !important;
}
.hero{
  margin-top:-1px !important;
  border-top:0 !important;
  box-shadow:none !important;
}
@media (max-width:720px){
  /* On mobile the product visual is first in the hero. Remove the blank band
     between the water artwork and that visual while preserving side spacing. */
  .hero{
    padding-top:0 !important;
    margin-top:-1px !important;
    background:linear-gradient(180deg,#d8f0f6 0%,#eaf7f9 72px,#f5fbfb 150px,#e9f5f0 100%) !important;
  }
  .hero-inner{
    margin-top:0 !important;
    padding-top:0 !important;
  }
  .hero-media{
    margin-top:0 !important;
    padding-top:0 !important;
  }
}


/* AQUA FLORA — Phase 9.2 true header seam removal — 2026-08-08
   Fade INSIDE the header itself, then start the next section on the exact same color.
   No external strip, border or gap is created. */
.site-header,
.detail-header,
.legal-header{
  border-bottom:0 !important;
  box-shadow:none !important;
}
.site-header{
  position:relative !important;
  margin-bottom:0 !important;
  background-color:#d8f0f6 !important;
}
.site-header::after{
  content:none !important;
  display:none !important;
}
.site-header::before{
  content:"" !important;
  position:absolute !important;
  inset-inline:0 !important;
  bottom:0 !important;
  height:34% !important;
  pointer-events:none !important;
  z-index:1 !important;
  background:linear-gradient(
    to bottom,
    rgba(216,240,246,0) 0%,
    rgba(216,240,246,.32) 38%,
    rgba(216,240,246,.72) 72%,
    #d8f0f6 100%
  ) !important;
}
.site-header .header-inner{
  position:relative !important;
  z-index:2 !important;
}
.hero{
  margin-top:-1px !important;
  border-top:0 !important;
  box-shadow:none !important;
  background:linear-gradient(
    180deg,
    #d8f0f6 0%,
    #e7f5f8 90px,
    #f5fbfb 180px,
    #e9f5f0 100%
  ) !important;
}
@media (max-width:720px){
  .site-header::before{
    height:30% !important;
    background:linear-gradient(
      to bottom,
      rgba(216,240,246,0) 0%,
      rgba(216,240,246,.28) 34%,
      rgba(216,240,246,.70) 70%,
      #d8f0f6 100%
    ) !important;
  }
  .hero{
    margin-top:-1px !important;
    padding-top:0 !important;
    background:linear-gradient(
      180deg,
      #d8f0f6 0%,
      #e8f6f9 64px,
      #f5fbfb 145px,
      #e9f5f0 100%
    ) !important;
  }
  .hero-inner,
  .hero-media{
    margin-top:0 !important;
    padding-top:0 !important;
  }
}

/* AQUA FLORA — Phase 9.3 hero product panel color harmony — 2026-08-08
   Make the opening product panel visually continue the water-header palette. */
.hero-product-stage{
  background:
    radial-gradient(circle at 18% 6%, rgba(255,255,255,.98) 0 16%, rgba(255,255,255,0) 46%),
    linear-gradient(160deg, #f7fdff 0%, #e8f7fb 44%, #d8f0f6 72%, #e9f6f1 100%) !important;
  border:1px solid rgba(68,157,190,.22) !important;
  box-shadow:0 24px 60px rgba(34,109,137,.14) !important;
}
.hero-product-stage::before{
  background:radial-gradient(circle, rgba(72,181,216,.15), rgba(123,211,200,.08) 48%, transparent 72%) !important;
}
.hero-product-card,
.hero-product-krs,
.hero-product-lite{
  border-color:rgba(62,151,185,.18) !important;
  box-shadow:0 12px 30px rgba(39,114,143,.12) !important;
}
.hero-visual-copy{
  background:linear-gradient(135deg, rgba(9,73,101,.96) 0%, rgba(11,96,116,.95) 54%, rgba(17,111,105,.94) 100%) !important;
  border:1px solid rgba(158,229,220,.20) !important;
  box-shadow:0 14px 32px rgba(8,62,83,.16) !important;
}
.hero-visual-copy small{
  color:#b8f2df !important;
}
.hero-visual-copy p{
  color:rgba(240,252,252,.84) !important;
}
@media(max-width:720px){
  .hero-product-stage{
    background:
      radial-gradient(circle at 16% 3%, rgba(255,255,255,.98) 0 12%, rgba(255,255,255,0) 42%),
      linear-gradient(160deg, #f8feff 0%, #e9f8fb 42%, #d9f1f6 72%, #e9f6f1 100%) !important;
    border-color:rgba(68,157,190,.20) !important;
    box-shadow:0 18px 42px rgba(34,109,137,.12) !important;
  }
  .hero-visual-copy{
    background:linear-gradient(135deg, rgba(9,73,101,.97), rgba(11,96,116,.96) 56%, rgba(17,111,105,.95)) !important;
  }
}


/* AQUA FLORA — Phase 9.4 compact designer credit */
.site-designer-signature{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:center !important;
  flex-wrap:wrap !important;
  gap:6px !important;
  margin-top:2px !important;
  line-height:1.2 !important;
  font-size:10px !important;
}
.site-designer-signature .designer-name{display:none !important;}
.site-designer-signature .designer-by{
  font-size:10px !important;
  font-weight:500 !important;
  opacity:.78 !important;
  white-space:nowrap !important;
}
.site-designer-signature .designer-telegram{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:4px !important;
  font-size:10px !important;
  line-height:1.2 !important;
  color:rgba(207,224,234,.88) !important;
  text-decoration:none !important;
  white-space:nowrap !important;
}
.site-designer-signature .designer-telegram svg{
  width:14px !important;
  height:14px !important;
  flex:0 0 14px !important;
}
.site-designer-signature .designer-telegram:hover,
.site-designer-signature .designer-telegram:focus-visible{
  color:#fff !important;
  text-decoration:underline !important;
}
.detail-footer .site-designer-signature{
  flex:1 0 100% !important;
  margin-top:2px !important;
}
@media (max-width:720px){
  .site-designer-signature{
    gap:4px !important;
    margin-top:0 !important;
    font-size:8.4px !important;
  }
  .site-designer-signature .designer-by,
  .site-designer-signature .designer-telegram{
    font-size:8.4px !important;
  }
  .site-designer-signature .designer-telegram svg{
    width:12px !important;
    height:12px !important;
    flex-basis:12px !important;
  }
  .footer-bottom{
    gap:2px !important;
  }
}


/* AQUA FLORA — Phase 9.5 requested mobile refinements — 2026-08-08 */
/* Language dropdown must always sit above the open mobile navigation. */
@media (max-width:860px){
  .site-header .header-actions,
  .site-header .lang-switcher{position:relative !important;z-index:3350 !important;overflow:visible !important;}
  .site-header .lang-menu{z-index:3450 !important;}
  body.nav-open .site-header .lang-switcher{z-index:3500 !important;}
  body.nav-open .site-header .lang-menu.open{display:block !important;z-index:3600 !important;}
}

/* Trust strip: four compact cards in a balanced 2×2 phone grid. */
@media (max-width:720px){
  .trust-strip{padding:12px 0 !important;}
  .trust-grid{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
    align-items:stretch !important;
  }
  .trust-item{
    min-width:0 !important;
    min-height:78px !important;
    padding:10px 8px !important;
    border:1px solid rgba(190,232,235,.18) !important;
    border-radius:15px !important;
    background:linear-gradient(145deg,rgba(255,255,255,.10),rgba(111,210,200,.08)) !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:6px !important;
    text-align:center !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.08) !important;
    font-size:10.8px !important;
    line-height:1.38 !important;
  }
  .trust-icon{font-size:19px !important;line-height:1 !important;}
}
@media (max-width:390px){
  .trust-grid{gap:7px !important;}
  .trust-item{min-height:74px !important;padding:9px 6px !important;font-size:10px !important;}
  .trust-icon{font-size:18px !important;}
}

/* AQUA FLORA — Phase 9.6 products anchor precision — 2026-08-08
   When a visitor chooses Products / Explore our products, start at the
   products section itself instead of leaving the final purification stage
   visible above it. Phase 9.2 makes the site header non-sticky, so no anchor
   offset is required here. */
section#product,
#product.products-section{
  scroll-margin-top:0 !important;
  scroll-margin-block-start:0 !important;
}

/* ==========================================================================
   AQUA FLORA — Phase 9.7 gallery lightbox navigation + zoom
   ========================================================================== */
.gallery-lightbox{
  position:relative !important;
  overflow:hidden !important;
}
#gallery-lightbox-image{
  touch-action:none !important;
  user-select:none !important;
  -webkit-user-drag:none !important;
  will-change:transform;
  transform-origin:center center;
  transition:transform .14s ease-out;
}
.gallery-lightbox-nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:8;
  width:48px;
  height:48px;
  border:0;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.95);
  color:var(--color-deep);
  box-shadow:0 8px 24px rgba(0,0,0,.22);
  font-size:34px;
  line-height:1;
  cursor:pointer;
}
.gallery-lightbox-prev{left:14px;}
.gallery-lightbox-next{right:14px;}
.gallery-lightbox-count{
  position:absolute;
  left:50%;
  bottom:14px;
  transform:translateX(-50%);
  z-index:8;
  padding:6px 11px;
  border-radius:999px;
  background:rgba(6,47,59,.86);
  color:#fff;
  font-size:12px;
  font-weight:800;
  direction:ltr;
  unicode-bidi:isolate;
}
.gallery-lightbox-tools{
  position:absolute;
  top:12px;
  left:50%;
  transform:translateX(-50%);
  z-index:9;
  display:flex;
  align-items:center;
  gap:6px;
  padding:5px;
  border-radius:999px;
  background:rgba(6,35,52,.72);
  backdrop-filter:blur(8px);
}
.gallery-lightbox-tools button{
  height:36px;
  min-width:36px;
  padding:0 9px;
  border:1px solid rgba(255,255,255,.24);
  border-radius:999px;
  background:rgba(255,255,255,.95);
  color:var(--color-deep);
  font-weight:900;
  font-size:17px;
  cursor:pointer;
}
.gallery-lightbox-tools .gallery-lightbox-reset{font-size:11px;}
@media(max-width:720px){
  .gallery-lightbox-nav{width:42px;height:42px;font-size:30px;}
  .gallery-lightbox-prev{left:8px;}.gallery-lightbox-next{right:8px;}
  .gallery-lightbox-count{bottom:10px;font-size:11px;}
  .gallery-lightbox-tools{top:8px;}
  .gallery-lightbox-tools button{height:32px;min-width:32px;font-size:15px;padding:0 7px;}
  .gallery-lightbox-tools .gallery-lightbox-reset{font-size:10px;}
}


/* ==========================================================================
   AQUA FLORA — Phase 9.8 gallery modal reliability
   ========================================================================== */
.gallery-lightbox[open]{
  position:fixed !important;
  inset:0 !important;
  margin:auto !important;
  width:min(94vw,1100px) !important;
  max-width:94vw !important;
  height:min(92dvh,900px) !important;
  max-height:92dvh !important;
  padding:clamp(10px,2vw,18px) !important;
  display:grid !important;
  place-items:center !important;
  overflow:hidden !important;
  border:0 !important;
  border-radius:20px !important;
  background:#071a2a !important;
  z-index:2147483000 !important;
}
.gallery-lightbox[open] #gallery-lightbox-image{
  display:block !important;
  width:auto !important;
  height:auto !important;
  max-width:100% !important;
  max-height:calc(92dvh - 28px) !important;
  object-fit:contain !important;
  opacity:1 !important;
  visibility:visible !important;
  position:relative !important;
  z-index:2 !important;
}
.gallery-lightbox[open] .gallery-lightbox-close{z-index:12 !important;}
.gallery-lightbox[open] .gallery-lightbox-nav,
.gallery-lightbox[open] .gallery-lightbox-count,
.gallery-lightbox[open] .gallery-lightbox-tools{z-index:11 !important;}
@media(max-width:720px){
  .gallery-lightbox[open]{
    width:96vw !important;
    max-width:96vw !important;
    height:90dvh !important;
    max-height:90dvh !important;
    border-radius:16px !important;
  }
  .gallery-lightbox[open] #gallery-lightbox-image{
    max-height:calc(90dvh - 24px) !important;
  }
}


/* AQUA FLORA — Phase 9.9 natural lightbox zoom + designer-credit order */
.gallery-lightbox-tools{display:none !important;}
.gallery-lightbox-nav,.gallery-lightbox-close{touch-action:manipulation !important;-webkit-user-select:none !important;user-select:none !important;}
#gallery-lightbox-image{touch-action:none !important;-webkit-touch-callout:none !important;}
.site-designer-signature{direction:ltr !important;flex-direction:row !important;flex-wrap:wrap !important;}
.site-designer-signature .designer-by{order:1 !important;direction:ltr !important;unicode-bidi:isolate !important;}
.site-designer-signature .designer-telegram{order:2 !important;direction:ltr !important;unicode-bidi:isolate !important;}

/* PHASE 11 PERFORMANCE: mobile header background uses a smaller pre-optimized asset. */
@media (max-width:720px){.site-header,.detail-header,.legal-header{background-image:linear-gradient(rgba(255,255,255,.08),rgba(255,255,255,.08)),linear-gradient(135deg,rgba(237,249,251,.94),rgba(223,242,245,.94) 52%,rgba(232,246,242,.94)) !important;}}

/* phase14-1-logo-fix — ensure transparent logo artwork stays clean on water header */
.site-header .brand-logo,
.detail-header .brand-logo,
.legal-header .brand-logo,
.footer-brand-logo{
  background: transparent !important;
  mix-blend-mode: normal !important;
}


/* AQUA FLORA — Phase 17 — fixed pricing cleanup */
.pricing-section .offer-content{max-width:980px;margin-inline:auto;text-align:center;}
.pricing-section .offer-intro{margin-inline:auto;}
.pricing-section .offer-benefits{max-width:720px;margin-inline:auto;}
.pricing-section .offer-benefits li{justify-content:center;}
.pricing-section .offer-actions{justify-content:center;}
.pricing-section .offer-price-card small{justify-content:center;text-align:center;color:var(--color-deep);opacity:.78;}
.product-price-box.product-price-fixed{display:inline-flex;align-items:center;justify-content:center;min-width:132px;}
.product-price-box.product-price-fixed strong{font-size:30px;line-height:1;color:var(--color-deep);}
.comparison-price-row td strong{display:block;color:var(--color-deep);}


/* Phase 18 — purchase-flow reorder: compact conversion CTA after confidence */
.conversion-cta{
  padding:0 0 clamp(52px,6vw,76px);
  background:linear-gradient(180deg,#eef8f6 0%,#f8fcfb 100%);
}
.conversion-cta-card{
  max-width:920px;
  margin-inline:auto;
  padding:clamp(18px,2.4vw,28px);
  border:1px solid rgba(14,58,92,.10);
  border-radius:24px;
  background:#fff;
  box-shadow:0 18px 42px -30px rgba(8,53,65,.38);
}
.conversion-cta .offer-actions{
  justify-content:center;
  margin-top:0;
}
.conversion-cta .btn{
  min-width:min(100%,280px);
}
@media(max-width:720px){
  .conversion-cta{padding:0 0 52px;}
  .conversion-cta-card{padding:14px;border-radius:20px;}
  .conversion-cta .offer-actions{display:grid;grid-template-columns:1fr;gap:10px;}
  .conversion-cta .offer-actions .btn{width:100%;min-height:52px;}
}


/* Phase 19 — Final polish: unified vector icons, CTA hierarchy and mobile rhythm */
.ui-icon{width:1em;height:1em;display:block;overflow:visible;pointer-events:none}
.trust-icon,.why-icon,.confidence-icon,.footer-contact-icon{display:inline-flex;align-items:center;justify-content:center}
.trust-icon .ui-icon{width:24px;height:24px}
.why-icon .ui-icon{width:29px;height:29px}
.confidence-icon .ui-icon{width:25px;height:25px}
.footer-contact-icon .ui-icon{width:18px;height:18px}
.contact-dock-item>span[aria-hidden="true"]{display:inline-flex;align-items:center;justify-content:center}
.contact-dock-item>span[aria-hidden="true"] .ui-icon{width:20px;height:20px}
.conversion-cta-card{display:grid;gap:18px;text-align:center}
.conversion-cta-copy{max-width:720px;margin-inline:auto}
.conversion-cta-copy h2{margin:0 0 7px;color:var(--color-deep);font-size:clamp(22px,3vw,30px);line-height:1.3}
.conversion-cta-copy p{margin:0;color:#49636d;font-size:15px;line-height:1.75}
.conversion-cta .offer-actions{margin-top:0}
.why-card p,.confidence-card p{max-width:34ch;margin-inline:auto}
@media(max-width:720px){
  .comparison,.how,.why,.confidence,.campaign-gallery,.order-process,.products-section{scroll-margin-top:86px}
  .conversion-cta{padding-block:30px}
  .conversion-cta-card{gap:14px}
  .conversion-cta-copy h2{font-size:22px}
  .conversion-cta-copy p{font-size:13px;line-height:1.65}
  .conversion-cta .offer-actions{gap:10px}
  .conversion-cta .offer-actions .btn{min-height:52px}
  .why-card p,.confidence-card p{max-width:31ch}
}
@media(max-width:390px){
  .trust-icon .ui-icon{width:21px;height:21px}
  .why-icon .ui-icon{width:26px;height:26px}
  .confidence-icon .ui-icon{width:23px;height:23px}
  .comparison-table th,.comparison-table td{padding-inline:12px}
}


/* ==========================================================================
   Phase 20.3 — CTA cleanup & mobile navigation polish
   ========================================================================== */
.nav-menu-icon,.nav-mobile-extra{display:none;}
@media (max-width:860px){
  .main-nav ul{padding-bottom:10px !important;}
  .main-nav li{width:100%;}
  .main-nav a{gap:12px !important;border-radius:12px;transition:background-color .18s ease,transform .18s ease;}
  .main-nav a:hover,.main-nav a:focus-visible{background:#f2f8f7;transform:translateX(2px);}
  [dir="rtl"] .main-nav a:hover,[dir="rtl"] .main-nav a:focus-visible{transform:translateX(-2px);}
  .nav-menu-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 36px;width:36px;height:36px;border-radius:11px;background:#edf7f4;color:var(--color-deep);}
  .nav-menu-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
  .nav-menu-label{flex:1;}
  .nav-mobile-extra{display:block;max-width:var(--container-w);margin:0 auto;padding:8px var(--page-pad) max(28px,env(safe-area-inset-bottom));background:#fff;}
  .nav-mobile-trust{margin:0 0 14px;padding:13px 14px;border-radius:14px;background:linear-gradient(135deg,#f1f8f6,#f5fafc);color:var(--color-ink-soft);font-size:12.5px;line-height:1.7;text-align:center;border:1px solid rgba(25,125,99,.10);}
  .nav-mobile-cta{display:flex !important;justify-content:center !important;align-items:center !important;min-height:50px !important;border:0 !important;border-radius:999px !important;color:#fff !important;}
}


/* ==========================================================================
   AQUA FLORA — Phase 20.5 visual consistency, menu icons & mobile legibility
   ========================================================================== */
@media (max-width:860px){
  /* Transparent, consistent menu glyphs. */
  .nav-menu-icon{
    background:transparent !important;
    border:0 !important;
    border-radius:0 !important;
    width:28px !important;
    height:28px !important;
    flex-basis:28px !important;
    color:var(--color-deep) !important;
    opacity:.68;
  }
  .nav-menu-icon svg{width:21px !important;height:21px !important;}
  .main-nav a:hover .nav-menu-icon,.main-nav a:focus-visible .nav-menu-icon{opacity:1;}
  .nav-mobile-cta,.nav-mobile-cta:visited,.nav-mobile-cta:hover,.nav-mobile-cta:focus-visible{
    color:#fff !important;
    font-weight:900 !important;
  }
  .nav-cta-icon{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;margin-inline-end:8px;color:currentColor;opacity:.92;}
  .nav-cta-icon svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
}

/* Slightly larger purification-step typography, with extra emphasis for step 05. */
@media (max-width:720px){
  .how-step h3{font-size:13.2px !important;line-height:1.42 !important;}
  .how-step p{font-size:10.8px !important;line-height:1.58 !important;}
  .how-step:last-child h3{font-size:13.8px !important;}
  .how-step:last-child p{font-size:11px !important;}
}
@media (max-width:390px){
  .how-step h3{font-size:12.7px !important;}
  .how-step p{font-size:10.3px !important;}
  .how-step:last-child h3{font-size:13.3px !important;}
  .how-step:last-child p{font-size:10.6px !important;}
}

/* Comfortable touch targets on mobile. */
@media (max-width:860px){
  .nav-toggle,.product-gallery-arrow,.product-zoom-button,.gallery-arrow,.gallery-lightbox-nav,.gallery-lightbox-close,.detail-arrow,.detail-zoom{
    min-width:44px !important;
    min-height:44px !important;
    touch-action:manipulation;
  }
}

/* Consistent footer SVG glyph sizing on every page. */
.footer-contact-icon[data-icon="phase20-5-svg"]{display:inline-flex;align-items:center;justify-content:center;opacity:.9;}
.footer-contact-icon[data-icon="phase20-5-svg"] .ui-icon{width:18px;height:18px;}

/* ========================================================================== 
   AQUA FLORA — Phase 20.7 Accessibility Hotfix — 2026-08-10
   Scope: footer/contact contrast + footer/mobile-navigation touch targets only.
   ========================================================================== */
/* Improve contrast of secondary footer/contact copy against the navy footer. */
.site-footer .footer-col a,
.site-footer .footer-col li,
.site-footer .footer-services-col li,
.site-footer .footer-contact-item,
.site-footer .footer-hours,
.site-footer .footer-contact-line{
  color:#cfe0ea !important;
}
.site-footer .site-designer-signature{
  color:#cfe0ea !important;
}
.site-footer .site-designer-signature .designer-telegram{
  color:#dbe9f0 !important;
}

/* Preserve the compact visual footer while giving interactive links a WCAG-sized hit area. */
@media (max-width:860px){
  .site-footer .footer-col a,
  .site-footer .site-designer-signature .designer-telegram{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:44px !important;
    min-width:44px !important;
    padding:10px 4px !important;
    margin-block:-8px !important;
    line-height:1.35 !important;
    touch-action:manipulation;
  }
  #footer-contact .footer-contact-item[href]{
    display:grid !important;
    min-height:44px !important;
    padding-block:10px !important;
    margin-block:-8px !important;
  }
  .main-nav a{
    min-height:44px !important;
    padding-block:8px !important;
    touch-action:manipulation;
  }
}


/* ========================================================================== 
   AQUA FLORA — Phase 20.7.1 Mobile Footer Clarity + KRS-39 Image 02 — 2026-08-10
   Scope: mobile footer contrast/layout/icons/copyright/designer signature only.
   ========================================================================== */
.site-footer .footer-col h3{
  color:#ffffff !important;
}
.site-footer .footer-col a,
.site-footer .footer-col li,
.site-footer .footer-services-col li,
.site-footer .footer-contact-item,
.site-footer .footer-hours,
.site-footer .footer-contact-line{
  color:#e7f1f6 !important;
  opacity:1 !important;
}
.site-footer .footer-contact-icon[data-icon="phase20-5-svg"]{
  color:#f2f8fb !important;
  opacity:1 !important;
}
.site-footer .footer-bottom > p{
  color:#f2f8fb !important;
  opacity:1 !important;
}
.site-footer .site-designer-signature,
.site-footer .site-designer-signature .designer-by{
  color:#dcebf2 !important;
  opacity:1 !important;
}
.site-footer .site-designer-signature .designer-telegram{
  color:#ffffff !important;
  opacity:1 !important;
}


/* ========================================================================== 
   AQUA FLORA — Phase 20.7.12 Final Clean Mobile Footer — 2026-08-10
   Single-source mobile footer rules. Exactly three detached separators.
   Legacy Phase 20.7.1 mobile borders and Phase 20.7.2–20.7.10 footer
   overrides are removed so no separator can be drawn twice.
   ========================================================================== */
@media (max-width:720px){
  .site-footer{ padding-top:0 !important; }

  .site-footer .container.footer-inner{
    width:100% !important;
    max-width:none !important;
    padding-inline:0 !important;
    padding-bottom:2px !important;
    display:grid !important;
    /* RTL visual order: Quick Links | Contact | Legal | Services */
    grid-template-columns:minmax(0,1.04fr) minmax(0,1.32fr) minmax(0,.81fr) minmax(0,.83fr) !important;
    column-gap:0 !important;
    row-gap:0 !important;
    align-items:stretch !important;
  }

  .site-footer .footer-brand{
    grid-column:1 / -1 !important;
    margin:0 !important;
  }

  .site-footer .footer-banner-image,
  .site-footer .detail-footer-banner{
    display:block !important;
    width:100% !important;
    height:auto !important;
    aspect-ratio:16 / 9.15 !important;
    object-fit:cover !important;
    object-position:center center !important;
    margin-bottom:-1px !important;
  }

  .site-footer .footer-col{
    position:relative !important;
    min-width:0 !important;
    min-height:0 !important;
    height:auto !important;
    align-self:stretch !important;
    box-sizing:border-box !important;
    padding:24px 5px 8px !important;
    text-align:center !important;
    border:0 !important;
    border-left:0 !important;
    border-right:0 !important;
    border-inline-start:0 !important;
    border-inline-end:0 !important;
    box-shadow:none !important;
    background-image:none !important;
  }

  /* Kill every legacy pseudo-line first. */
  .site-footer .footer-col::before,
  .site-footer .footer-col::after,
  .site-footer .footer-services-col::before,
  .site-footer .footer-services-col::after{
    content:none !important;
    display:none !important;
    border:0 !important;
    box-shadow:none !important;
    background:none !important;
  }

  /* Draw exactly ONE separator on the start edge of columns 2, 3 and 4. */
  .site-footer .footer-col + .footer-col::before{
    content:"" !important;
    display:block !important;
    position:absolute !important;
    inset-inline-start:0 !important;
    inset-inline-end:auto !important;
    top:18px !important;
    bottom:18px !important;
    width:1px !important;
    height:auto !important;
    border:0 !important;
    box-shadow:none !important;
    background:rgba(231,241,246,.28) !important;
    pointer-events:none !important;
    z-index:1 !important;
  }

  .site-footer .footer-col h3{
    min-height:38px !important;
    margin:0 0 10px !important;
    display:flex !important;
    align-items:flex-start !important;
    justify-content:center !important;
    font-size:12px !important;
    line-height:1.35 !important;
    font-weight:700 !important;
  }

  .site-footer .footer-col ul{
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    gap:0 !important;
    margin:0 !important;
    padding:0 !important;
  }

  .site-footer .footer-col li{
    min-height:34px !important;
    margin:0 !important;
    padding:0 !important;
    display:flex !important;
    align-items:flex-start !important;
    justify-content:center !important;
    font-size:10px !important;
    line-height:1.35 !important;
  }

  .site-footer .footer-col a,
  .site-footer #footer-phone a{
    min-height:34px !important;
    padding:4px 1px !important;
    margin:0 !important;
    display:flex !important;
    align-items:flex-start !important;
    justify-content:center !important;
    text-align:center !important;
    font-size:10px !important;
    line-height:1.35 !important;
  }

  .site-footer #footer-contact{ padding-inline:6px !important; }
  .site-footer #footer-contact ul,
  .site-footer #footer-contact li{ width:100% !important; box-sizing:border-box !important; }

  .site-footer #footer-contact .footer-contact-item,
  .site-footer #footer-contact .footer-hours{
    width:100% !important;
    box-sizing:border-box !important;
    display:grid !important;
    grid-template-columns:19px minmax(0,1fr) !important;
    column-gap:5px !important;
    align-items:start !important;
    justify-content:stretch !important;
    direction:ltr !important;
    margin:0 !important;
    padding:4px 0 !important;
  }

  .site-footer #footer-contact .footer-contact-icon{
    grid-column:1 !important;
    width:19px !important;
    min-width:19px !important;
    height:19px !important;
    margin:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
  }

  .site-footer #footer-contact .footer-contact-icon .ui-icon{
    width:18px !important;
    height:18px !important;
  }

  .site-footer #footer-contact .footer-contact-item > span:last-child,
  .site-footer #footer-contact .footer-hours-text{
    grid-column:2 !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    margin:0 !important;
    padding:0 !important;
    text-align:start !important;
    line-height:1.35 !important;
  }

  .site-footer #footer-contact a.footer-contact-item{ white-space:nowrap !important; }
  .site-footer #footer-contact .footer-hours-text{
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:0 !important;
  }

  html[lang="ar"] .site-footer #footer-contact .footer-hours-text,
  html[lang="ar"] .site-footer #footer-contact .footer-hours-text > span{
    font-size:13px !important;
    line-height:1.35 !important;
    font-weight:500 !important;
  }

  .site-footer .footer-bottom{
    grid-column:1 / -1 !important;
    margin-top:0 !important;
    padding:12px 14px 16px !important;
    gap:6px !important;
    border-top:1px solid rgba(231,241,246,.22) !important;
  }
  .site-footer .footer-bottom > p{
    margin:0 !important;
    color:#f7fbfd !important;
    opacity:1 !important;
    font-size:11.5px !important;
    line-height:1.45 !important;
    font-weight:600 !important;
    text-align:center !important;
  }
  .site-footer .site-designer-signature{
    margin:0 !important;
    gap:5px !important;
    color:#e8f2f7 !important;
    opacity:1 !important;
    font-size:10.5px !important;
    line-height:1.4 !important;
    justify-content:center !important;
    align-items:center !important;
  }
}

@media (max-width:390px){
  .site-footer .container.footer-inner{
    grid-template-columns:minmax(0,1.04fr) minmax(0,1.32fr) minmax(0,.81fr) minmax(0,.83fr) !important;
  }
  .site-footer .footer-banner-image,
  .site-footer .detail-footer-banner{ aspect-ratio:16 / 9.35 !important; }
  .site-footer .footer-col{ padding:22px 5px 7px !important; }
  .site-footer .footer-col + .footer-col::before{ top:17px !important; bottom:17px !important; }
  .site-footer .footer-col h3{ font-size:11.5px !important; }
  .site-footer .footer-col li,
  .site-footer .footer-col a,
  .site-footer #footer-phone a{ font-size:9.5px !important; }
  .site-footer #footer-contact{ padding-inline:4px !important; }
  .site-footer #footer-contact .footer-contact-item,
  .site-footer #footer-contact .footer-hours{
    grid-template-columns:18px minmax(0,1fr) !important;
    column-gap:4px !important;
  }
  .site-footer #footer-contact .footer-contact-icon,
  .site-footer #footer-contact .footer-contact-icon .ui-icon{
    width:17px !important;
    height:17px !important;
    min-width:17px !important;
  }
  html[lang="ar"] .site-footer #footer-contact .footer-hours-text,
  html[lang="ar"] .site-footer #footer-contact .footer-hours-text > span{
    font-size:12.5px !important;
  }
}

/* ==========================================================================
   AQUA FLORA — Phase 20.7.13 Arabic Footer Hours Alignment — 2026-08-10
   Keep the clock row on the same text axis as phone/email.
   ========================================================================== */
@media (max-width:720px){

  html[lang="ar"] .site-footer #footer-contact .footer-hours{
    align-items:center !important;
  }

  html[lang="ar"] .site-footer #footer-contact .footer-hours-text{
    width:100% !important;
    min-width:0 !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:center !important;
    gap:0 !important;
    text-align:left !important;
  }

  /* Arabic label: preserve RTL reading order but anchor it to the same
     left edge used by the email and phone text lane. */
  html[lang="ar"] .site-footer #footer-contact .footer-hours-text > span:first-child{
    display:block !important;
    width:100% !important;
    direction:rtl !important;
    unicode-bidi:plaintext !important;
    text-align:left !important;
    white-space:nowrap !important;
    margin:0 !important;
  }

  /* Time remains LTR and starts from the exact same text axis. */
  html[lang="ar"] .site-footer #footer-contact .footer-hours-text > span:last-child{
    display:block !important;
    width:100% !important;
    direction:ltr !important;
    text-align:left !important;
    white-space:nowrap !important;
    margin:0 !important;
  }
}

@media (max-width:390px){
  html[lang="ar"] .site-footer #footer-contact .footer-hours-text > span:first-child,
  html[lang="ar"] .site-footer #footer-contact .footer-hours-text > span:last-child{
    letter-spacing:0 !important;
  }
}

/* ==========================================================================
   AQUA FLORA — Phase 20.7.14 Mobile Contact Vertical Rhythm — 2026-08-10
   Align contact rows visually with the Legal column:
   phone ≈ Privacy, email ≈ Terms, hours between Cookies and Disclaimer.
   ========================================================================== */
@media (max-width:720px){

  /* Use a controlled row rhythm for Contact instead of inherited touch-target
     heights/gaps from older accessibility rules. */
  .site-footer #footer-contact ul{
    display:grid !important;
    grid-template-rows:34px 34px auto !important;
    row-gap:0 !important;
    align-content:start !important;
  }

  .site-footer #footer-contact li{
    width:100% !important;
    min-height:0 !important;
    height:auto !important;
    margin:0 !important;
    padding:0 !important;
    display:block !important;
  }

  /* Phone: first visual row. */
  .site-footer #footer-contact li:nth-child(1){
    grid-row:1 !important;
  }

  /* Email: second visual row, level with "الشروط والأحكام". */
  .site-footer #footer-contact li:nth-child(2){
    grid-row:2 !important;
  }

  /* Hours: start a little below row 3 so the two-line block sits visually
     between "سياسة ملفات تعريف الارتباط" and "إخلاء المسؤولية". */
  .site-footer #footer-contact li:nth-child(3){
    grid-row:3 !important;
    margin-top:9px !important;
  }

  .site-footer #footer-contact .footer-contact-item,
  .site-footer #footer-contact .footer-hours{
    min-height:0 !important;
    height:auto !important;
    padding:0 !important;
    margin:0 !important;
    align-items:center !important;
  }

  /* Defeat the older 44px mobile hit-area rule only inside this compact
     footer contact list; links remain visually clear and separated. */
  .site-footer #footer-contact a.footer-contact-item{
    min-height:0 !important;
    padding:0 !important;
  }

  /* Keep all three icons on one exact vertical lane. */
  .site-footer #footer-contact .footer-contact-icon{
    align-self:center !important;
  }

  /* Arabic hours: compact two-line block, same text lane as phone/email. */
  html[lang="ar"] .site-footer #footer-contact .footer-hours-text{
    justify-content:flex-start !important;
    line-height:1.25 !important;
  }

  html[lang="ar"] .site-footer #footer-contact .footer-hours-text > span:first-child,
  html[lang="ar"] .site-footer #footer-contact .footer-hours-text > span:last-child{
    line-height:1.25 !important;
  }
}

@media (max-width:390px){
  .site-footer #footer-contact ul{
    grid-template-rows:32px 32px auto !important;
  }

  .site-footer #footer-contact li:nth-child(3){
    margin-top:8px !important;
  }
}


/* ========================================================================== 
   AQUA FLORA — Care DEV Phase 1.2.2 proportional footer banner fix
   Root cause: legacy 100vw breakout + forced aspect-ratio + object-fit:cover
   caused the banner to stay visually oversized and crop while the viewport
   or browser zoom changed. The banner now follows its container and keeps the
   source image's intrinsic ratio on desktop and mobile.
   ========================================================================== */
.site-footer .footer-brand{
  width:100% !important;
  max-width:100% !important;
  margin-inline:0 !important;
}
.site-footer .footer-banner-image,
.detail-footer-banner{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  aspect-ratio:auto !important;
  object-fit:contain !important;
  object-position:center center !important;
  margin:0 !important;
  margin-inline:0 !important;
  border-radius:0 !important;
}
@media (max-width:720px){
  .site-footer .footer-banner-image,
  .detail-footer-banner{
    width:100% !important;
    max-width:100% !important;
    height:auto !important;
    aspect-ratio:auto !important;
    object-fit:contain !important;
    object-position:center center !important;
    margin:0 !important;
  }
}

/* ========================================================================== 
   AQUA FLORA — Phase 1.3.1 Universal Responsive Adaptation — 2026-08-13
   Goal: fluid layout across phones, tablets, laptops, desktops, browser zoom.
   ========================================================================== */
html,body{min-width:0!important;width:100%;max-width:100%;overflow-x:hidden}
@supports (overflow:clip){html,body{overflow-x:clip}}
:root{--page-pad:clamp(12px,2.8vw,28px);--container-w:1280px}
.container{width:min(100%,var(--container-w));max-width:100%;padding-inline:var(--page-pad)!important;margin-inline:auto}
:where(.hero-inner,.product-inner,.product-showcase,.why-grid,.how-steps,.trust-grid,.testimonial-grid,.contact-inner,.footer-inner,.comparison-wrap,.products-list)>*{min-width:0}
:where(h1,h2,h3,h4,p,li,a,button,span,small,strong,dt,dd){overflow-wrap:anywhere}
img,video,svg,canvas,iframe{max-width:100%;height:auto}

/* Fluid type/spacing so zoom and mid-size screens stay balanced. */
.section-title{font-size:clamp(24px,3vw,38px)}
.hero-copy h1{font-size:clamp(30px,4.8vw,54px)}
.hero-sub{font-size:clamp(15px,1.7vw,17px)}
.btn{min-height:42px;padding-inline:clamp(16px,2.4vw,28px)}

/* Remove fixed minimums that can force horizontal overflow. */
.product-showcase{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr)!important}
.product-gallery,.product-details,.product-configurations,.product-configuration{min-width:0!important}
.comparison-wrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.comparison-table{max-width:none}

/* Footer: proportional banner + readable adaptive columns. */
.site-footer,.site-footer .footer-brand{width:100%!important;max-width:100%!important}
.site-footer .footer-banner-image,.site-footer .detail-footer-banner,.detail-footer-banner{display:block!important;width:100%!important;max-width:100%!important;height:auto!important;aspect-ratio:auto!important;object-fit:contain!important;object-position:center!important;margin:0!important}

@media (max-width:1180px){
  .product-showcase{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)!important;gap:clamp(20px,3vw,34px)}
  .main-nav ul{gap:clamp(12px,2vw,20px)}
}
@media (max-width:960px){
  .product-showcase{grid-template-columns:1fr!important}
  .product-gallery{order:1!important;width:min(100%,620px)!important;max-width:620px!important}
  .product-details{order:2!important}
  html[dir="rtl"] .product-gallery{order:1!important}
  html[dir="rtl"] .product-details{order:2!important}
  .products-container{max-width:920px}
  .why-grid,.how-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .testimonial-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:860px){
  .header-inner{min-width:0}
  .header-actions{margin-inline-start:auto;min-width:0}
  .main-nav{max-height:calc(100dvh - var(--header-h));overflow-y:auto;overscroll-behavior:contain}
  .hero-inner,.product-inner,.contact-inner{grid-template-columns:1fr!important}
  .hero-media,.product-media{width:min(100%,660px);margin-inline:auto}
  .hero-image{aspect-ratio:auto;max-height:none;object-fit:contain;background:#fff}
}
@media (max-width:720px){
  :root{--page-pad:clamp(12px,4vw,18px)}
  .announcement-inner{gap:8px;font-size:12px}
  .header-inner{height:auto;min-height:64px;padding-block:8px}
  .brand{min-width:0}.brand-name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .hero,.products-section,.why,.how,.testimonials,.faq,.contact,.campaign-gallery{padding-block:clamp(42px,10vw,64px)}
  .hero-actions,.product-actions,.comparison-help{width:100%}
  .hero-actions .btn,.product-actions .btn,.comparison-help .btn{flex:1 1 180px}
  .product-showcase{padding:clamp(14px,4vw,22px)!important;border-radius:20px!important}
  .product-configurations{grid-template-columns:1fr!important}
  .product-model{font-size:clamp(29px,10vw,42px)}
  .product-key-facts{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .trust-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .why-grid,.how-steps,.testimonial-grid{grid-template-columns:1fr!important}
  .comparison-table{min-width:620px}
  .comparison-scroll-hint{display:block}

  /* Replace legacy four ultra-narrow footer columns with a readable 2x2 grid. */
  .site-footer .container.footer-inner{width:100%!important;max-width:100%!important;padding:0 var(--page-pad) 8px!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:18px!important;row-gap:8px!important}
  .site-footer .footer-brand{grid-column:1/-1!important;margin-inline:calc(-1 * var(--page-pad))!important;width:calc(100% + (2 * var(--page-pad)))!important;max-width:none!important}
  .site-footer .footer-col{padding:20px 6px 10px!important;text-align:start!important;min-width:0!important}
  .site-footer .footer-col::before,.site-footer .footer-col::after,.site-footer .footer-services-col::before,.site-footer .footer-services-col::after{content:none!important;display:none!important}
  .site-footer .footer-col h3{min-height:0!important;font-size:14px!important;line-height:1.35!important;margin:0 0 8px!important;display:block!important;text-align:start!important}
  .site-footer .footer-col ul{display:grid!important;gap:2px!important;align-items:stretch!important}
  .site-footer .footer-col li{min-height:0!important;font-size:12.5px!important;line-height:1.45!important;display:block!important;text-align:start!important}
  .site-footer .footer-col a,.site-footer #footer-phone a{min-height:44px!important;padding:9px 0!important;margin:0!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;text-align:start!important;font-size:12.5px!important;line-height:1.4!important}
  .site-footer #footer-contact{padding-inline:6px!important}
  .site-footer #footer-contact ul{display:grid!important;grid-template-rows:none!important;gap:0!important}
  .site-footer #footer-contact li,.site-footer #footer-contact li:nth-child(1),.site-footer #footer-contact li:nth-child(2),.site-footer #footer-contact li:nth-child(3){grid-row:auto!important;margin:0!important;display:block!important}
  .site-footer #footer-contact .footer-contact-item,.site-footer #footer-contact .footer-hours{display:grid!important;grid-template-columns:22px minmax(0,1fr)!important;gap:7px!important;align-items:center!important;min-height:44px!important;padding:8px 0!important}
  .site-footer #footer-contact .footer-hours-text,html[lang="ar"] .site-footer #footer-contact .footer-hours-text{display:flex!important;flex-direction:column!important;align-items:flex-start!important;text-align:start!important;font-size:12.5px!important;line-height:1.35!important}
  html[lang="ar"] .site-footer #footer-contact .footer-hours-text>span{font-size:12.5px!important;text-align:start!important;white-space:normal!important}
  .site-footer .footer-bottom{grid-column:1/-1!important;padding:14px 8px 18px!important}
}
@media (max-width:480px){
  .brand-name{font-size:15px}
  .header-actions{gap:5px}
  .hero-actions,.product-actions{display:grid!important;grid-template-columns:1fr!important}
  .hero-actions .btn,.product-actions .btn{width:100%}
  .trust-grid,.product-key-facts{grid-template-columns:1fr!important}
  .site-footer .container.footer-inner{grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:12px!important}
  .site-footer .footer-col{padding-inline:2px!important}
  .site-footer .footer-col h3{font-size:13px!important}
  .site-footer .footer-col li,.site-footer .footer-col a,.site-footer #footer-phone a{font-size:12px!important}
}
@media (max-width:340px){
  .site-footer .container.footer-inner{grid-template-columns:1fr!important}
  .site-footer .footer-col{text-align:center!important}
  .site-footer .footer-col h3,.site-footer .footer-col a{justify-content:center!important;text-align:center!important}
}
@media (hover:none),(pointer:coarse){
  .btn,.nav-toggle,.lang-toggle,.gallery-arrow,.product-gallery-arrow,.product-zoom-button{min-height:44px;touch-action:manipulation}
}

/* Phase 1.9 — clearer water-style mobile menu trigger */
@media(max-width:900px){
  .site-header .nav-toggle{width:46px;height:46px;padding:10px!important;border-radius:14px!important;background:linear-gradient(rgba(231,248,251,.70),rgba(215,242,246,.78)),linear-gradient(135deg,rgba(237,249,251,.94),rgba(223,242,245,.94) 52%,rgba(232,246,242,.94)) center/cover!important;border:1px solid rgba(8,65,93,.16)!important;box-shadow:0 6px 18px rgba(8,47,73,.09)!important;backdrop-filter:blur(6px)!important;-webkit-backdrop-filter:blur(6px)!important}
  .site-header .nav-toggle-bars{width:25px;gap:5px}.site-header .nav-toggle-bars i{height:3px!important;background:#073b59!important;box-shadow:0 1px 0 rgba(255,255,255,.4)}
  .site-header .nav-toggle:focus-visible{outline:3px solid rgba(8,117,170,.3);outline-offset:3px}
}
.comparison-table td.comparison-lite-emphasis{background:linear-gradient(90deg,rgba(231,248,242,.65),rgba(248,253,251,.7));color:#0b5d4d;font-weight:700}.comparison-table td.comparison-lite-emphasis::before{content:'✓';display:inline-block;margin-inline-end:6px;color:#12906f;font-weight:900}.comparison-table th.comparison-lite-header{background:linear-gradient(90deg,rgba(231,248,242,.82),rgba(243,252,248,.9));color:#0b5d4d;font-weight:800}


/* ==========================================================================\n   AQUA FLORA — Phase 1.11 Mobile smart header + compact reviews + footer polish\n   ========================================================================== */
@media (max-width:900px){
  .af-smart-mobile-header{transition:transform .22s ease,box-shadow .22s ease!important;will-change:transform;transform:translate3d(0,0,0);backface-visibility:hidden;}
  .af-smart-mobile-header.af-smart-hidden{transform:translate3d(0,calc(-100% - 10px),0)!important;box-shadow:none!important;}
  @media (prefers-reduced-motion:reduce){.af-smart-mobile-header{transition:none!important}}
  .af-smart-menu-toggle{display:inline-flex;width:46px;height:46px;flex:0 0 46px;align-items:center;justify-content:center;padding:10px;border-radius:14px;border:1px solid rgba(8,65,93,.16);background:linear-gradient(rgba(231,248,251,.72),rgba(215,242,246,.82)),linear-gradient(135deg,rgba(237,249,251,.94),rgba(223,242,245,.94) 52%,rgba(232,246,242,.94)) center/cover;color:#073b59;box-shadow:0 6px 18px rgba(8,47,73,.09);cursor:pointer;z-index:90}
  .af-smart-toggle-bars{display:flex;flex-direction:column;width:25px;gap:5px}.af-smart-toggle-bars i{display:block;width:100%;height:3px;border-radius:99px;background:#073b59}.af-smart-menu-toggle[aria-expanded="true"] .af-smart-toggle-bars i:nth-child(1){transform:translateY(8px) rotate(45deg)}.af-smart-menu-toggle[aria-expanded="true"] .af-smart-toggle-bars i:nth-child(2){opacity:0}.af-smart-menu-toggle[aria-expanded="true"] .af-smart-toggle-bars i:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
  .detail-header-inner{position:relative;flex-wrap:wrap}.detail-header .af-smart-menu-toggle{order:3}.detail-header .detail-language{order:2}.detail-header .detail-nav{order:4;width:100%;display:none!important;margin:0!important;padding:8px;border:1px solid rgba(9,79,108,.12);border-radius:16px;background:rgba(247,252,253,.98);box-shadow:0 15px 35px rgba(10,51,75,.10)}.detail-header .detail-nav.is-mobile-open{display:grid!important;grid-template-columns:1fr 1fr;gap:6px}.detail-header .detail-nav.is-mobile-open>a{display:flex!important;min-height:46px;align-items:center;justify-content:center;padding:9px 12px;border-radius:11px;background:linear-gradient(145deg,#f7fbfc,#eaf6f8);font-size:13px;text-align:center}
  .legal-header-inner{position:relative;display:grid!important;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:8px}.legal-header .detail-language{grid-column:2}.legal-header .af-smart-menu-toggle{grid-column:3}.af-smart-legal-nav{display:none;grid-column:1/-1;width:100%;grid-template-columns:1fr 1fr;gap:6px;padding:8px;border:1px solid rgba(9,79,108,.12);border-radius:16px;background:rgba(247,252,253,.98);box-shadow:0 15px 35px rgba(10,51,75,.10)}.af-smart-legal-nav.is-mobile-open{display:grid}.af-smart-legal-nav a{display:flex;align-items:center;justify-content:center;min-height:46px;padding:9px 12px;border-radius:11px;background:linear-gradient(145deg,#f7fbfc,#eaf6f8);font-weight:700;font-size:13px;color:#0a334b}
}

/* Full-bleed, responsive footer visual on every viewport. */
.site-footer{overflow:hidden!important}.site-footer .container.footer-inner{max-width:1280px!important}.site-footer .footer-brand{grid-column:1/-1!important;width:100vw!important;max-width:none!important;margin-inline:calc(50% - 50vw)!important;background:#082f49!important;overflow:hidden!important}.site-footer .footer-banner-image,.site-footer .detail-footer-banner,.detail-footer-banner{display:block!important;width:100vw!important;max-width:none!important;height:clamp(300px,34vw,620px)!important;object-fit:cover!important;object-position:center 52%!important;margin:0!important;aspect-ratio:auto!important}
@media(max-width:720px){.site-footer .footer-banner-image,.site-footer .detail-footer-banner,.detail-footer-banner{height:clamp(210px,58vw,330px)!important;object-position:center center!important}}

/* Clean, readable footer columns: no uneven separator lines. */
.site-footer .footer-col::before,.site-footer .footer-col::after,.site-footer .footer-services-col::before,.site-footer .footer-services-col::after{content:none!important;display:none!important}
@media(max-width:720px){
  .site-footer .container.footer-inner{padding:18px var(--page-pad) 8px!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;background:#082f49!important}
  .site-footer .footer-brand{margin-top:-18px!important;margin-bottom:2px!important}
  .site-footer .footer-col{padding:15px 14px!important;border:1px solid rgba(255,255,255,.09)!important;border-radius:16px!important;background:rgba(255,255,255,.035)!important;text-align:start!important}
  .site-footer .footer-col h3{font-size:15px!important;line-height:1.35!important;margin:0 0 10px!important;min-height:0!important;text-align:start!important;color:#fff!important}
  .site-footer .footer-col ul{display:grid!important;gap:7px!important}
  .site-footer .footer-col li,.site-footer .footer-col a,.site-footer #footer-phone a{font-size:13px!important;line-height:1.55!important;min-height:0!important;padding:2px 0!important;text-align:start!important;justify-content:flex-start!important;color:#e7f1f6!important}
  .site-footer #footer-contact{padding:15px 14px!important}.site-footer #footer-contact .footer-contact-item,.site-footer #footer-contact .footer-hours{min-height:0!important;padding:4px 0!important;grid-template-columns:22px minmax(0,1fr)!important}.site-footer #footer-contact .footer-hours-text,html[lang="ar"] .site-footer #footer-contact .footer-hours-text{font-size:13px!important;line-height:1.45!important}.site-footer .footer-bottom{padding:16px 8px 20px!important}
}
@media(max-width:420px){.site-footer .container.footer-inner{grid-template-columns:1fr!important;gap:10px!important}.site-footer .footer-col{padding:14px 16px!important}.site-footer .footer-col h3,.site-footer .footer-col li,.site-footer .footer-col a{text-align:center!important;justify-content:center!important}.site-footer #footer-contact .footer-contact-item,.site-footer #footer-contact .footer-hours{width:min(100%,270px)!important;margin-inline:auto!important}.site-footer #footer-contact .footer-contact-item>span:last-child,.site-footer #footer-contact .footer-hours-text{text-align:start!important}}

/* The comparison helper CTA must remain a normal mobile button. */
@media(max-width:720px){.comparison-help{align-items:center!important;padding:18px!important}.comparison-help .btn{width:auto!important;min-width:150px!important;max-width:220px!important;min-height:44px!important;flex:0 0 auto!important;padding:10px 18px!important;border-radius:13px!important;font-size:14px!important}.comparison-help p{font-size:14px!important;line-height:1.65!important}}

/* Phase 1.11 — final footer rhythm across desktop/tablet/mobile. */
.site-footer .container.footer-inner{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  column-gap:clamp(22px,3vw,46px)!important;
  row-gap:12px!important;
  padding:0 var(--page-pad) 18px!important;
  align-items:start!important;
}
.site-footer .footer-col{
  padding:22px 10px 12px!important;
  min-width:0!important;
  text-align:start!important;
}
.site-footer .footer-col h3{
  min-height:0!important;
  margin:0 0 11px!important;
  font-size:15px!important;
  line-height:1.35!important;
  color:#fff!important;
  text-align:start!important;
}
.site-footer .footer-col ul{
  display:grid!important;
  gap:7px!important;
  margin:0!important;
  padding:0!important;
}
.site-footer .footer-col li,
.site-footer .footer-col a,
.site-footer #footer-phone a{
  min-height:0!important;
  margin:0!important;
  padding:1px 0!important;
  font-size:13px!important;
  line-height:1.6!important;
  color:#e7f1f6!important;
  text-align:start!important;
}
.site-footer .footer-col a{display:inline-flex!important;align-items:center!important;justify-content:flex-start!important;gap:7px!important}
.site-footer #footer-contact .footer-contact-item,
.site-footer #footer-contact .footer-hours{
  display:grid!important;
  grid-template-columns:22px minmax(0,1fr)!important;
  align-items:center!important;
  gap:8px!important;
  min-height:0!important;
  padding:3px 0!important;
}
.site-footer #footer-contact .footer-hours-text,
html[lang="ar"] .site-footer #footer-contact .footer-hours-text{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  justify-content:center!important;
  gap:1px!important;
  font-size:13px!important;
  line-height:1.4!important;
  text-align:start!important;
}
.site-footer .footer-bottom{padding:15px var(--page-pad) 19px!important}
.site-footer .footer-bottom p,.site-footer .site-designer-signature{font-size:12px!important;line-height:1.5!important}

@media(max-width:900px){
  .site-footer .container.footer-inner{grid-template-columns:repeat(2,minmax(0,1fr))!important;column-gap:14px!important;row-gap:10px!important}
  .site-footer .footer-col{padding:16px 14px!important;border:1px solid rgba(255,255,255,.09)!important;border-radius:16px!important;background:rgba(255,255,255,.035)!important}
}
@media(max-width:420px){
  .site-footer .container.footer-inner{grid-template-columns:1fr!important}
}


/* Phase 1.12 — main site footer matches Aqua Flora Care and is fully centered */
.site-footer{background:#08243b!important;color:#e7f1f6!important;overflow:hidden!important}.site-footer .container.footer-inner{width:min(1180px,100%)!important;max-width:1180px!important;margin:0 auto!important;padding:0 24px 24px!important;display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:14px!important;background:#08243b!important}.site-footer .footer-brand{grid-column:1/-1!important;width:100vw!important;max-width:none!important;margin-inline:calc(50% - 50vw)!important;overflow:hidden!important;background:#08243b!important}.site-footer .footer-banner-image,.site-footer .detail-footer-banner,.detail-footer-banner{display:block!important;width:100vw!important;max-width:none!important;height:clamp(300px,34vw,620px)!important;object-fit:cover!important;object-position:center 52%!important;margin:0!important}.site-footer .footer-col{min-width:0!important;text-align:center!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:flex-start!important;padding:16px 12px!important;border:1px solid rgba(255,255,255,.08)!important;border-radius:16px!important;background:rgba(255,255,255,.025)!important}.site-footer .footer-col h3{width:100%!important;text-align:center!important;color:#fff!important;font-size:15px!important;line-height:1.35!important;margin:0 0 10px!important}.site-footer .footer-col ul{width:100%!important;display:grid!important;gap:7px!important;justify-items:center!important;padding:0!important;margin:0!important}.site-footer .footer-col li,.site-footer .footer-col a,.site-footer .footer-col span{font-size:13px!important;line-height:1.6!important;text-align:center!important;color:#e7f1f6!important}.site-footer .footer-col a,.site-footer #footer-phone a{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:0!important;padding:2px 0!important;margin:0!important}.site-footer #footer-contact .footer-contact-item,.site-footer #footer-contact .footer-hours{display:flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;min-height:0!important;padding:2px 0!important}.site-footer #footer-contact .footer-hours-text,html[lang="ar"] .site-footer #footer-contact .footer-hours-text{display:flex!important;flex-direction:column!important;align-items:center!important;text-align:center!important;line-height:1.45!important}.site-footer .footer-bottom{grid-column:1/-1!important;text-align:center!important;padding:14px 8px 6px!important;border-top:1px solid rgba(255,255,255,.12)!important}.site-footer .footer-bottom p{text-align:center!important;margin:4px 0!important}
@media(max-width:720px){.site-footer .container.footer-inner{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important;padding:0 12px 20px!important}.site-footer .footer-banner-image,.site-footer .detail-footer-banner,.detail-footer-banner{height:clamp(210px,58vw,330px)!important;object-position:center center!important}.site-footer .footer-col{min-height:190px!important;padding:16px 10px!important}.site-footer .footer-col h3{font-size:15px!important}.site-footer .footer-col li,.site-footer .footer-col a,.site-footer .footer-col span{font-size:13px!important;line-height:1.65!important}}
@media(max-width:350px){.site-footer .container.footer-inner{grid-template-columns:1fr!important}.site-footer .footer-col{min-height:0!important}}

/* Phase 1.14 — main-site mobile/tablet design stabilization */
@media(max-width:900px){
  .comparison-help{align-items:center;justify-content:center;text-align:center}
  .comparison-help .btn{width:auto;min-width:150px;max-width:220px;flex:0 0 auto;padding-inline:18px}
  .site-header.af-smart-mobile-header{contain:layout style}
  .site-header.af-smart-mobile-header .header-inner{padding-inline:clamp(12px,4vw,18px)}
  .btn,.nav-toggle,.lang-toggle{touch-action:manipulation}
}
@media(max-width:720px){
  .section-heading,.section-heading p,.contact-copy{text-align:center}
}

/* Phase 1.14 — 404/mobile containment found during responsive launch audit */
.error-page-card{width:650px;max-width:calc(100vw - 48px)}
.error-page-logo{max-width:min(220px,70%);height:auto}


/* Phase 1.17 — About page */
.about-page-content{padding:38px 0 92px;}
.about-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;}
.about-card{background:#fff;border:1px solid rgba(14,58,92,.12);border-radius:22px;padding:24px;box-shadow:0 14px 35px rgba(14,58,92,.07);}
.about-card h2{margin:0 0 10px;color:var(--color-navy,#0e3a5c);font-size:clamp(1.1rem,2vw,1.35rem);}
.about-card p{margin:0;line-height:1.85;color:var(--color-ink,#173146);}
.about-cta{display:flex;justify-content:center;margin-top:24px;}
@media (max-width:720px){.about-page-content{padding:24px 0 72px}.about-grid{grid-template-columns:1fr}.about-card{padding:20px 18px;border-radius:18px}.about-cta .btn{width:100%;max-width:420px;}}

/* AQUA FLORA V4.2.4 — supplied water-drop banner, seamless into hero */
.site-header,.detail-header,.legal-header{background-color:#d8f0f6!important;background-image:linear-gradient(rgba(255,255,255,.10),rgba(255,255,255,.10)),linear-gradient(135deg,rgba(237,249,251,.94),rgba(223,242,245,.94) 52%,rgba(232,246,242,.94))!important;background-position:center center!important;background-size:cover!important}
.site-header::before{background:linear-gradient(to bottom,rgba(216,240,246,0) 0%,rgba(216,240,246,.28) 36%,rgba(216,240,246,.70) 70%,#d8f0f6 100%)!important}
.hero{background:linear-gradient(180deg,#d8f0f6 0%,#e8f6f9 82px,#f5fbfb 180px,#e9f5f0 100%)!important}
@media(max-width:720px){.site-header,.detail-header,.legal-header{background-image:linear-gradient(rgba(255,255,255,.10),rgba(255,255,255,.10)),linear-gradient(135deg,rgba(237,249,251,.94),rgba(223,242,245,.94) 52%,rgba(232,246,242,.94))!important}.hero{background:linear-gradient(180deg,#d8f0f6 0%,#e9f6f9 64px,#f5fbfb 145px,#e9f5f0 100%)!important}}

/* AQUA FLORA V4.2.5 — water banner framing: show the droplet + ripple composition instead of over-cropping */
.site-header,
.detail-header,
.legal-header{
  background-color:#e8f6fa!important;
  background-image:linear-gradient(rgba(255,255,255,.055),rgba(255,255,255,.055)),linear-gradient(135deg,rgba(237,249,251,.94),rgba(223,242,245,.94) 52%,rgba(232,246,242,.94))!important;
  background-repeat:no-repeat!important;
  /* Deliberately zoomed OUT. The image is centered as a water motif while the matching background fills the wide header. */
  background-size:auto 260px!important;
  background-position:center 57%!important;
}
@media (min-width:1440px){
  .site-header,.detail-header,.legal-header{background-size:auto 270px!important;background-position:center 57%!important}
}
@media (max-width:900px){
  .site-header,.detail-header,.legal-header{background-size:auto 235px!important;background-position:center 56%!important}
}
@media (max-width:720px){
  .site-header,.detail-header,.legal-header{
    background-image:linear-gradient(rgba(255,255,255,.045),rgba(255,255,255,.045)),linear-gradient(135deg,rgba(237,249,251,.94),rgba(223,242,245,.94) 52%,rgba(232,246,242,.94))!important;
    background-size:auto 218px!important;
    background-position:center 55%!important;
  }
}
@media (max-width:420px){
  .site-header,.detail-header,.legal-header{background-size:auto 205px!important;background-position:center 54%!important}
}

/* AQUA FLORA V4.2.6 — seamless wide water banner across navigation zone
   Keep the header base color continuous, then feather the supplied water image
   from the login/action area through the primary navigation without a visible box edge. */
.site-header,
.detail-header,
.legal-header{
  background-color:#e8f6fa!important;
  background-image:none!important;
  position:relative!important;
  isolation:isolate!important;
}
.site-header::after,
.detail-header::after,
.legal-header::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  top:0!important;
  bottom:0!important;
  left:50%!important;
  width:clamp(700px,64vw,930px)!important;
  transform:translateX(-50%)!important;
  pointer-events:none!important;
  z-index:0!important;
  background-image:linear-gradient(135deg,rgba(237,249,251,.94),rgba(223,242,245,.94) 52%,rgba(232,246,242,.94))!important;
  background-repeat:no-repeat!important;
  /* Horizontal stretch is intentional: it preserves the V4.2.5 vertical framing
     while spanning the navigation zone requested by the design. */
  background-size:100% 255px!important;
  background-position:center 55%!important;
  -webkit-mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.28) 6%,#000 15%,#000 85%,rgba(0,0,0,.28) 94%,transparent 100%)!important;
  mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.28) 6%,#000 15%,#000 85%,rgba(0,0,0,.28) 94%,transparent 100%)!important;
}
.site-header::before,
.detail-header::before,
.legal-header::before{
  z-index:1!important;
}
.site-header .header-inner,
.detail-header-inner,
.legal-header-inner{
  position:relative!important;
  z-index:2!important;
}
@media (min-width:1440px){
  .site-header::after,.detail-header::after,.legal-header::after{
    width:clamp(820px,62vw,1040px)!important;
    background-size:100% 270px!important;
  }
}
@media (max-width:1040px){
  .site-header::after,.detail-header::after,.legal-header::after{
    width:78vw!important;
    max-width:800px!important;
    background-size:100% 235px!important;
  }
}
@media (max-width:720px){
  .site-header::after,.detail-header::after,.legal-header::after{
    width:100%!important;
    max-width:none!important;
    background-image:linear-gradient(135deg,rgba(237,249,251,.94),rgba(223,242,245,.94) 52%,rgba(232,246,242,.94))!important;
    background-size:118% 218px!important;
    background-position:center 54%!important;
    -webkit-mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.55) 5%,#000 12%,#000 88%,rgba(0,0,0,.55) 95%,transparent 100%)!important;
    mask-image:linear-gradient(to right,transparent 0%,rgba(0,0,0,.55) 5%,#000 12%,#000 88%,rgba(0,0,0,.55) 95%,transparent 100%)!important;
  }
}


/* AQUA FLORA V4.2.7 — clean premium gradient; retired water banner removed */
.site-header,.detail-header,.legal-header{background:#e7f5f8!important;background-image:linear-gradient(135deg,#edf9fb 0%,#dff2f5 48%,#e8f6f2 100%)!important;background-size:auto!important;background-position:center!important;background-repeat:no-repeat!important;border-bottom:1px solid rgba(14,58,92,.08)!important;box-shadow:0 8px 24px rgba(14,58,92,.035)!important;isolation:isolate!important;}
.site-header::after,.detail-header::after,.legal-header::after{content:none!important;display:none!important;background:none!important;-webkit-mask-image:none!important;mask-image:none!important;}
.site-header::before,.detail-header::before,.legal-header::before{background:linear-gradient(to bottom,rgba(255,255,255,.16),rgba(223,242,245,.14) 55%,rgba(231,246,242,.40) 100%)!important;}
.hero{background:linear-gradient(180deg,#e7f5f8 0%,#edf9f9 32%,#f6fbfa 64%,#edf7f2 100%)!important;}
.site-header .nav-toggle,.af-smart-menu-toggle{background:linear-gradient(135deg,rgba(244,252,253,.98),rgba(224,245,247,.98))!important;}
@media(max-width:720px){.site-header,.detail-header,.legal-header{background-image:linear-gradient(145deg,#eefafb 0%,#dff3f6 54%,#eaf7f3 100%)!important}.hero{background:linear-gradient(180deg,#e7f5f8 0%,#eef9f9 36%,#f7fbfa 68%,#edf7f2 100%)!important}}


/* ==========================================================================
   AQUA FLORA V4.2.8 — final header, comparison and section hierarchy
   ========================================================================== */
/* A clean photographic-free premium header is now the single visual baseline. */
.site-header,
.detail-header,
.legal-header{
  position:sticky!important;
  top:0!important;
  z-index:700!important;
  background:linear-gradient(135deg,#edf9fb 0%,#dff2f5 48%,#e8f6f2 100%)!important;
  background-image:linear-gradient(135deg,#edf9fb 0%,#dff2f5 48%,#e8f6f2 100%)!important;
  border-bottom:1px solid rgba(14,58,92,.08)!important;
  box-shadow:0 8px 24px rgba(14,58,92,.035)!important;
  backdrop-filter:blur(12px)!important;
  -webkit-backdrop-filter:blur(12px)!important;
}
.site-header::after,.detail-header::after,.legal-header::after{content:none!important;display:none!important;background:none!important;mask-image:none!important;-webkit-mask-image:none!important}
.site-header .header-inner,
.product-parity-header .detail-header-inner{
  min-height:96px!important;
  height:96px!important;
  gap:clamp(10px,1.25vw,18px)!important;
  padding-block:0!important;
}
.site-header .brand,
.product-parity-header .brand{flex:0 0 auto!important;min-width:126px!important;justify-content:center!important}
.site-header .brand-logo,
.product-parity-header .brand-logo,
.legal-header .brand-logo{
  width:126px!important;
  height:88px!important;
  max-width:126px!important;
  border-radius:0!important;
  object-fit:contain!important;
  object-position:center!important;
  filter:drop-shadow(0 2px 3px rgba(255,255,255,.82)) drop-shadow(0 2px 5px rgba(8,47,73,.10))!important;
}
.site-header .main-nav,
.product-parity-header .detail-nav{flex:1 1 auto!important;min-width:0!important;margin:0!important}
.site-header .main-nav ul,
.product-parity-header .detail-nav{display:flex!important;align-items:center!important;justify-content:center!important;gap:clamp(12px,1.55vw,24px)!important}
.site-header .main-nav a,
.product-parity-header .detail-nav>a{
  font-size:clamp(12px,1.05vw,14px)!important;
  font-weight:700!important;
  color:#10354a!important;
  white-space:nowrap!important;
  text-decoration:none!important;
}
.product-parity-header .detail-language{margin:0!important;flex:0 0 auto!important}
.product-parity-header .detail-header-cta{flex:0 0 auto!important}

/* The smart-menu button must never leak into desktop as the tiny rectangle artifact. */
.af-smart-menu-toggle{display:none!important}

/* Requested lightweight colored labels, and only for sections explicitly tagged section-chip. */
.section-chip{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:max-content!important;
  max-width:100%!important;
  padding:8px 15px!important;
  margin-bottom:12px!important;
  border:1px solid rgba(18,143,111,.17)!important;
  border-radius:11px!important;
  background:linear-gradient(135deg,rgba(221,246,241,.84),rgba(231,246,249,.88))!important;
  color:#0b705d!important;
  box-shadow:0 5px 14px rgba(14,83,78,.055)!important;
  font-weight:800!important;
  letter-spacing:.025em!important;
  text-transform:none!important;
}
.section-chip.center{margin-inline:auto!important}

/* Comparison visual hierarchy. */
.comparison-table th.comparison-krs-header{
  background:linear-gradient(135deg,rgba(25,123,157,.83),rgba(35,151,172,.68))!important;
  color:#fff!important;
  font-weight:900!important;
  text-shadow:0 1px 1px rgba(1,48,67,.18)!important;
}
.comparison-table th.comparison-lite-header{
  background:linear-gradient(135deg,rgba(178,229,210,.97),rgba(211,242,230,.96))!important;
  color:#075d49!important;
  font-weight:900!important;
}
.comparison-table td.comparison-lite-emphasis{
  color:#075d49!important;
  font-size:calc(1em + 1px)!important;
  font-weight:800!important;
  background:linear-gradient(90deg,rgba(220,245,235,.76),rgba(247,253,250,.82))!important;
}
.comparison-table td.comparison-lite-emphasis::before{color:#087e5e!important}

/* Arabic hero: keep “مياه الشرب في منزلك” visually together on desktop without overflow. */
@media (min-width:901px){
  html[lang="ar"] .hero-inner{grid-template-columns:minmax(0,.88fr) minmax(540px,1.12fr)!important;gap:clamp(40px,4vw,58px)!important}
  html[lang="ar"] .hero-copy h1{max-width:16.2ch!important;font-size:clamp(38px,4.15vw,58px)!important;line-height:1.2!important;letter-spacing:-.025em!important}
}

@media (max-width:900px){
  .site-header .header-inner{height:auto!important;min-height:72px!important}
  .site-header .brand-logo,.product-parity-header .brand-logo,.legal-header .brand-logo{width:108px!important;height:72px!important;max-width:108px!important}
  .af-smart-menu-toggle{display:inline-flex!important}
  .product-parity-header .detail-header-inner{height:auto!important;min-height:72px!important;flex-wrap:wrap!important}
  .product-parity-header .detail-nav{display:none!important;width:100%!important;order:10!important;padding:8px!important;border:1px solid rgba(9,79,108,.12)!important;border-radius:16px!important;background:rgba(247,252,253,.98)!important;box-shadow:0 15px 35px rgba(10,51,75,.10)!important}
  .product-parity-header .detail-nav.is-mobile-open{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important}
  .product-parity-header .detail-nav.is-mobile-open>a{display:flex!important;align-items:center!important;justify-content:center!important;min-height:46px!important;padding:9px 10px!important;border-radius:11px!important;background:linear-gradient(145deg,#f7fbfc,#eaf6f8)!important;white-space:normal!important;text-align:center!important}
}
@media (max-width:540px){
  .site-header .brand-logo,.product-parity-header .brand-logo,.legal-header .brand-logo{width:94px!important;height:66px!important;max-width:94px!important}
  .product-parity-header .detail-nav.is-mobile-open{grid-template-columns:1fr!important}
}


/* ==========================================================================\n   AQUA FLORA V4.2.9 — final header parity / announcement removal\n   ========================================================================== */
/* Announcement strip retired completely: no content, color or reserved space. */
.announcement-bar{display:none!important;height:0!important;min-height:0!important;margin:0!important;padding:0!important;border:0!important;overflow:hidden!important}

/* Public navigation interaction baseline: underline only, never a filled tile. */
@media (min-width:901px){
  .site-header .main-nav a,
  .product-parity-header .detail-nav>a{
    position:relative!important;
    border-radius:0!important;
    background:transparent!important;
    color:#10354a!important;
    transform:none!important;
    padding-block:8px!important;
  }
  .site-header .main-nav a::after,
  .product-parity-header .detail-nav>a::after{
    content:""!important;
    position:absolute!important;
    inset-inline-start:0!important;
    bottom:1px!important;
    width:0!important;
    height:2px!important;
    border-radius:999px!important;
    background:#14966b!important;
    transition:width .18s ease!important;
  }
  .site-header .main-nav a:hover,
  .site-header .main-nav a:focus-visible,
  .product-parity-header .detail-nav>a:hover,
  .product-parity-header .detail-nav>a:focus-visible{
    color:#0b705d!important;
    background:transparent!important;
    transform:none!important;
  }
  .site-header .main-nav a:hover::after,
  .site-header .main-nav a:focus-visible::after,
  .product-parity-header .detail-nav>a:hover::after,
  .product-parity-header .detail-nav>a:focus-visible::after{width:100%!important}
  .site-header .main-nav a:active,
  .product-parity-header .detail-nav>a:active{color:#0875aa!important}
}

/* One canonical login-button treatment everywhere. */
.af-account-entry.is-login{
  color:#fff!important;
  background:linear-gradient(135deg,#0b6998,#1185af)!important;
  border-color:#0b6998!important;
  box-shadow:0 0 0 3px rgba(34,172,206,.12),0 8px 22px rgba(8,101,151,.25)!important;
}
.af-account-entry.is-login::after{border-color:rgba(43,192,217,.38)!important}


/* ========================================================================== 
   AQUA FLORA V4.2.11 — transparent logo + centered section labels + mobile footer/contact polish
   ========================================================================== */
/* Supplied production SVG is the sole visible brand artwork. Never paint a card/background behind it. */
.brand-logo,.footer-brand-logo,.detail-footer-logo,.error-page-logo,
.site-header .brand-logo,.product-parity-header .brand-logo,.detail-header .brand-logo,.legal-header .brand-logo{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  object-fit:contain!important;
}

/* Every requested category keyword sits on the visual centerline, not on the RTL/LTR edge. */
.section-chip{
  margin-inline:auto!important;
  text-align:center!important;
}
.products-intro{
  text-align:center!important;
}
.products-section-chip{
  font-size:clamp(17px,1.7vw,22px)!important;
  padding:9px 18px!important;
}
.gallery-heading{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)!important;
  align-items:center!important;
  gap:16px!important;
}
.gallery-heading>div:first-child{
  grid-column:2!important;
  justify-self:center!important;
  text-align:center!important;
  min-width:0!important;
}
.gallery-heading .section-title{
  text-align:center!important;
  margin-inline:auto!important;
}
.gallery-heading .gallery-controls{
  grid-column:3!important;
  justify-self:end!important;
}

/* The phone CTA was removed: mobile dock is exactly two controls, with no phantom third column/white void. */
@media (max-width:720px){
  .contact-dock:not(.is-collapsed){
    left:50%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
    bottom:calc(var(--visual-viewport-bottom) + 8px)!important;
    width:min(calc(100% - 16px),430px)!important;
    min-width:0!important;
    max-width:430px!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }
  .contact-dock:not(.is-collapsed) .contact-dock-item{
    width:100%!important;
    min-width:0!important;
    min-height:68px!important;
    border-radius:18px!important;
    box-shadow:0 9px 24px rgba(5,39,48,.16)!important;
  }
  .contact-dock:not(.is-collapsed) .contact-dock-toggle{
    inset-inline-end:auto!important;
    inset-inline-start:10px!important;
    inset-block-start:-20px!important;
  }
  /* Collapsed control is generic messaging, never a phone icon. */
  .contact-dock.is-collapsed .contact-dock-toggle::before{content:"💬"!important;font-size:19px!important;}

  /* Mobile footer: readable, centered 2x2 composition instead of four compressed columns. */
  .site-footer .container.footer-inner{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    padding:14px 12px 18px!important;
  }
  .site-footer .footer-brand{
    grid-column:1/-1!important;
    margin:0 0 6px!important;
  }
  .site-footer .footer-col{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
    min-height:178px!important;
    padding:14px 8px!important;
    border:1px solid rgba(255,255,255,.10)!important;
    border-radius:15px!important;
    background:rgba(255,255,255,.025)!important;
    text-align:center!important;
  }
  .site-footer .footer-col h3{
    width:100%!important;
    margin:0 0 10px!important;
    font-size:13.5px!important;
    line-height:1.35!important;
    text-align:center!important;
  }
  .site-footer .footer-col ul{
    width:100%!important;
    display:grid!important;
    justify-items:center!important;
    gap:6px!important;
  }
  .site-footer .footer-col li,
  .site-footer .footer-col a,
  .site-footer .footer-col span{
    font-size:12.3px!important;
    line-height:1.55!important;
    text-align:center!important;
    overflow-wrap:anywhere!important;
  }
  .site-footer .footer-contact-item,
  .site-footer .footer-hours{
    justify-content:center!important;
    text-align:center!important;
  }
  .site-footer .footer-hours-text{align-items:center!important;text-align:center!important;}
  .site-footer .footer-bottom{
    padding:10px 12px calc(12px + env(safe-area-inset-bottom))!important;
    gap:4px!important;
    text-align:center!important;
  }
  .site-footer .footer-bottom>p{font-size:10.5px!important;text-align:center!important;}
  .site-footer .site-designer-signature{font-size:10px!important;text-align:center!important;}

  .gallery-heading{
    grid-template-columns:1fr!important;
    justify-items:center!important;
    text-align:center!important;
  }
  .gallery-heading>div:first-child,
  .gallery-heading .gallery-controls{
    grid-column:1!important;
    justify-self:center!important;
  }
  .gallery-heading .gallery-controls{margin-top:4px!important;}
}
@media (max-width:340px){
  .site-footer .container.footer-inner{grid-template-columns:1fr!important;}
  .site-footer .footer-col{min-height:0!important;}
}

/* ========================================================================== 
   AQUA FLORA V4.2.12 — footer parity with CARE
   Explicit semantic 2x2 placement prevents mobile ordering from changing
   between the main site, product pages and CARE.
   ========================================================================== */
@media (max-width:720px){
  .site-footer .footer-quicklinks-col,
  .site-footer .footer-contact-col,
  .site-footer .footer-legal-col,
  .site-footer .footer-services-col{
    min-width:0!important;
  }

  /* LTR: Quick | Contact / Legal | Services */
  html[dir="ltr"] .site-footer .footer-quicklinks-col{grid-column:1!important;grid-row:2!important;}
  html[dir="ltr"] .site-footer .footer-contact-col{grid-column:2!important;grid-row:2!important;}
  html[dir="ltr"] .site-footer .footer-legal-col{grid-column:1!important;grid-row:3!important;}
  html[dir="ltr"] .site-footer .footer-services-col{grid-column:2!important;grid-row:3!important;}

  /* RTL visual parity with CARE: Contact | Quick / Services | Legal */
  html[dir="rtl"] .site-footer .footer-contact-col{grid-column:1!important;grid-row:2!important;}
  html[dir="rtl"] .site-footer .footer-quicklinks-col{grid-column:2!important;grid-row:2!important;}
  html[dir="rtl"] .site-footer .footer-services-col{grid-column:1!important;grid-row:3!important;}
  html[dir="rtl"] .site-footer .footer-legal-col{grid-column:2!important;grid-row:3!important;}

  .site-footer .footer-bottom{grid-column:1/-1!important;grid-row:4!important;}
}

@media (max-width:340px){
  html[dir="ltr"] .site-footer .footer-quicklinks-col,
  html[dir="ltr"] .site-footer .footer-contact-col,
  html[dir="ltr"] .site-footer .footer-legal-col,
  html[dir="ltr"] .site-footer .footer-services-col,
  html[dir="rtl"] .site-footer .footer-quicklinks-col,
  html[dir="rtl"] .site-footer .footer-contact-col,
  html[dir="rtl"] .site-footer .footer-legal-col,
  html[dir="rtl"] .site-footer .footer-services-col{
    grid-column:1!important;
    grid-row:auto!important;
  }
  .site-footer .footer-bottom{grid-column:1!important;grid-row:auto!important;}
}
\n\n/* ==========================================================================\n   AQUA FLORA V4.2.13 — requested UI parity hotfix\n   Scope: section-chip centering, CARE-parity footer, transparent logo asset.\n   ========================================================================== */\n/* Block-level max-content flex is required: auto inline margins do not center inline-flex. */\n.section-chip,\n.eyebrow.center.section-chip{\n  display:flex!important;\n  width:max-content!important;\n  max-width:calc(100% - 24px)!important;\n  margin-left:auto!important;\n  margin-right:auto!important;\n  margin-inline:auto!important;\n  align-items:center!important;\n  justify-content:center!important;\n  text-align:center!important;\n}\n\n/* Main/product footer uses the same geometry and centering as CARE. */\n.site-footer .container.footer-inner{\n  width:min(1180px,100%)!important;\n  max-width:1180px!important;\n  margin-inline:auto!important;\n  grid-template-columns:repeat(4,minmax(0,1fr))!important;\n  gap:14px!important;\n  padding:0 24px 24px!important;\n}\n.site-footer .footer-col{\n  min-width:0!important;\n  display:flex!important;\n  flex-direction:column!important;\n  align-items:center!important;\n  justify-content:flex-start!important;\n  text-align:center!important;\n  padding:16px 12px!important;\n}\n.site-footer .footer-col h3,\n.site-footer .footer-col ul,\n.site-footer .footer-col li,\n.site-footer .footer-col a,\n.site-footer .footer-col span{\n  text-align:center!important;\n}\n.site-footer .footer-col h3{width:100%!important;margin:0 0 10px!important;}\n.site-footer .footer-col ul{width:100%!important;justify-items:center!important;align-items:start!important;}\n.site-footer .footer-col a,\n.site-footer #footer-phone a{\n  justify-content:center!important;\n  margin-inline:auto!important;\n}\n.site-footer #footer-contact .footer-contact-item,\n.site-footer #footer-contact .footer-hours{\n  width:max-content!important;\n  max-width:100%!important;\n  margin-inline:auto!important;\n  justify-content:center!important;\n  text-align:center!important;\n}\n.site-footer #footer-contact .footer-contact-item>span:last-child,\n.site-footer #footer-contact .footer-hours-text,\n.site-footer #footer-contact .footer-hours-text span{\n  text-align:center!important;\n  align-items:center!important;\n}\n\n/* CARE stays four columns above the mobile breakpoint; remove the older 900px 2-column divergence. */\n@media (min-width:721px){\n  .site-footer .container.footer-inner{grid-template-columns:repeat(4,minmax(0,1fr))!important;}\n}\n@media (max-width:720px){\n  .site-footer .container.footer-inner{\n    grid-template-columns:repeat(2,minmax(0,1fr))!important;\n    gap:10px!important;\n    padding:14px 12px 18px!important;\n  }\n  .site-footer .footer-col{\n    min-height:178px!important;\n    padding:14px 9px!important;\n    border-radius:15px!important;\n    text-align:center!important;\n  }\n  .site-footer .footer-col h3{font-size:13.5px!important;margin-bottom:10px!important;}\n  .site-footer .footer-col ul{gap:6px!important;justify-items:center!important;}\n  .site-footer .footer-col li,\n  .site-footer .footer-col a,\n  .site-footer .footer-col span{font-size:12.3px!important;line-height:1.55!important;text-align:center!important;}\n\n  /* Exact visual order used by CARE in RTL/LTR. */\n  html[dir="ltr"] .site-footer .footer-quicklinks-col{grid-column:1!important;grid-row:2!important;}\n  html[dir="ltr"] .site-footer .footer-contact-col{grid-column:2!important;grid-row:2!important;}\n  html[dir="ltr"] .site-footer .footer-legal-col{grid-column:1!important;grid-row:3!important;}\n  html[dir="ltr"] .site-footer .footer-services-col{grid-column:2!important;grid-row:3!important;}\n  html[dir="rtl"] .site-footer .footer-contact-col{grid-column:1!important;grid-row:2!important;}\n  html[dir="rtl"] .site-footer .footer-quicklinks-col{grid-column:2!important;grid-row:2!important;}\n  html[dir="rtl"] .site-footer .footer-services-col{grid-column:1!important;grid-row:3!important;}\n  html[dir="rtl"] .site-footer .footer-legal-col{grid-column:2!important;grid-row:3!important;}\n}\n@media (max-width:340px){\n  .site-footer .container.footer-inner{grid-template-columns:1fr!important;}\n  .site-footer .footer-col{min-height:0!important;grid-column:1!important;grid-row:auto!important;}\n}\n

/* AQUA FLORA — final responsive UI correction */
.section-title.center{margin-inline:auto!important;}
@media (max-width:980px){
  .site-header .header-inner{gap:10px!important;}
  .site-header .main-nav{position:fixed!important;inset-inline:0!important;top:var(--header-h)!important;bottom:0!important;background:#fff!important;padding:24px!important;transform:translateY(-8px)!important;opacity:0!important;pointer-events:none!important;transition:transform .2s ease,opacity .2s ease!important;overflow-y:auto!important;}
  .site-header .main-nav.open{transform:translateY(0)!important;opacity:1!important;pointer-events:auto!important;}
  .site-header .main-nav ul{flex-direction:column!important;gap:4px!important;}
  .site-header .main-nav a{display:block!important;padding:14px 4px!important;font-size:17px!important;border-bottom:1px solid #eef2f4!important;}
  .site-header .nav-toggle{display:block!important;background:none!important;border:0!important;}
  .site-header .header-cta{display:none!important;}
  .hero-inner{grid-template-columns:1fr!important;gap:32px!important;}
  .hero-media{order:-1!important;width:min(100%,620px)!important;margin-inline:auto!important;}
  .footer-inner{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media (max-width:540px){
  .footer-inner{grid-template-columns:1fr!important;}
  .footer-col{min-height:0!important;}
  .footer-col li,.footer-col a,.footer-col span{font-size:13px!important;line-height:1.65!important;}
}


/* AQUA FLORA V4.2.14 — public/Care header and footer parity */
/* Shared desktop navigation geometry: same font metrics, gaps, and vertical baseline. */
@media (min-width:861px){
  .site-header .header-inner,
  .product-parity-header .detail-header-inner{
    width:min(100%,1280px)!important;
    max-width:100%!important;
    min-height:96px!important;
    height:96px!important;
    margin-inline:auto!important;
    padding-inline:clamp(12px,2.8vw,28px)!important;
    padding-block:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:clamp(10px,1.25vw,18px)!important;
  }
  .site-header .main-nav,
  .product-parity-header .detail-nav{
    display:flex!important;
    flex:1 1 auto!important;
    min-width:0!important;
    align-items:center!important;
    justify-content:center!important;
    gap:clamp(12px,1.55vw,24px)!important;
    margin:0!important;
    padding:0!important;
  }
  .site-header .main-nav ul{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:clamp(12px,1.55vw,24px)!important;
    margin:0!important;
    padding:0!important;
  }
  .site-header .main-nav a,
  .product-parity-header .detail-nav>a{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:40px!important;
    padding:8px 0!important;
    font-family:"Segoe UI",Tahoma,Arial,sans-serif!important;
    font-size:clamp(12px,1.05vw,14px)!important;
    font-weight:700!important;
    line-height:1.2!important;
    letter-spacing:normal!important;
    white-space:nowrap!important;
    text-align:center!important;
  }
}

/* Shared desktop footer geometry: centered titles, links, contact details, and columns. */
.site-footer .container.footer-inner{
  width:min(1180px,100%)!important;
  max-width:1180px!important;
  margin-inline:auto!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:14px!important;
  padding:0 24px 24px!important;
  align-items:stretch!important;
}
.site-footer .footer-col{
  min-width:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  text-align:center!important;
  padding:16px 12px!important;
}
.site-footer .footer-col h3,
.site-footer .footer-col ul,
.site-footer .footer-col li,
.site-footer .footer-col a,
.site-footer .footer-col span{
  width:100%!important;
  text-align:center!important;
}
.site-footer .footer-col h3{margin:0 0 10px!important;line-height:1.35!important;}
.site-footer .footer-col ul{
  display:grid!important;
  justify-items:center!important;
  align-items:start!important;
  gap:7px!important;
  margin:0!important;
  padding:0!important;
}
.site-footer .footer-col li{display:block!important;}
.site-footer .footer-col a{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin-inline:auto!important;
  padding:2px 0!important;
}
.site-footer #footer-contact .footer-contact-item,
.site-footer #footer-contact .footer-hours{
  width:100%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  text-align:center!important;
}
.site-footer #footer-contact .footer-hours-text,
.site-footer #footer-contact .footer-hours-text span{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  text-align:center!important;
}
.site-footer .footer-bottom{
  grid-column:1/-1!important;
  text-align:center!important;
}
@media (max-width:720px){
  .site-footer .container.footer-inner{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    padding:14px 12px 18px!important;
  }
  .site-footer .footer-col{
    min-height:178px!important;
    padding:14px 9px!important;
  }
  .site-footer .footer-col h3{font-size:13.5px!important;}
  .site-footer .footer-col li,
  .site-footer .footer-col a,
  .site-footer .footer-col span{font-size:12.3px!important;line-height:1.55!important;}
  /* Match Care's RTL mobile arrangement: Contact | Quick / Services | Legal. */
  html[dir="rtl"] .site-footer .footer-contact-col{grid-column:1!important;grid-row:2!important;}
  html[dir="rtl"] .site-footer .footer-quicklinks-col{grid-column:2!important;grid-row:2!important;}
  html[dir="rtl"] .site-footer .footer-services-col{grid-column:1!important;grid-row:3!important;}
  html[dir="rtl"] .site-footer .footer-legal-col{grid-column:2!important;grid-row:3!important;}
  html[dir="ltr"] .site-footer .footer-quicklinks-col{grid-column:1!important;grid-row:2!important;}
  html[dir="ltr"] .site-footer .footer-contact-col{grid-column:2!important;grid-row:2!important;}
  html[dir="ltr"] .site-footer .footer-legal-col{grid-column:1!important;grid-row:3!important;}
  html[dir="ltr"] .site-footer .footer-services-col{grid-column:2!important;grid-row:3!important;}
}
@media (max-width:340px){
  .site-footer .container.footer-inner{grid-template-columns:1fr!important;}
  .site-footer .footer-col{grid-column:1!important;grid-row:auto!important;min-height:0!important;}
}


/* AQUA FLORA V4.2.14 — main section-heading centering */
/* Center only the four requested section headings; internal cards and tables remain unchanged. */
.comparison > .container > .eyebrow.center,
.how > .container > .eyebrow.center,
.why > .container > .eyebrow.center,
.confidence > .container > .eyebrow.center,
.comparison > .container > .section-title.center,
.how > .container > .section-title.center,
.why > .container > .section-title.center,
.confidence > .container > .section-title.center{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  margin-inline:auto!important;
  text-align:center!important;
}
.comparison > .container > .eyebrow.center.section-chip,
.how > .container > .eyebrow.center.section-chip,
.why > .container > .eyebrow.center.section-chip,
.confidence > .container > .eyebrow.center.section-chip{
  display:flex!important;
  width:max-content!important;
  max-width:calc(100% - 24px)!important;
  margin-inline:auto!important;
  justify-content:center!important;
  text-align:center!important;
}


/* AQUA FLORA V4.2.14 — footer contact inline correction */
/* Contact icons and their text must keep intrinsic widths; only the column itself is full width. */
.site-footer #footer-contact .footer-contact-item,
.site-footer #footer-contact .footer-hours,
.site-footer #footer-contact .footer-contact-item > span,
.site-footer #footer-contact .footer-hours > span,
.site-footer #footer-contact .footer-hours-text,
.site-footer #footer-contact .footer-hours-text > span{
  width:auto!important;
  max-width:100%!important;
}
.site-footer #footer-contact .footer-contact-item,
.site-footer #footer-contact .footer-hours{
  margin-inline:auto!important;
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
}
.site-footer #footer-contact .footer-contact-icon{
  width:22px!important;
  min-width:22px!important;
  flex:0 0 22px!important;
}
.site-footer #footer-contact .footer-hours-text{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  text-align:center!important;
}


/* AQUA FLORA — RC2.15 mobile multilingual language-menu visibility fix */
@media (max-width:860px){
  .lang-switcher,
  .detail-lang-switcher{position:relative !important;overflow:visible !important;z-index:3700 !important;}
  .lang-switcher .lang-menu,
  .detail-lang-switcher .lang-menu{
    min-width:172px !important;
    width:max-content !important;
    max-width:min(88vw,220px) !important;
    top:calc(100% + 8px) !important;
    background:#fff !important;
    border:1px solid rgba(14,58,92,.14) !important;
    border-radius:12px !important;
    box-shadow:0 18px 42px rgba(7,42,61,.24) !important;
    opacity:1 !important;
    visibility:visible !important;
    z-index:3800 !important;
  }
  html[dir="ltr"] .lang-switcher .lang-menu,
  html[dir="ltr"] .detail-lang-switcher .lang-menu{
    left:0 !important; right:auto !important;
    inset-inline-start:0 !important; inset-inline-end:auto !important;
  }
  html[dir="rtl"] .lang-switcher .lang-menu,
  html[dir="rtl"] .detail-lang-switcher .lang-menu{
    right:0 !important; left:auto !important;
    inset-inline-end:0 !important; inset-inline-start:auto !important;
  }
  .lang-switcher .lang-menu button,
  .detail-lang-switcher .lang-menu button{color:var(--color-ink) !important;background:#fff !important;opacity:1 !important;visibility:visible !important;}
  .lang-switcher .lang-menu button:hover,
  .lang-switcher .lang-menu li[aria-selected="true"] button,
  .detail-lang-switcher .lang-menu button:hover,
  .detail-lang-switcher .lang-menu li[aria-selected="true"] button{background:var(--color-aqua-light) !important;color:var(--color-deep) !important;}
}