/* Production stylesheet distilled from the Atoms landing page. */
*,*::before,*::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:currentColor}
html{font-size:16px;scroll-behavior:smooth;-webkit-text-size-adjust:100%;tab-size:4;font-family:Jost,system-ui,sans-serif;line-height:1.5}
body{margin:0;background:#fff;color:#221A4A;font-family:Jost,system-ui,sans-serif;line-height:1.625}
h1,h2,h3,h4,h5,h6,p{margin:0} h1,h2,h3,h4,h5,h6{font-weight:700;letter-spacing:-.025em}
a{color:inherit;text-decoration:inherit} button,input,textarea{font:inherit;color:inherit;margin:0} button{background:transparent;cursor:pointer} textarea{font-family:inherit} img,svg{display:block;vertical-align:middle} img{max-width:100%;height:auto} ul{list-style:none;margin:0;padding:0} [hidden]{display:none!important}
.container{width:100%}.mx-auto{margin-left:auto;margin-right:auto}.max-w-2xl{max-width:42rem}.max-w-3xl{max-width:48rem}.max-w-4xl{max-width:56rem}.max-w-\[1400px\]{max-width:1400px}.min-h-screen{min-height:100vh}.min-h-\[48px\]{min-height:48px}
.block{display:block}.inline-flex{display:inline-flex}.flex{display:flex}.grid{display:grid}.fixed{position:fixed}.bottom-0{bottom:0}.left-0{left:0}.right-0{right:0}.z-50{z-index:50}.flex-1{flex:1 1 0%}.flex-col{flex-direction:column}.flex-shrink-0{flex-shrink:0}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-center{justify-content:center}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-5{gap:1.25rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.gap-10{gap:2.5rem}.space-y-2>:not([hidden])~:not([hidden]){margin-top:.5rem}.space-y-5>:not([hidden])~:not([hidden]){margin-top:1.25rem}
.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-10{width:2.5rem}.w-12{width:3rem}.w-auto{width:auto}.w-full{width:100%}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-10{height:2.5rem}.h-12{height:3rem}.h-16{height:4rem}.h-auto{height:auto}.h-full{height:100%}
.aspect-\[4\/3\]{aspect-ratio:4/3}.overflow-hidden{overflow:hidden}.object-cover{object-fit:cover}.resize-none{resize:none}
.p-3{padding:.75rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.px-4{padding-left:1rem;padding-right:1rem}.px-8{padding-left:2rem;padding-right:2rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-12{padding-top:3rem;padding-bottom:3rem}.py-16{padding-top:4rem;padding-bottom:4rem}.pt-6{padding-top:1.5rem}
.mb-1\.5{margin-bottom:.375rem}.mb-2{margin-bottom:.5rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.mb-10{margin-bottom:2.5rem}.mb-12{margin-bottom:3rem}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.mt-10{margin-top:2.5rem}
.rounded-md{border-radius:.375rem}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.border-2{border-width:2px}.border-t{border-top-width:1px}.border-t-2{border-top-width:2px}
.bg-white{background-color:#fff}.bg-\[\#221A4A\]{background-color:#221A4A}.bg-\[\#03BCCF\]{background-color:#03BCCF}.bg-\[\#221A4A\]\/5{background-color:rgba(34,26,74,.05)}.bg-\[\#221A4A\]\/\[0\.03\]{background-color:rgba(34,26,74,.03)}.bg-white\/10{background-color:rgba(255,255,255,.10)}
.text-white{color:#fff}.text-\[\#221A4A\]{color:#221A4A}.text-\[\#03BCCF\]{color:#03BCCF}.text-\[\#221A4A\]\/60{color:rgba(34,26,74,.60)}.text-\[\#221A4A\]\/70{color:rgba(34,26,74,.70)}.text-\[\#221A4A\]\/80{color:rgba(34,26,74,.80)}.text-white\/50{color:rgba(255,255,255,.50)}.text-white\/60{color:rgba(255,255,255,.60)}.text-white\/70{color:rgba(255,255,255,.70)}.text-white\/80{color:rgba(255,255,255,.80)}.text-white\/90{color:rgba(255,255,255,.90)}
.border-\[\#221A4A\]{border-color:#221A4A}.border-\[\#221A4A\]\/10{border-color:rgba(34,26,74,.10)}.border-\[\#221A4A\]\/20{border-color:rgba(34,26,74,.20)}.border-white\/10{border-color:rgba(255,255,255,.10)}.border-white\/20{border-color:rgba(255,255,255,.20)}.border-white\/30{border-color:rgba(255,255,255,.30)}
.text-center{text-align:center}.text-sm{font-size:.875rem;line-height:1.25rem}.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-2xl{font-size:1.5rem;line-height:2rem}.font-medium{font-weight:500}.font-bold{font-weight:700}.uppercase{text-transform:uppercase}.tracking-wide{letter-spacing:.025em}.tracking-wider{letter-spacing:.05em}.leading-tight{line-height:1.25}.leading-relaxed{line-height:1.625}
.brightness-0{filter:brightness(0)}.invert{filter:brightness(0) invert(1)}.shadow-\[0_-4px_12px_rgba\(0\,0\,0\,0\.1\)\]{box-shadow:0 -4px 12px rgba(0,0,0,.1)}
.transition-all{transition-property:all;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-opacity{transition-property:opacity;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-transform{transition-property:transform;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}
.placeholder\:text-white\/40::placeholder{color:rgba(255,255,255,.40);opacity:1}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring-2:focus{box-shadow:0 0 0 2px #03BCCF}.focus\:ring-\[\#03BCCF\]:focus{--ring-color:#03BCCF}.focus\:border-transparent:focus{border-color:transparent}
.hover\:bg-white\/90:hover{background-color:rgba(255,255,255,.90)}.hover\:bg-\[\#03BCCF\]\/90:hover{background-color:rgba(3,188,207,.90)}.hover\:border-\[\#221A4A\]:hover{border-color:#221A4A}.hover\:border-\[\#221A4A\]\/30:hover{border-color:rgba(34,26,74,.30)}.hover\:border-white:hover{border-color:#fff}.hover\:border-white\/50:hover{border-color:rgba(255,255,255,.50)}.hover\:opacity-90:hover{opacity:.9}.hover\:text-white:hover{color:#fff}.hover\:underline:hover{text-decoration-line:underline}.hover\:shadow-lg:hover{box-shadow:0 10px 15px -3px rgba(0,0,0,.10),0 4px 6px -4px rgba(0,0,0,.10)}.group:hover .group-hover\:scale-105{transform:scale(1.05)}
@media(min-width:640px){.sm\:flex-row{flex-direction:row}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.container{max-width:640px}}
@media(min-width:768px){.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.container{max-width:768px}}
@media(min-width:1024px){.lg\:hidden{display:none}.lg\:flex-1{flex:1 1 0%}.lg\:flex-row{flex-direction:row}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg\:gap-16{gap:4rem}.lg\:p-12{padding:3rem}.lg\:px-8{padding-left:2rem;padding-right:2rem}.lg\:py-24{padding-top:6rem;padding-bottom:6rem}.lg\:text-3xl{font-size:1.875rem;line-height:2.25rem}.lg\:text-4xl{font-size:2.25rem;line-height:2.5rem}.lg\:w-1\/3{width:33.333333%}.container{max-width:1024px}}
@media(min-width:1280px){.container{max-width:1280px}}
@media(min-width:1536px){.container{max-width:1400px}}

/* Current task: first screen fills the available viewport height. */
.hero-screen{min-height:100vh;min-height:100svh;display:flex;align-items:center}
.hero-screen>.container{width:100%}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.transition-all,.transition-colors,.transition-opacity,.transition-transform,.duration-200,.duration-300{transition-duration:0s!important}.group:hover .group-hover\:scale-105{transform:none}}

/* v1.2: anchor header + semantic hero subtitle */
:root{
  --header-height-top:88px;
  --header-height-scrolled:64px;
  --header-transition:220ms cubic-bezier(.4,0,.2,1);
}
section[id]{scroll-margin-top:calc(var(--header-height-scrolled) + 16px)}
.hero-subtitle{letter-spacing:-.015em}

.site-header{
  position:fixed;
  inset:0 0 auto 0;
  z-index:100;
  color:#fff;
  background:transparent;
  transition:background-color var(--header-transition),box-shadow var(--header-transition),color var(--header-transition),backdrop-filter var(--header-transition);
}
.site-header__inner{
  min-height:var(--header-height-top);
  display:flex;
  align-items:center;
  gap:28px;
  transition:min-height var(--header-transition);
}
.site-logo{display:inline-flex;align-items:center;flex:0 0 auto}
.site-logo img{display:block;width:auto;height:42px;transition:height var(--header-transition),filter var(--header-transition)}
.site-nav{display:flex;align-items:center;justify-content:center;gap:26px;margin-left:auto}
.site-nav a{
  position:relative;
  display:inline-flex;
  align-items:center;
  min-height:44px;
  font-size:.95rem;
  font-weight:500;
  white-space:nowrap;
  color:inherit;
  opacity:.9;
  transition:opacity var(--header-transition),color var(--header-transition);
}
.site-nav a::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:5px;
  height:2px;
  background:#03BCCF;
  transform:scaleX(0);
  transform-origin:center;
  transition:transform var(--header-transition);
}
.site-nav a:hover,.site-nav a:focus-visible,.site-nav a.is-active{opacity:1}
.site-nav a:hover::after,.site-nav a:focus-visible::after,.site-nav a.is-active::after{transform:scaleX(1)}
.site-header__cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:0 20px;
  border:1px solid rgba(255,255,255,.48);
  border-radius:.375rem;
  font-size:.95rem;
  font-weight:600;
  color:#fff;
  white-space:nowrap;
  transition:background-color var(--header-transition),border-color var(--header-transition),color var(--header-transition);
}
.site-header__cta:hover,.site-header__cta:focus-visible{background:#fff;border-color:#fff;color:#221A4A}
.site-menu-toggle{display:none;width:44px;height:44px;align-items:center;justify-content:center;border-radius:.375rem;color:inherit}
.menu-icon{width:24px;height:24px}.menu-icon--close{display:none}
.mobile-menu{display:none}

.site-header.is-scrolled{
  color:#221A4A;
  background:rgba(255,255,255,.96);
  box-shadow:0 8px 24px rgba(34,26,74,.09);
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
}
.site-header.is-scrolled .site-header__inner{min-height:var(--header-height-scrolled)}
.site-header.is-scrolled .site-logo img{height:34px}
.site-header.is-scrolled .site-header__cta{background:#221A4A;border-color:#221A4A;color:#fff}
.site-header.is-scrolled .site-header__cta:hover,.site-header.is-scrolled .site-header__cta:focus-visible{background:#03BCCF;border-color:#03BCCF;color:#fff}

@media(max-width:1023px){
  :root{--header-height-top:76px;--header-height-scrolled:60px}
  .site-header__inner{gap:14px}
  .site-logo img{height:36px}
  .site-header.is-scrolled .site-logo img{height:31px}
  .site-nav,.site-header__cta{display:none}
  .site-menu-toggle{display:inline-flex;margin-left:auto}
  .site-header.is-menu-open{color:#221A4A;background:#fff;box-shadow:0 8px 24px rgba(34,26,74,.09)}
  .site-header.is-menu-open .site-header__inner{min-height:var(--header-height-scrolled)}
  .site-header.is-menu-open .site-logo img{height:31px}
  .site-header.is-menu-open .menu-icon--open{display:none}
  .site-header.is-menu-open .menu-icon--close{display:block}
  .mobile-menu{
    display:block;
    max-height:0;
    overflow:hidden;
    opacity:0;
    pointer-events:none;
    background:#fff;
    border-top:1px solid rgba(34,26,74,.08);
    transition:max-height 260ms ease,opacity 180ms ease;
  }
  .site-header.is-menu-open .mobile-menu{max-height:430px;opacity:1;pointer-events:auto}
  .mobile-menu__inner{display:flex;flex-direction:column;padding-top:10px;padding-bottom:18px}
  .mobile-menu a{display:flex;align-items:center;min-height:48px;border-bottom:1px solid rgba(34,26,74,.08);font-weight:500;color:#221A4A}
  .mobile-menu a.is-active{color:#03AFC1}
  .mobile-menu__cta{justify-content:center;margin-top:12px;border:0!important;border-radius:.375rem;background:#221A4A;color:#fff!important;font-weight:600!important}
}

@media(prefers-reduced-motion:reduce){
  .site-header,.site-header__inner,.site-logo img,.site-nav a,.site-nav a::after,.site-header__cta,.mobile-menu{transition:none!important}
}


/* v1.3: hero illustration added while keeping copy readable */
.hero-screen{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 85% 28%, rgba(3,188,207,.22), transparent 22%),
    radial-gradient(circle at 92% 82%, rgba(255,255,255,.08), transparent 20%),
    #221A4A;
}
.hero-layout{
  display:grid;
  grid-template-columns:minmax(0, 1.04fr) minmax(340px, .96fr);
  align-items:center;
  gap:38px;
  position:relative;
  z-index:1;
  width:100%;
}
.hero-copy{
  position:relative;
  z-index:2;
}
.hero-actions{align-items:center}
.hero-visual{
  position:relative;
  display:flex;
  justify-content:flex-end;
  align-items:center;
  min-height:460px;
}
.hero-visual::before{
  content:"";
  position:absolute;
  inset:auto 0 12% auto;
  width:min(86%, 430px);
  aspect-ratio:1/1;
  border-radius:999px;
  background:radial-gradient(circle, rgba(255,255,255,.18) 0%, rgba(255,255,255,.07) 52%, rgba(255,255,255,0) 74%);
  filter:blur(4px);
}
.hero-visual__frame{
  position:relative;
  width:min(100%, 560px);
}
.hero-visual__image{
  display:block;
  width:100%;
  height:auto;
  object-fit:contain;
  filter:drop-shadow(0 18px 36px rgba(0,0,0,.28));
}
@media(min-width:1024px){
  .hero-copy{text-align:left}
  .hero-copy h1,.hero-copy h2,.hero-copy p{margin-left:0;margin-right:0}
  .hero-copy p{max-width:760px}
  .hero-actions{justify-content:flex-start}
}
@media(max-width:1279px){
  .hero-layout{grid-template-columns:minmax(0,1fr) minmax(300px,.9fr);gap:28px}
  .hero-visual{min-height:400px}
}
@media(max-width:1023px){
  .hero-layout{grid-template-columns:1fr;gap:22px}
  .hero-copy{text-align:center}
  .hero-actions{justify-content:center}
  .hero-visual{justify-content:center;min-height:auto;padding-bottom:8px}
  .hero-visual__frame{width:min(100%, 420px)}
}
@media(max-width:767px){
  .hero-screen{padding-top:calc(var(--header-height-top) + 16px)}
  .hero-visual__frame{width:min(100%, 340px)}
  .hero-visual::before{width:min(92%, 320px);inset:auto auto 10% 50%;transform:translateX(-50%)}
}


/* v1.4: cutout lift asset + subtle movement cue */
.hero-visual__frame{isolation:isolate}
.hero-visual__image--animated{
  animation:heroLiftFloat 6.2s ease-in-out infinite;
  transform-origin:52% 24%;
}
.hero-motion-indicator{
  position:absolute;
  right:-2px;
  top:16%;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  z-index:3;
  pointer-events:none;
}
.hero-motion-indicator__label{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 14px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  background:rgba(255,255,255,.08);
  backdrop-filter:blur(10px);
  color:rgba(255,255,255,.92);
  font-size:.84rem;
  font-weight:600;
  letter-spacing:.01em;
  box-shadow:0 10px 24px rgba(0,0,0,.18);
}
.hero-motion-indicator__track{
  position:relative;
  width:2px;
  height:146px;
  border-radius:999px;
  background:linear-gradient(180deg, rgba(3,188,207,.14) 0%, rgba(3,188,207,.95) 48%, rgba(3,188,207,.14) 100%);
  box-shadow:0 0 0 1px rgba(255,255,255,.06);
}
.hero-motion-indicator__dot{
  position:absolute;
  top:58px;
  left:50%;
  width:12px;
  height:12px;
  margin-left:-6px;
  border-radius:50%;
  background:#03BCCF;
  box-shadow:0 0 0 6px rgba(3,188,207,.14), 0 0 18px rgba(3,188,207,.42);
  animation:heroLiftDot 3.1s ease-in-out infinite;
}
.hero-motion-indicator__arrow{
  width:14px;
  height:14px;
  border-right:2px solid rgba(255,255,255,.92);
  border-bottom:2px solid rgba(255,255,255,.92);
}
.hero-motion-indicator__arrow--up{transform:rotate(-135deg)}
.hero-motion-indicator__arrow--down{transform:rotate(45deg)}
@keyframes heroLiftFloat{
  0%,100%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(0,-12px,0)}
}
@keyframes heroLiftDot{
  0%,100%{transform:translate3d(0,0,0);opacity:.92}
  50%{transform:translate3d(0,-84px,0);opacity:1}
}
@media(max-width:1279px){
  .hero-motion-indicator{right:6px;top:12%}
  .hero-motion-indicator__track{height:132px}
}
@media(max-width:1023px){
  .hero-motion-indicator{right:12px;top:6%}
  .hero-motion-indicator__label{font-size:.78rem;padding:7px 12px}
  .hero-motion-indicator__track{height:112px}
}
@media(max-width:767px){
  .hero-motion-indicator{top:auto;bottom:8px;right:14px}
  .hero-motion-indicator__label{display:none}
  .hero-motion-indicator__track{height:86px}
}
@media(prefers-reduced-motion:reduce){
  .hero-visual__image--animated,.hero-motion-indicator__dot{animation:none!important}
}


/* v1.6: interactive up/down hero lift demonstration */
.hero-visual__frame{
  --lift-y:0px;
  position:relative;
}
.hero-lift-demo__image{
  transform:translate3d(0,var(--lift-y),0);
  transition:transform 760ms cubic-bezier(.22,.8,.24,1),filter 220ms ease;
  will-change:transform;
}
.hero-lift-controls{
  position:absolute;
  z-index:8;
  right:4px;
  bottom:4%;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  width:min(290px,78%);
  padding:10px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:14px;
  background:rgba(34,26,74,.68);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
  box-shadow:0 18px 36px rgba(0,0,0,.22);
}
.hero-lift-controls__label{
  grid-column:1/-1;
  padding:0 4px 2px;
  color:rgba(255,255,255,.72);
  font-size:.75rem;
  font-weight:500;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.hero-lift-control{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:42px;
  padding:0 12px;
  border:1px solid rgba(255,255,255,.24);
  border-radius:9px;
  color:#fff;
  background:rgba(255,255,255,.08);
  font:inherit;
  font-size:.86rem;
  font-weight:600;
  cursor:pointer;
  transition:background-color 180ms ease,border-color 180ms ease,transform 180ms ease,opacity 180ms ease;
}
.hero-lift-control svg{width:18px;height:18px;flex:none}
.hero-lift-control:hover,.hero-lift-control:focus-visible{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.48)}
.hero-lift-control:active{transform:scale(.97)}
.hero-lift-control--accent{background:#03BCCF;border-color:#03BCCF;color:#fff}
.hero-lift-control--accent:hover,.hero-lift-control--accent:focus-visible{background:#02aebe;border-color:#02aebe}
.hero-lift-control:disabled{opacity:.36;cursor:default;transform:none}
.hero-lift-position{
  position:absolute;
  z-index:7;
  right:-15px;
  top:17%;
  width:18px;
  height:180px;
  pointer-events:none;
}
.hero-lift-position__line{
  position:absolute;
  inset:0 auto 0 8px;
  width:2px;
  border-radius:999px;
  background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(3,188,207,.9),rgba(255,255,255,.16));
}
.hero-lift-position__dot{
  position:absolute;
  top:0;
  left:3px;
  width:12px;
  height:12px;
  border-radius:50%;
  background:#03BCCF;
  box-shadow:0 0 0 5px rgba(3,188,207,.15),0 0 20px rgba(3,188,207,.35);
  transform:translateY(var(--lift-indicator-y,0px));
  transition:transform 760ms cubic-bezier(.22,.8,.24,1);
}
@media(max-width:1279px){
  .hero-lift-controls{right:8px;width:min(270px,82%)}
  .hero-lift-position{right:-4px;height:154px}
}
@media(max-width:1023px){
  .hero-lift-controls{right:50%;bottom:0;transform:translateX(50%);width:min(300px,88%)}
  .hero-lift-position{right:12px;top:12%;height:128px}
}
@media(max-width:639px){
  .hero-lift-controls{position:relative;right:auto;bottom:auto;transform:none;margin:10px auto 0;width:min(100%,300px)}
  .hero-lift-position{right:7px;top:8%;height:96px}
  .hero-lift-control{min-height:44px}
}
@media(prefers-reduced-motion:reduce){
  .hero-lift-demo__image,.hero-lift-position__dot{transition:none!important}
}


/* v1.7: fixed ceiling rail; only the lift unit moves vertically */
.hero-visual__frame{
  --lift-y:0px;
  --lift-progress:0;
  position:relative;
  min-height:520px;
}
.hero-ceiling-rail{
  position:absolute;
  z-index:1;
  top:9%;
  left:-5%;
  width:112%;
  height:34px;
  border-radius:4px;
  background:linear-gradient(180deg,#ffffff 0%,#f5f7fa 38%,#dce2e8 72%,#f9fafb 100%);
  box-shadow:0 6px 12px rgba(0,0,0,.18),inset 0 -1px 0 rgba(34,26,74,.18),inset 0 1px 0 rgba(255,255,255,.9);
  transform:rotate(4.2deg);
  transform-origin:center;
  pointer-events:none;
}
.hero-ceiling-rail__groove{
  position:absolute;
  left:2%;
  right:2%;
  bottom:6px;
  height:4px;
  border-radius:999px;
  background:linear-gradient(180deg,rgba(34,26,74,.42),rgba(34,26,74,.15));
  box-shadow:0 1px 0 rgba(255,255,255,.75);
}
.hero-lift-tether{
  position:absolute;
  z-index:2;
  top:12%;
  left:59.5%;
  width:5px;
  height:calc(34px + var(--lift-y));
  border-radius:999px;
  background:linear-gradient(90deg,#c5cbd1,#f8fafc 48%,#9ca5ae);
  box-shadow:0 0 0 1px rgba(34,26,74,.12),0 5px 12px rgba(0,0,0,.12);
  transform:rotate(4.2deg);
  transform-origin:top center;
  transition:height 760ms cubic-bezier(.22,.8,.24,1);
  pointer-events:none;
}
.hero-lift-demo__device{
  position:relative;
  z-index:3;
  clip-path:polygon(
    24% 29%, 28% 22%, 36% 17%, 43% 12%, 63% 11%, 69% 14%, 72% 21%,
    72% 38%, 69% 46%, 64% 51%, 72% 55%, 76% 62%, 72% 69%, 65% 74%,
    61% 81%, 54% 86%, 46% 92%, 39% 98%, 28% 98%, 27% 90%, 32% 83%,
    39% 76%, 43% 69%, 45% 60%, 39% 56%, 31% 54%, 27% 48%, 25% 40%
  );
  transform:translate3d(0,var(--lift-y),0);
  transition:transform 760ms cubic-bezier(.22,.8,.24,1),filter 220ms ease;
  will-change:transform;
}
.hero-lift-demo__device[data-position="1"],
.hero-lift-demo__device[data-position="2"],
.hero-lift-demo__device[data-position="3"]{
  filter:drop-shadow(0 22px 38px rgba(0,0,0,.26));
}
@media(max-width:1279px){
  .hero-visual__frame{min-height:470px}
  .hero-ceiling-rail{top:10%;height:30px}
  .hero-lift-tether{top:13%;left:59%;width:4px}
}
@media(max-width:1023px){
  .hero-visual__frame{min-height:430px}
  .hero-ceiling-rail{left:2%;width:96%;top:8%;height:28px}
  .hero-lift-tether{top:11%;left:58.5%}
}
@media(max-width:639px){
  .hero-visual__frame{min-height:390px}
  .hero-ceiling-rail{left:4%;width:92%;top:7%;height:24px}
  .hero-lift-tether{top:10%;left:58%;width:3px}
}
@media(prefers-reduced-motion:reduce){
  .hero-lift-demo__device,.hero-lift-tether{transition:none!important}
}


/* v1.9: contact layout + form appearance only. Typography preserved from v1.7. */
.contact-section{
  position:relative;
  overflow:hidden;
  padding:4rem 0;
  background:#221A4A;
}
.contact-section__grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(280px,.82fr) minmax(520px,1.18fr);
  align-items:center;
  gap:clamp(64px,8vw,132px);
}
.contact-section__intro{max-width:430px}
.contact-card{
  width:100%;
  max-width:650px;
  justify-self:end;
  padding:clamp(28px,3vw,42px);
  border:1px solid rgba(34,26,74,.08);
  border-radius:26px;
  background:#fff;
  box-shadow:0 22px 56px rgba(10,5,35,.25),0 3px 10px rgba(10,5,35,.08);
}
.contact-form{
  display:flex;
  flex-direction:column;
  gap:18px;
}
.contact-form__row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
.contact-field label{
  display:block;
  margin-bottom:.375rem;
  color:#2b2551;
  font-size:.875rem;
  font-weight:500;
  line-height:1.25rem;
}
.contact-field input,
.contact-field textarea{
  width:100%;
  border:2px solid #d7dbe5;
  border-radius:.375rem;
  background:#f4f6f8;
  color:#221A4A;
  font-family:inherit;
  font-size:1rem;
  line-height:1.5rem;
  outline:none;
  transition:border-color 160ms ease,box-shadow 160ms ease,background-color 160ms ease;
}
.contact-field input{
  min-height:48px;
  padding:.75rem 1rem;
}
.contact-field textarea{
  padding:.75rem 1rem;
  resize:none;
}
.contact-field input::placeholder,
.contact-field textarea::placeholder{
  color:#969bac;
  opacity:1;
}
.contact-field input:focus,
.contact-field textarea:focus{
  border-color:transparent;
  background:#fff;
  box-shadow:0 0 0 2px #03BCCF;
}
.contact-form__submit{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  width:100%;
  min-height:48px;
  border:0;
  border-radius:.375rem;
  background:#221A4A;
  color:#fff;
  font-family:inherit;
  font-size:1rem;
  font-weight:500;
  line-height:1.5rem;
  cursor:pointer;
  transition:background-color 160ms ease;
}
.contact-form__submit svg{width:1.25rem;height:1.25rem}
.contact-form__submit:hover,.contact-form__submit:focus-visible{background:#03AFC1}
.contact-form__direct{
  margin-top:.75rem;
  color:#969bac;
  font-size:.875rem;
  line-height:1.25rem;
  text-align:center;
}
.contact-form__direct a{color:#03BCCF}
.contact-form__direct a:hover{text-decoration:underline}
.contact-success{
  padding:2rem;
  text-align:center;
  color:#221A4A;
}
.contact-success[hidden]{display:none}
.contact-success__icon{
  width:3rem;
  height:3rem;
  margin:0 auto 1rem;
  color:#03BCCF;
}
.contact-success h3{
  margin:0 0 .5rem;
  font-size:1.125rem;
  font-weight:700;
  line-height:1.75rem;
}
.contact-success p{
  margin:0;
  font-size:1rem;
  line-height:1.5rem;
  color:rgba(34,26,74,.7);
}
@media(min-width:1024px){.contact-section{padding:6rem 0}}
@media(max-width:1023px){
  .contact-section__grid{grid-template-columns:1fr;gap:42px}
  .contact-section__intro{max-width:42rem}
  .contact-card{max-width:none;justify-self:stretch}
}
@media(max-width:639px){
  .contact-section__grid{gap:30px}
  .contact-form__row{grid-template-columns:1fr;gap:18px}
  .contact-card{padding:22px;border-radius:20px}
}
@media(prefers-reduced-motion:reduce){
  .contact-field input,.contact-field textarea,.contact-form__submit{transition:none!important}
}

/* v2.1: product gallery 70/30 + reliable sticky features column */
.product-showcase{
  display:grid;
  grid-template-columns:minmax(0,7fr) minmax(280px,3fr);
  gap:32px;
  align-items:start;
  overflow:visible;
}
.product-showcase__media{
  min-width:0;
  overflow:visible;
}
.product-showcase__hero{
  margin-bottom:16px;
  max-width:none;
}
.product-showcase__gallery{
  margin-bottom:0;
}
.product-showcase__aside{
  position:-webkit-sticky;
  position:sticky;
  top:calc(var(--header-height-scrolled) + 24px);
  align-self:start;
  height:max-content;
  min-width:0;
  z-index:2;
}
@media(max-width:1023px){
  .product-showcase{
    grid-template-columns:1fr;
    gap:24px;
  }
  .product-showcase__aside{
    position:static;
    top:auto;
  }
}


/* v2.2: dark sticky feature panel with internal CTA */
.product-feature-panel{
  background:#221A4A;
  color:#fff;
  border-radius:28px;
  padding:28px 28px 24px;
  box-shadow:0 22px 48px rgba(34,26,74,.12);
  border:1px solid rgba(255,255,255,.06);
}
.product-feature-panel__title{
  color:#fff;
  margin-bottom:22px;
}
.product-feature-panel__list{
  display:grid;
  grid-template-columns:1fr;
  gap:0;
}
.product-feature-panel__item{
  display:flex;
  align-items:flex-start;
  gap:12px;
  color:rgba(255,255,255,.86);
  padding:16px 0;
  border-bottom:1px solid rgba(255,255,255,.10);
}
.product-feature-panel__item:first-child{padding-top:0}
.product-feature-panel__item span{line-height:1.5}
.product-feature-panel__cta{
  margin-top:24px;
}
.product-feature-panel__button{
  width:100%;
  justify-content:center;
  background:#03BCCF;
  box-shadow:0 12px 24px rgba(3,188,207,.24);
  transition:opacity .2s ease, transform .2s ease;
}
.product-feature-panel__button:hover{opacity:.92;transform:translateY(-1px)}
@media(max-width:1023px){
  .product-feature-panel{padding:24px 22px 22px;border-radius:24px}
}


/* v2.3: full-screen premium photographic hero */
.hero-screen.hero-screen--premium{
  position:relative;
  min-height:100vh;
  min-height:100svh;
  display:flex;
  align-items:center;
  overflow:hidden;
  isolation:isolate;
  padding:calc(var(--header-height-top) + 58px) 0 64px;
  background:#161130;
}
.hero-screen__media,
.hero-screen__overlay{
  position:absolute;
  inset:0;
}
.hero-screen__media{
  z-index:-3;
  overflow:hidden;
}
.hero-screen__media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center 42%;
  transform:scale(1.025);
  animation:heroPremiumDrift 18s ease-in-out infinite alternate;
}
.hero-screen__overlay{
  z-index:-2;
  background:
    linear-gradient(90deg, rgba(19,14,48,.94) 0%, rgba(25,18,62,.86) 36%, rgba(30,23,71,.55) 60%, rgba(19,14,48,.18) 100%),
    linear-gradient(180deg, rgba(16,12,40,.40) 0%, rgba(16,12,40,.08) 48%, rgba(16,12,40,.58) 100%);
}
.hero-screen__overlay::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 68% 38%, rgba(3,188,207,.15), transparent 28%);
  mix-blend-mode:screen;
  opacity:.75;
}
.hero-screen__content{
  position:relative;
  width:100%;
  z-index:2;
}
.hero-copy--premium{
  max-width:720px;
  text-align:left;
  padding:36px 0 18px;
}
.hero-title{
  margin:0;
  max-width:760px;
  font-size:clamp(2.65rem,5.1vw,5.45rem);
  line-height:.98;
  letter-spacing:-.045em;
  text-wrap:balance;
  text-shadow:0 2px 28px rgba(0,0,0,.28);
}
.hero-title span{
  color:#03BCCF;
  display:inline-block;
}
.hero-subtitle{
  margin-top:22px;
  font-size:clamp(1.45rem,2.35vw,2.35rem);
  line-height:1.12;
  letter-spacing:-.02em;
  text-shadow:0 2px 18px rgba(0,0,0,.22);
}
.hero-description{
  margin-top:28px;
  max-width:680px;
  font-size:clamp(1rem,1.2vw,1.2rem);
  line-height:1.68;
  text-shadow:0 1px 16px rgba(0,0,0,.22);
}
.hero-actions--premium{
  margin-top:34px;
  justify-content:flex-start;
}
.hero-btn{
  min-height:52px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:0 26px;
  border-radius:8px;
  font-size:1rem;
  font-weight:600;
  transition:transform .2s ease,background-color .2s ease,border-color .2s ease,box-shadow .2s ease;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.hero-btn:hover{transform:translateY(-2px)}
.hero-btn--primary{
  background:#fff;
  color:#221A4A;
  box-shadow:0 14px 34px rgba(0,0,0,.20);
}
.hero-btn--primary:hover{box-shadow:0 18px 38px rgba(0,0,0,.26)}
.hero-btn--accent{
  background:#03BCCF;
  color:#fff;
  box-shadow:0 14px 34px rgba(3,188,207,.22);
}
.hero-btn--ghost{
  color:#fff;
  border:1px solid rgba(255,255,255,.38);
  background:rgba(26,19,64,.20);
}
.hero-btn--ghost:hover{
  border-color:rgba(255,255,255,.72);
  background:rgba(255,255,255,.08);
}
.hero-scroll-cue{
  position:absolute;
  left:50%;
  bottom:22px;
  z-index:3;
  width:34px;
  height:52px;
  margin-left:-17px;
  border:1px solid rgba(255,255,255,.52);
  border-radius:999px;
  display:flex;
  justify-content:center;
  padding-top:9px;
  opacity:.82;
}
.hero-scroll-cue span{
  width:4px;
  height:9px;
  border-radius:999px;
  background:#fff;
  animation:heroScrollDot 1.9s ease-in-out infinite;
}
@keyframes heroPremiumDrift{
  0%{transform:scale(1.025) translate3d(0,0,0)}
  100%{transform:scale(1.075) translate3d(-.7%, -.6%,0)}
}
@keyframes heroScrollDot{
  0%,100%{transform:translateY(0);opacity:.95}
  55%{transform:translateY(18px);opacity:.25}
}
@media(max-width:1023px){
  .hero-screen.hero-screen--premium{
    padding:calc(var(--header-height-top) + 40px) 0 58px;
  }
  .hero-screen__media img{object-position:58% 50%}
  .hero-screen__overlay{
    background:
      linear-gradient(90deg, rgba(19,14,48,.92) 0%, rgba(25,18,62,.78) 56%, rgba(19,14,48,.36) 100%),
      linear-gradient(180deg, rgba(16,12,40,.38) 0%, rgba(16,12,40,.10) 45%, rgba(16,12,40,.66) 100%);
  }
  .hero-copy--premium{max-width:640px}
}
@media(max-width:639px){
  .hero-screen.hero-screen--premium{
    align-items:flex-end;
    padding:calc(var(--header-height-top) + 36px) 0 82px;
  }
  .hero-screen__media img{
    object-position:61% center;
    transform:scale(1.06);
  }
  .hero-screen__overlay{
    background:
      linear-gradient(180deg, rgba(20,15,51,.40) 0%, rgba(20,15,51,.56) 38%, rgba(20,15,51,.94) 76%, rgba(20,15,51,.98) 100%),
      linear-gradient(90deg, rgba(20,15,51,.55) 0%, rgba(20,15,51,.18) 100%);
  }
  .hero-copy--premium{padding:0}
  .hero-title{font-size:clamp(2.35rem,12.5vw,3.65rem);line-height:1}
  .hero-subtitle{margin-top:16px;font-size:1.42rem}
  .hero-description{margin-top:20px;font-size:1rem;line-height:1.55}
  .hero-actions--premium{margin-top:24px}
  .hero-btn{width:100%}
  .hero-scroll-cue{bottom:18px}
}
@media(prefers-reduced-motion:reduce){
  .hero-screen__media img,.hero-scroll-cue span{animation:none!important}
}


/* v2.5: split hero with optimized original product WebP on the right */
.hero-screen--split-product{
  position:relative;
  min-height:100vh;
  min-height:100svh;
  display:flex;
  align-items:center;
  overflow:hidden;
  isolation:isolate;
  padding:calc(var(--header-height-top) + 42px) 0 64px;
  background:
    radial-gradient(circle at 76% 34%, rgba(255,255,255,.06) 0%, rgba(255,255,255,0) 24%),
    radial-gradient(circle at 84% 70%, rgba(3,188,207,.16) 0%, rgba(3,188,207,0) 26%),
    linear-gradient(135deg, #161130 0%, #21184a 58%, #261c55 100%);
}
.hero-screen--split-product .hero-screen__overlay{
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    linear-gradient(90deg, rgba(17,12,42,.88) 0%, rgba(22,16,52,.74) 34%, rgba(22,16,52,.26) 64%, rgba(22,16,52,.04) 100%),
    linear-gradient(180deg, rgba(14,10,36,.10) 0%, rgba(14,10,36,0) 46%, rgba(14,10,36,.16) 100%);
}
.hero-screen__content--product{
  position:relative;
  width:100%;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(0, 1.04fr) minmax(420px, .96fr);
  gap:40px;
  align-items:center;
}
.hero-copy--product{
  max-width:700px;
  text-align:left;
  padding:30px 0 18px;
}
.hero-product-visual{
  position:relative;
  min-width:0;
  display:flex;
  justify-content:flex-end;
  align-items:center;
  padding:8px 0 0;
}
.hero-product-visual__glow{
  position:absolute;
  inset:10% -4% 4% 12%;
  border-radius:999px;
  background:radial-gradient(circle at 50% 50%, rgba(255,255,255,.16) 0%, rgba(255,255,255,.06) 40%, rgba(255,255,255,0) 74%);
  filter:blur(10px);
}
.hero-product-visual img{
  position:relative;
  display:block;
  width:min(100%, 760px);
  height:auto;
  object-fit:contain;
  filter:drop-shadow(0 30px 42px rgba(5,4,22,.28));
  animation:heroProductFloat 7s ease-in-out infinite;
}
.hero-screen--split-product .hero-title{max-width:760px}
.hero-screen--split-product .hero-description{max-width:640px}
@keyframes heroProductFloat{
  0%,100%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(0,-8px,0)}
}
@media (max-width: 1199px){
  .hero-screen__content--product{grid-template-columns:minmax(0,1fr) minmax(340px,.9fr);gap:28px}
  .hero-product-visual img{width:min(100%, 620px)}
}
@media (max-width: 1023px){
  .hero-screen--split-product{padding:calc(var(--header-height-top) + 28px) 0 58px}
  .hero-screen__content--product{grid-template-columns:1fr;gap:22px}
  .hero-copy--product{max-width:640px;padding:16px 0 0}
  .hero-product-visual{justify-content:center}
  .hero-product-visual__glow{inset:16% 2% 6% 2%}
  .hero-product-visual img{width:min(100%, 540px)}
}
@media (max-width: 639px){
  .hero-screen--split-product{
    align-items:flex-start;
    padding:calc(var(--header-height-top) + 18px) 0 76px;
  }
  .hero-screen--split-product .hero-screen__overlay{
    background:
      linear-gradient(180deg, rgba(18,13,44,.22) 0%, rgba(18,13,44,.10) 24%, rgba(18,13,44,.82) 68%, rgba(18,13,44,.96) 100%),
      linear-gradient(90deg, rgba(18,13,44,.48) 0%, rgba(18,13,44,.14) 100%);
  }
  .hero-copy--product{padding:8px 0 0}
  .hero-product-visual img{width:min(100%, 390px)}
  .hero-product-visual__glow{inset:18% 0 8% 0}
}
@media(prefers-reduced-motion:reduce){
  .hero-product-visual img{animation:none!important}
}


/* v2.9: uploaded hospital corridor photo as full hero background */
.hero-screen--split-product{
  background:#161130;
}
.hero-screen__bg--corridor{
  position:absolute;
  inset:0;
  z-index:-2;
  background-image:url("../assets/hero-hospital-corridor.webp");
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
  transform:scale(1.01);
}
.hero-screen--split-product .hero-screen__overlay{
  z-index:-1;
  background:
    linear-gradient(90deg, rgba(11,8,34,.92) 0%, rgba(16,11,42,.86) 26%, rgba(20,14,48,.64) 44%, rgba(20,14,48,.30) 64%, rgba(20,14,48,.18) 100%),
    linear-gradient(180deg, rgba(11,8,34,.10) 0%, rgba(11,8,34,.03) 48%, rgba(11,8,34,.16) 100%);
}
.hero-screen--split-product .hero-screen__overlay::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 78% 44%, rgba(255,255,255,.12), transparent 22%),
    radial-gradient(circle at 73% 50%, rgba(3,188,207,.10), transparent 28%);
}
@media (max-width:1023px){
  .hero-screen__bg--corridor{
    background-position:62% center;
  }
  .hero-screen--split-product .hero-screen__overlay{
    background:
      linear-gradient(180deg, rgba(14,10,38,.40) 0%, rgba(16,11,42,.26) 22%, rgba(16,11,42,.74) 68%, rgba(16,11,42,.94) 100%),
      linear-gradient(90deg, rgba(11,8,34,.56) 0%, rgba(11,8,34,.18) 100%);
  }
}
@media (max-width:639px){
  .hero-screen__bg--corridor{
    background-position:66% center;
  }
}


/* v3.0: chosen photo #1 prepared for Hero + separate Carima illustration on the right */
.hero-screen__bg--room{
  position:absolute;
  inset:0;
  z-index:-3;
  background-image:url("../assets/hero-hospital-room.webp");
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
  transform:scale(1.008);
}

/* Text readability without flattening the realistic background. */
.hero-screen--split-product .hero-screen__overlay{
  z-index:-2;
  background:
    linear-gradient(90deg,
      rgba(13,9,36,.94) 0%,
      rgba(17,12,43,.88) 24%,
      rgba(22,15,51,.70) 43%,
      rgba(22,15,51,.34) 61%,
      rgba(19,13,47,.12) 100%
    ),
    linear-gradient(180deg,
      rgba(10,7,28,.10) 0%,
      rgba(10,7,28,.02) 46%,
      rgba(10,7,28,.18) 100%
    );
}
.hero-screen--split-product .hero-screen__overlay::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 80% 42%, rgba(255,255,255,.10), transparent 24%),
    radial-gradient(circle at 76% 50%, rgba(3,188,207,.08), transparent 28%);
}

/* Keep the real Carima render independent and clearly visible above the room background. */
.hero-product-visual{
  position:relative;
  z-index:2;
}
.hero-product-visual img{
  width:min(112%, 820px);
  max-width:none;
  margin-right:-5%;
  filter:drop-shadow(0 28px 46px rgba(5,4,22,.34));
}
.hero-product-visual__glow{
  opacity:.74;
  inset:6% -8% 0 5%;
  filter:blur(14px);
}

@media(max-width:1199px){
  .hero-product-visual img{
    width:min(108%, 690px);
    margin-right:-3%;
  }
}

@media(max-width:1023px){
  .hero-screen__bg--room{
    background-position:58% center;
  }
  .hero-screen--split-product .hero-screen__overlay{
    background:
      linear-gradient(180deg, rgba(13,9,36,.42) 0%, rgba(15,10,40,.24) 24%, rgba(16,11,43,.74) 68%, rgba(15,10,39,.95) 100%),
      linear-gradient(90deg, rgba(12,8,31,.56) 0%, rgba(12,8,31,.18) 100%);
  }
  .hero-product-visual img{
    width:min(100%, 560px);
    margin-right:0;
  }
}

@media(max-width:639px){
  .hero-screen__bg--room{
    background-position:64% center;
    transform:scale(1.02);
  }
  .hero-product-visual img{
    width:min(100%, 420px);
  }
}


/* v3.1: darker Carima side + soft disappearing product edges */
.hero-screen--split-product .hero-screen__overlay{
  background:
    linear-gradient(90deg,
      rgba(10,7,30,0) 0%,
      rgba(10,7,30,0) 46%,
      rgba(10,7,30,.14) 61%,
      rgba(10,7,30,.31) 79%,
      rgba(10,7,30,.44) 100%
    ),
    linear-gradient(90deg,
      rgba(13,9,36,.94) 0%,
      rgba(17,12,43,.88) 24%,
      rgba(22,15,51,.70) 43%,
      rgba(22,15,51,.34) 61%,
      rgba(19,13,47,.12) 100%
    ),
    linear-gradient(180deg,
      rgba(10,7,28,.10) 0%,
      rgba(10,7,28,.02) 46%,
      rgba(10,7,28,.18) 100%
    );
}

.hero-product-visual::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:1% -12% -4% -7%;
  border-radius:50%;
  background:
    radial-gradient(ellipse at 57% 48%,
      rgba(12,8,34,.55) 0%,
      rgba(12,8,34,.39) 43%,
      rgba(12,8,34,.17) 66%,
      rgba(12,8,34,0) 82%
    );
  filter:blur(16px);
  pointer-events:none;
}

.hero-product-visual img{
  -webkit-mask-image:linear-gradient(90deg,
    transparent 0%,
    rgba(0,0,0,.34) 3.5%,
    rgba(0,0,0,.78) 7%,
    #000 12%,
    #000 88%,
    rgba(0,0,0,.78) 93%,
    rgba(0,0,0,.34) 96.5%,
    transparent 100%
  );
  mask-image:linear-gradient(90deg,
    transparent 0%,
    rgba(0,0,0,.34) 3.5%,
    rgba(0,0,0,.78) 7%,
    #000 12%,
    #000 88%,
    rgba(0,0,0,.78) 93%,
    rgba(0,0,0,.34) 96.5%,
    transparent 100%
  );
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-size:100% 100%;
  mask-size:100% 100%;
  filter:
    brightness(.94)
    contrast(1.025)
    drop-shadow(0 30px 48px rgba(4,3,20,.40));
}

@media(max-width:1023px){
  .hero-product-visual img{
    -webkit-mask-image:linear-gradient(90deg,
      transparent 0%,
      rgba(0,0,0,.7) 5%,
      #000 10%,
      #000 90%,
      rgba(0,0,0,.7) 95%,
      transparent 100%
    );
    mask-image:linear-gradient(90deg,
      transparent 0%,
      rgba(0,0,0,.7) 5%,
      #000 10%,
      #000 90%,
      rgba(0,0,0,.7) 95%,
      transparent 100%
    );
  }
}


/* v3.2: darker Carima, no animation */
.hero-screen--split-product .hero-screen__overlay{
  background:
    linear-gradient(90deg,
      rgba(8,5,26,0) 0%,
      rgba(8,5,26,0) 43%,
      rgba(8,5,26,.24) 58%,
      rgba(8,5,26,.46) 76%,
      rgba(8,5,26,.62) 100%
    ),
    linear-gradient(90deg,
      rgba(13,9,36,.94) 0%,
      rgba(17,12,43,.88) 24%,
      rgba(22,15,51,.70) 43%,
      rgba(22,15,51,.34) 61%,
      rgba(19,13,47,.12) 100%
    ),
    linear-gradient(180deg,
      rgba(10,7,28,.12) 0%,
      rgba(10,7,28,.04) 46%,
      rgba(10,7,28,.24) 100%
    );
}

.hero-product-visual::before{
  background:
    radial-gradient(ellipse at 57% 48%,
      rgba(9,6,28,.72) 0%,
      rgba(9,6,28,.55) 42%,
      rgba(9,6,28,.30) 65%,
      rgba(9,6,28,0) 84%
    );
  filter:blur(18px);
}

.hero-product-visual img{
  animation:none !important;
  transform:none !important;
  filter:
    brightness(.84)
    contrast(1.04)
    drop-shadow(0 30px 48px rgba(4,3,20,.46));
}


/* v3.3: uniform overlay across whole Hero, no local shadow under Carima */
.hero-screen--split-product .hero-screen__overlay{
  background: rgba(16, 11, 43, 0.68) !important;
}
.hero-screen--split-product .hero-screen__overlay::after{
  content: none !important;
}
.hero-product-visual::before{
  content: none !important;
}
.hero-product-visual__glow{
  display: none !important;
}
.hero-product-visual img{
  filter: brightness(.86) contrast(1.03) !important;
}


/* v3.4: keep left side as-is, darken the right side of the Hero */
.hero-screen--split-product .hero-screen__overlay{
  background:
    linear-gradient(90deg,
      rgba(16,11,43,0.68) 0%,
      rgba(16,11,43,0.68) 52%,
      rgba(14,10,37,0.76) 68%,
      rgba(12,8,31,0.84) 82%,
      rgba(10,7,28,0.90) 100%
    ) !important;
}

/* no extra glow or local shadow under Carima */
.hero-screen--split-product .hero-screen__overlay::after{
  content:none !important;
}
.hero-product-visual::before{
  content:none !important;
}
.hero-product-visual__glow{
  display:none !important;
}


/* v3.5: smoother left edge of the Carima ceiling rail */
.hero-product-visual img{
  -webkit-mask-image:linear-gradient(90deg,
    transparent 0%,
    rgba(0,0,0,.10) 4%,
    rgba(0,0,0,.28) 8%,
    rgba(0,0,0,.52) 12%,
    rgba(0,0,0,.78) 17%,
    #000 23%,
    #000 88%,
    rgba(0,0,0,.78) 93%,
    rgba(0,0,0,.34) 96.5%,
    transparent 100%
  ) !important;
  mask-image:linear-gradient(90deg,
    transparent 0%,
    rgba(0,0,0,.10) 4%,
    rgba(0,0,0,.28) 8%,
    rgba(0,0,0,.52) 12%,
    rgba(0,0,0,.78) 17%,
    #000 23%,
    #000 88%,
    rgba(0,0,0,.78) 93%,
    rgba(0,0,0,.34) 96.5%,
    transparent 100%
  ) !important;
  -webkit-mask-repeat:no-repeat !important;
  mask-repeat:no-repeat !important;
  -webkit-mask-size:100% 100% !important;
  mask-size:100% 100% !important;
}


/* v3.6: use the uploaded hospital-room WebP as the final Hero background */
.hero-screen__bg--corridor,
.hero-screen__bg--room{
  background-image:url("../assets/hero-hospital-room-final.webp") !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
}
@media(max-width:1023px){
  .hero-screen__bg--corridor,
  .hero-screen__bg--room{
    background-position:58% center !important;
  }
}
@media(max-width:639px){
  .hero-screen__bg--corridor,
  .hero-screen__bg--room{
    background-position:62% center !important;
  }
}


/* v3.7: one uniform darker overlay + cleaner Carima edge fade */
.hero-screen--split-product .hero-screen__overlay{
  background:rgba(15,10,40,.76) !important;
}
.hero-screen--split-product .hero-screen__overlay::after{
  content:none !important;
  display:none !important;
}

/* Remove any local vignette / glow so the whole Hero has one consistent tone */
.hero-product-visual::before,
.hero-product-visual__glow{
  content:none !important;
  display:none !important;
}

/* Smooth both ends of the long ceiling rail so it does not look cut off */
.hero-product-visual img{
  animation:none !important;
  transform:none !important;

  -webkit-mask-image:linear-gradient(90deg,
    transparent 0%,
    rgba(0,0,0,.08) 3%,
    rgba(0,0,0,.24) 6%,
    rgba(0,0,0,.50) 10%,
    rgba(0,0,0,.76) 14%,
    #000 19%,
    #000 81%,
    rgba(0,0,0,.76) 86%,
    rgba(0,0,0,.50) 90%,
    rgba(0,0,0,.24) 94%,
    rgba(0,0,0,.08) 97%,
    transparent 100%
  ) !important;

  mask-image:linear-gradient(90deg,
    transparent 0%,
    rgba(0,0,0,.08) 3%,
    rgba(0,0,0,.24) 6%,
    rgba(0,0,0,.50) 10%,
    rgba(0,0,0,.76) 14%,
    #000 19%,
    #000 81%,
    rgba(0,0,0,.76) 86%,
    rgba(0,0,0,.50) 90%,
    rgba(0,0,0,.24) 94%,
    rgba(0,0,0,.08) 97%,
    transparent 100%
  ) !important;

  -webkit-mask-repeat:no-repeat !important;
  mask-repeat:no-repeat !important;
  -webkit-mask-size:100% 100% !important;
  mask-size:100% 100% !important;

  filter:brightness(.88) contrast(1.02) !important;
}

@media(max-width:1023px){
  .hero-screen--split-product .hero-screen__overlay{
    background:rgba(15,10,40,.78) !important;
  }

  .hero-product-visual img{
    -webkit-mask-image:linear-gradient(90deg,
      transparent 0%,
      rgba(0,0,0,.22) 5%,
      rgba(0,0,0,.62) 9%,
      #000 14%,
      #000 86%,
      rgba(0,0,0,.62) 91%,
      rgba(0,0,0,.22) 95%,
      transparent 100%
    ) !important;

    mask-image:linear-gradient(90deg,
      transparent 0%,
      rgba(0,0,0,.22) 5%,
      rgba(0,0,0,.62) 9%,
      #000 14%,
      #000 86%,
      rgba(0,0,0,.62) 91%,
      rgba(0,0,0,.22) 95%,
      transparent 100%
    ) !important;
  }
}


/* v3.8: darker uniform Hero overlay */
.hero-screen--split-product .hero-screen__overlay{
  background:rgba(12,8,34,.84) !important;
}

@media(max-width:1023px){
  .hero-screen--split-product .hero-screen__overlay{
    background:rgba(12,8,34,.86) !important;
  }
}


/* v3.12: insert final transparent Carima PNG into Hero */
.hero-product-visual{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
}

.hero-product-visual img{
  width:min(100%, 760px) !important;
  max-width:100% !important;
  max-height:64vh !important;
  height:auto !important;
  object-fit:contain !important;
  object-position:center right !important;
  margin-right:0 !important;
  margin-left:auto !important;

  -webkit-mask-image:none !important;
  mask-image:none !important;
  animation:none !important;
  transform:none !important;
  filter:none !important;
}

.hero-product-visual::before,
.hero-product-visual__glow{
  content:none !important;
  display:none !important;
}

@media (max-width: 1199px){
  .hero-product-visual img{
    width:min(100%, 680px) !important;
    max-height:58vh !important;
  }
}

@media (max-width: 1023px){
  .hero-product-visual{
    justify-content:center !important;
  }

  .hero-product-visual img{
    width:min(100%, 520px) !important;
    max-height:42vh !important;
    object-position:center !important;
    margin-left:0 !important;
  }
}

@media (max-width: 639px){
  .hero-product-visual img{
    width:min(100%, 390px) !important;
    max-height:34vh !important;
  }
}


/* v3.13: subtle fade / mask on Carima outer edges */
.hero-product-visual img{
  -webkit-mask-image:
    linear-gradient(90deg,
      transparent 0%,
      rgba(0,0,0,.18) 3%,
      rgba(0,0,0,.55) 6%,
      rgba(0,0,0,.85) 9%,
      #000 13%,
      #000 87%,
      rgba(0,0,0,.85) 91%,
      rgba(0,0,0,.55) 94%,
      rgba(0,0,0,.18) 97%,
      transparent 100%
    ) !important;

  mask-image:
    linear-gradient(90deg,
      transparent 0%,
      rgba(0,0,0,.18) 3%,
      rgba(0,0,0,.55) 6%,
      rgba(0,0,0,.85) 9%,
      #000 13%,
      #000 87%,
      rgba(0,0,0,.85) 91%,
      rgba(0,0,0,.55) 94%,
      rgba(0,0,0,.18) 97%,
      transparent 100%
    ) !important;

  -webkit-mask-repeat:no-repeat !important;
  mask-repeat:no-repeat !important;
  -webkit-mask-size:100% 100% !important;
  mask-size:100% 100% !important;
}

/* On smaller screens keep the fade shorter so the product stays clearly visible */
@media(max-width:1023px){
  .hero-product-visual img{
    -webkit-mask-image:
      linear-gradient(90deg,
        transparent 0%,
        rgba(0,0,0,.55) 4%,
        #000 9%,
        #000 91%,
        rgba(0,0,0,.55) 96%,
        transparent 100%
      ) !important;

    mask-image:
      linear-gradient(90deg,
        transparent 0%,
        rgba(0,0,0,.55) 4%,
        #000 9%,
        #000 91%,
        rgba(0,0,0,.55) 96%,
        transparent 100%
      ) !important;
  }
}


/* v3.14: stronger / longer fade on LEFT edge of Carima rail */
.hero-product-visual img{
  -webkit-mask-image:linear-gradient(90deg,
    transparent 0%,
    rgba(0,0,0,.03) 5%,
    rgba(0,0,0,.10) 9%,
    rgba(0,0,0,.24) 13%,
    rgba(0,0,0,.45) 17%,
    rgba(0,0,0,.68) 21%,
    rgba(0,0,0,.86) 25%,
    #000 29%,
    #000 87%,
    rgba(0,0,0,.85) 91%,
    rgba(0,0,0,.55) 94%,
    rgba(0,0,0,.18) 97%,
    transparent 100%
  ) !important;

  mask-image:linear-gradient(90deg,
    transparent 0%,
    rgba(0,0,0,.03) 5%,
    rgba(0,0,0,.10) 9%,
    rgba(0,0,0,.24) 13%,
    rgba(0,0,0,.45) 17%,
    rgba(0,0,0,.68) 21%,
    rgba(0,0,0,.86) 25%,
    #000 29%,
    #000 87%,
    rgba(0,0,0,.85) 91%,
    rgba(0,0,0,.55) 94%,
    rgba(0,0,0,.18) 97%,
    transparent 100%
  ) !important;

  -webkit-mask-repeat:no-repeat !important;
  mask-repeat:no-repeat !important;
  -webkit-mask-size:100% 100% !important;
  mask-size:100% 100% !important;
}

@media(max-width:1023px){
  .hero-product-visual img{
    -webkit-mask-image:linear-gradient(90deg,
      transparent 0%,
      rgba(0,0,0,.10) 6%,
      rgba(0,0,0,.35) 11%,
      rgba(0,0,0,.68) 16%,
      #000 22%,
      #000 90%,
      rgba(0,0,0,.55) 96%,
      transparent 100%
    ) !important;

    mask-image:linear-gradient(90deg,
      transparent 0%,
      rgba(0,0,0,.10) 6%,
      rgba(0,0,0,.35) 11%,
      rgba(0,0,0,.68) 16%,
      #000 22%,
      #000 90%,
      rgba(0,0,0,.55) 96%,
      transparent 100%
    ) !important;
  }
}


/* v3.16: make LEFT edge fade the same as RIGHT edge */
.hero-product-visual img{
  -webkit-mask-image:linear-gradient(90deg,
    transparent 0%,
    rgba(0,0,0,.18) 3%,
    rgba(0,0,0,.55) 6%,
    rgba(0,0,0,.85) 9%,
    #000 13%,
    #000 87%,
    rgba(0,0,0,.85) 91%,
    rgba(0,0,0,.55) 94%,
    rgba(0,0,0,.18) 97%,
    transparent 100%
  ) !important;

  mask-image:linear-gradient(90deg,
    transparent 0%,
    rgba(0,0,0,.18) 3%,
    rgba(0,0,0,.55) 6%,
    rgba(0,0,0,.85) 9%,
    #000 13%,
    #000 87%,
    rgba(0,0,0,.85) 91%,
    rgba(0,0,0,.55) 94%,
    rgba(0,0,0,.18) 97%,
    transparent 100%
  ) !important;

  -webkit-mask-repeat:no-repeat !important;
  mask-repeat:no-repeat !important;
  -webkit-mask-size:100% 100% !important;
  mask-size:100% 100% !important;
}

@media(max-width:1023px){
  .hero-product-visual img{
    -webkit-mask-image:linear-gradient(90deg,
      transparent 0%,
      rgba(0,0,0,.55) 4%,
      #000 9%,
      #000 91%,
      rgba(0,0,0,.55) 96%,
      transparent 100%
    ) !important;

    mask-image:linear-gradient(90deg,
      transparent 0%,
      rgba(0,0,0,.55) 4%,
      #000 9%,
      #000 91%,
      rgba(0,0,0,.55) 96%,
      transparent 100%
    ) !important;
  }
}


/* v3.17: LEFT rail fade is physically baked into PNG alpha.
   CSS mask now fades ONLY the right edge. */
.hero-product-visual img{
  -webkit-mask-image:linear-gradient(90deg,
    #000 0%,
    #000 87%,
    rgba(0,0,0,.85) 91%,
    rgba(0,0,0,.55) 94%,
    rgba(0,0,0,.18) 97%,
    transparent 100%
  ) !important;

  mask-image:linear-gradient(90deg,
    #000 0%,
    #000 87%,
    rgba(0,0,0,.85) 91%,
    rgba(0,0,0,.55) 94%,
    rgba(0,0,0,.18) 97%,
    transparent 100%
  ) !important;

  -webkit-mask-repeat:no-repeat !important;
  mask-repeat:no-repeat !important;
  -webkit-mask-size:100% 100% !important;
  mask-size:100% 100% !important;
}


/* v3.18: optimized WEBP blueprint illustration in the background of "Dla kogo" section */
.care-solutions-section{
  position:relative;
  overflow:hidden;
  background-color:#fbfbfd;
  isolation:isolate;
}

.care-solutions-section::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;

  background-image:url('../assets/dla-kogo-blueprint-bg.webp');
  background-repeat:no-repeat;
  background-position:right center;
  background-size:min(72%, 980px);

  opacity:0.12;
}

.care-solutions-section > .container{
  position:relative;
  z-index:1;
}

@media (max-width: 1023px){
  .care-solutions-section::before{
    background-position:center top;
    background-size:120% auto;
    opacity:0.09;
  }
}

@media (max-width: 639px){
  .care-solutions-section::before{
    background-position:center top;
    background-size:145% auto;
    opacity:0.07;
  }
}


/* v3.19: white cards + centered full-width blueprint background */
.care-solutions-section::before{
  background-position:center center !important;
  background-size:100% auto !important;
  opacity:0.11 !important;
}

.care-solutions-section article{
  background:#ffffff !important;
}

@media (max-width: 1023px){
  .care-solutions-section::before{
    background-position:center center !important;
    background-size:135% auto !important;
    opacity:0.09 !important;
  }
}

@media (max-width: 639px){
  .care-solutions-section::before{
    background-position:center center !important;
    background-size:180% auto !important;
    opacity:0.07 !important;
  }
}


/* v3.20: subtle parallax for the blueprint background in "Dla kogo" */
.care-solutions-section{
  --blueprint-parallax-y: 0px;
}

.care-solutions-section::before{
  top:-12% !important;
  bottom:-12% !important;
  inset-inline:0 !important;
  height:auto !important;
  transform:translate3d(0, var(--blueprint-parallax-y), 0) scale(1.06);
  transform-origin:center center;
  will-change:transform;
}

@media(max-width:1023px){
  .care-solutions-section::before{
    top:-8% !important;
    bottom:-8% !important;
    transform:translate3d(0, var(--blueprint-parallax-y), 0) scale(1.08);
  }
}

@media(prefers-reduced-motion:reduce){
  .care-solutions-section::before{
    transform:none !important;
    will-change:auto;
  }
}


/* v3.21: clearly visible parallax movement in "Dla kogo" */
.care-solutions-section{
  --blueprint-parallax-y: 0px;
}

.care-solutions-section::before{
  top:-28% !important;
  bottom:-28% !important;
  left:0 !important;
  right:0 !important;
  background-position:center center !important;
  background-size:112% auto !important;
  transform:translate3d(0, var(--blueprint-parallax-y), 0) !important;
  will-change:transform;
}

@media(max-width:1023px){
  .care-solutions-section::before{
    top:-22% !important;
    bottom:-22% !important;
    background-size:155% auto !important;
  }
}

@media(max-width:639px){
  .care-solutions-section::before{
    top:-18% !important;
    bottom:-18% !important;
    background-size:195% auto !important;
  }
}

@media(prefers-reduced-motion:reduce){
  .care-solutions-section::before{
    transform:none !important;
    will-change:auto !important;
  }
}


/* v3.22: full blueprint always visible + visible parallax */
.care-solutions-section{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  --blueprint-parallax-y:0px;
}

/* Disable old pseudo-element background completely */
.care-solutions-section::before{
  content:none !important;
  display:none !important;
}

/* Real image layer: whole illustration stays visible */
.care-solutions-blueprint-parallax{
  position:absolute;
  z-index:0;
  left:0;
  top:8%;
  width:100%;
  height:84%;
  object-fit:contain;
  object-position:center center;
  opacity:.13;
  pointer-events:none;
  user-select:none;

  transform:translate3d(0, var(--blueprint-parallax-y), 0);
  will-change:transform;
}

.care-solutions-section > .container{
  position:relative;
  z-index:1;
}

.care-solutions-section article{
  background:#fff !important;
}

@media(max-width:1023px){
  .care-solutions-blueprint-parallax{
    top:10%;
    height:80%;
    opacity:.10;
  }
}

@media(max-width:639px){
  .care-solutions-blueprint-parallax{
    top:12%;
    height:76%;
    opacity:.08;
  }
}

@media(prefers-reduced-motion:reduce){
  .care-solutions-blueprint-parallax{
    transform:none !important;
    will-change:auto;
  }
}


/* v3.23: hover image for first service card "Projekt" */
.service-card{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:#fff;
}

.service-card--project::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  background-image:url("../assets/service-project-hover.webp");
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
  opacity:0;
  transform:scale(1.04);
  transition:opacity .35s ease, transform .55s ease;
}

.service-card--project::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:rgba(255,255,255,.72);
  opacity:0;
  transition:opacity .35s ease;
}

.service-card--project:hover::before{
  opacity:.42;
  transform:scale(1);
}

.service-card--project:hover::after{
  opacity:1;
}

/* Keep text and icon crisp/readable over the hover photo */
.service-card--project > *{
  position:relative;
  z-index:1;
}

.service-card--project:hover > div:first-child{
  background:rgba(255,255,255,.92) !important;
  box-shadow:0 6px 18px rgba(34,26,74,.08);
}

.service-card--project:hover h3{
  color:#221A4A !important;
}

.service-card--project:hover p{
  color:rgba(34,26,74,.78) !important;
}


/* v3.24: hover backgrounds for Montaż, Serwis, Gwarancja — same style as Projekt */
.service-card--montaz::before,
.service-card--serwis::before,
.service-card--gwarancja::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
  opacity:0;
  transform:scale(1.04);
  transition:opacity .35s ease, transform .55s ease;
}

.service-card--montaz::before{
  background-image:url("../assets/egerton-montaz-podnosnika-sufitowego.webp");
}

.service-card--serwis::before{
  background-image:url("../assets/egerton-serwis-podnosnika-sufitowego.webp");
}

.service-card--gwarancja::before{
  background-image:url("../assets/egerton-gwarancja-podnosnika-sufitowego.webp");
}

.service-card--montaz::after,
.service-card--serwis::after,
.service-card--gwarancja::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:rgba(255,255,255,.72);
  opacity:0;
  transition:opacity .35s ease;
}

.service-card--montaz:hover::before,
.service-card--serwis:hover::before,
.service-card--gwarancja:hover::before{
  opacity:.42;
  transform:scale(1);
}

.service-card--montaz:hover::after,
.service-card--serwis:hover::after,
.service-card--gwarancja:hover::after{
  opacity:1;
}

.service-card--montaz > *,
.service-card--serwis > *,
.service-card--gwarancja > *{
  position:relative;
  z-index:1;
}

.service-card--montaz:hover > div:first-child,
.service-card--serwis:hover > div:first-child,
.service-card--gwarancja:hover > div:first-child{
  background:rgba(255,255,255,.92) !important;
  box-shadow:0 6px 18px rgba(34,26,74,.08);
}

.service-card--montaz:hover h3,
.service-card--serwis:hover h3,
.service-card--gwarancja:hover h3{
  color:#221A4A !important;
}

.service-card--montaz:hover p,
.service-card--serwis:hover p,
.service-card--gwarancja:hover p{
  color:rgba(34,26,74,.78) !important;
}

/* v3.26: cards show images by default; hover turns card white */
.service-card--project,
.service-card--montaz,
.service-card--serwis,
.service-card--gwarancja{
  transition:border-color .28s ease, box-shadow .28s ease, transform .28s ease, background-color .28s ease;
}

.service-card--project::before,
.service-card--montaz::before,
.service-card--serwis::before,
.service-card--gwarancja::before{
  opacity:.62 !important;
  transform:scale(1) !important;
}

.service-card--project::after,
.service-card--montaz::after,
.service-card--serwis::after,
.service-card--gwarancja::after{
  opacity:1 !important;
  background:rgba(255,255,255,.58) !important;
}

.service-card--project > div:first-child,
.service-card--montaz > div:first-child,
.service-card--serwis > div:first-child,
.service-card--gwarancja > div:first-child{
  background:rgba(255,255,255,.88) !important;
  box-shadow:0 8px 22px rgba(34,26,74,.08);
}

.service-card--project:hover,
.service-card--montaz:hover,
.service-card--serwis:hover,
.service-card--gwarancja:hover{
  background:#ffffff !important;
  box-shadow:0 16px 34px rgba(34,26,74,.10);
  border-color:rgba(34,26,74,.18) !important;
}

.service-card--project:hover::before,
.service-card--montaz:hover::before,
.service-card--serwis:hover::before,
.service-card--gwarancja:hover::before{
  opacity:0 !important;
  transform:scale(1.02) !important;
}

.service-card--project:hover::after,
.service-card--montaz:hover::after,
.service-card--serwis:hover::after,
.service-card--gwarancja:hover::after{
  opacity:1 !important;
  background:rgba(255,255,255,.98) !important;
}

.service-card--project:hover > div:first-child,
.service-card--montaz:hover > div:first-child,
.service-card--serwis:hover > div:first-child,
.service-card--gwarancja:hover > div:first-child{
  background:#ffffff !important;
  box-shadow:0 8px 22px rgba(34,26,74,.06);
}

.service-card--project h3,
.service-card--montaz h3,
.service-card--serwis h3,
.service-card--gwarancja h3{
  color:#221A4A !important;
}

.service-card--project p,
.service-card--montaz p,
.service-card--serwis p,
.service-card--gwarancja p{
  color:rgba(34,26,74,.82) !important;
}

/* v3.27: lighter visible cards, image fills full card, no white side bands */
.service-card--project,
.service-card--montaz,
.service-card--serwis,
.service-card--gwarancja{
  background:transparent !important;
}

.service-card--project::before,
.service-card--montaz::before,
.service-card--serwis::before,
.service-card--gwarancja::before{
  inset:-1px !important;
  z-index:0 !important;
  opacity:.92 !important;
  transform:scale(1) !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  border-radius:inherit !important;
}

.service-card--project::after,
.service-card--montaz::after,
.service-card--serwis::after,
.service-card--gwarancja::after{
  inset:0 !important;
  z-index:1 !important;
  opacity:1 !important;
  background:rgba(255,255,255,.34) !important;
  border-radius:inherit !important;
}

.service-card--project > *,
.service-card--montaz > *,
.service-card--serwis > *,
.service-card--gwarancja > *{
  position:relative !important;
  z-index:2 !important;
}

.service-card--project > div:first-child,
.service-card--montaz > div:first-child,
.service-card--serwis > div:first-child,
.service-card--gwarancja > div:first-child{
  background:rgba(255,255,255,.82) !important;
  box-shadow:0 8px 22px rgba(34,26,74,.07) !important;
}

.service-card--project:hover,
.service-card--montaz:hover,
.service-card--serwis:hover,
.service-card--gwarancja:hover{
  background:#ffffff !important;
}

.service-card--project:hover::before,
.service-card--montaz:hover::before,
.service-card--serwis:hover::before,
.service-card--gwarancja:hover::before{
  opacity:0 !important;
}

.service-card--project:hover::after,
.service-card--montaz:hover::after,
.service-card--serwis:hover::after,
.service-card--gwarancja:hover::after{
  opacity:1 !important;
  background:rgba(255,255,255,.97) !important;
}

/* v3.28: service cards redesigned to match reference more clearly */
#dlaczego-my .service-card{
  min-height:338px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;
  padding:40px 32px 28px !important;
  overflow:hidden !important;
  background:transparent !important;
  border:1.5px solid rgba(34,26,74,.16) !important;
  box-shadow:none !important;
}

#dlaczego-my .service-card::before{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:0 !important;
  opacity:1 !important;
  transform:none !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  border-radius:inherit !important;
}

#dlaczego-my .service-card::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  opacity:1 !important;
  background:rgba(255,255,255,.70) !important;
  border-radius:inherit !important;
  transition:background .28s ease, opacity .28s ease !important;
}

#dlaczego-my .service-card > *{
  position:relative !important;
  z-index:2 !important;
}

#dlaczego-my .service-card > div:first-child{
  width:60px !important;
  height:60px !important;
  margin-bottom:20px !important;
  background:rgba(255,255,255,.92) !important;
  box-shadow:0 10px 24px rgba(34,26,74,.08) !important;
}

#dlaczego-my .service-card h3{
  color:#221A4A !important;
  font-size:24px !important;
  line-height:1.15 !important;
  margin-bottom:12px !important;
}

#dlaczego-my .service-card p{
  color:rgba(34,26,74,.82) !important;
  font-size:18px !important;
  line-height:1.7 !important;
  max-width:100% !important;
}

#dlaczego-my .service-card:hover{
  border-color:rgba(34,26,74,.22) !important;
  box-shadow:0 14px 36px rgba(34,26,74,.08) !important;
  transform:none !important;
  background:#fff !important;
}

#dlaczego-my .service-card:hover::after{
  background:rgba(255,255,255,.96) !important;
}

#dlaczego-my .service-card:hover::before{
  opacity:.22 !important;
}

@media (max-width: 1279px){
  #dlaczego-my .service-card{
    min-height:320px !important;
  }
  #dlaczego-my .service-card h3{
    font-size:22px !important;
  }
  #dlaczego-my .service-card p{
    font-size:17px !important;
  }
}

@media (max-width: 767px){
  #dlaczego-my .service-card{
    min-height:300px !important;
    padding:28px 24px 24px !important;
  }
  #dlaczego-my .service-card h3{
    font-size:21px !important;
  }
  #dlaczego-my .service-card p{
    font-size:16px !important;
    line-height:1.6 !important;
  }
}

/* v3.29: final service-card composition matched to the supplied reference. */
#dlaczego-my > .container{
  max-width:1400px !important;
}

#dlaczego-my .grid{
  gap:24px !important;
}

#dlaczego-my .service-card{
  min-height:412px !important;
  height:100% !important;
  padding:40px 32px 30px !important;
  border:1px solid rgba(34,26,74,.14) !important;
  border-radius:14px !important;
  background:transparent !important;
  box-shadow:none !important;
  transform:none !important;
}

#dlaczego-my .service-card:first-child{
  border:2px solid #221A4A !important;
  box-shadow:0 10px 24px rgba(34,26,74,.09) !important;
}

#dlaczego-my .service-card::before{
  inset:0 !important;
  opacity:1 !important;
  transform:none !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
  border-radius:12px !important;
}

#dlaczego-my .service-card--project::before{
  background-position:center center !important;
}

#dlaczego-my .service-card--montaz::before{
  background-position:center center !important;
}

#dlaczego-my .service-card--serwis::before{
  background-position:center center !important;
}

#dlaczego-my .service-card--gwarancja::before{
  background-position:center center !important;
}

#dlaczego-my .service-card::after{
  inset:0 !important;
  opacity:1 !important;
  background:rgba(255,255,255,.68) !important;
  border-radius:12px !important;
}

#dlaczego-my .service-card > div:first-child{
  flex:0 0 80px !important;
  width:80px !important;
  height:80px !important;
  margin:0 0 48px !important;
  border-radius:14px !important;
  background:rgba(255,255,255,.94) !important;
  box-shadow:0 8px 22px rgba(34,26,74,.06) !important;
}

#dlaczego-my .service-card > div:first-child svg{
  width:34px !important;
  height:34px !important;
}

#dlaczego-my .service-card h3{
  margin:0 0 12px !important;
  font-size:24px !important;
  line-height:1.2 !important;
}

#dlaczego-my .service-card p{
  margin:0 !important;
  font-size:19px !important;
  line-height:1.65 !important;
  color:rgba(34,26,74,.86) !important;
}

#dlaczego-my .service-card:hover,
#dlaczego-my .service-card:focus-within{
  border:2px solid #221A4A !important;
  background:transparent !important;
  box-shadow:0 10px 24px rgba(34,26,74,.09) !important;
  transform:none !important;
}

#dlaczego-my .service-card:hover::before,
#dlaczego-my .service-card:focus-within::before{
  opacity:1 !important;
  transform:none !important;
}

#dlaczego-my .service-card:hover::after,
#dlaczego-my .service-card:focus-within::after{
  background:rgba(255,255,255,.68) !important;
}

@media (max-width: 1279px){
  #dlaczego-my .service-card{
    min-height:360px !important;
    padding:32px 28px 28px !important;
  }

  #dlaczego-my .service-card > div:first-child{
    flex-basis:68px !important;
    width:68px !important;
    height:68px !important;
    margin-bottom:34px !important;
  }

  #dlaczego-my .service-card > div:first-child svg{
    width:30px !important;
    height:30px !important;
  }

  #dlaczego-my .service-card h3{
    font-size:22px !important;
  }

  #dlaczego-my .service-card p{
    font-size:17px !important;
    line-height:1.62 !important;
  }
}

@media (max-width: 767px){
  #dlaczego-my .grid{
    gap:18px !important;
  }

  #dlaczego-my .service-card{
    min-height:330px !important;
    padding:28px 24px 26px !important;
  }

  #dlaczego-my .service-card > div:first-child{
    flex-basis:64px !important;
    width:64px !important;
    height:64px !important;
    margin-bottom:30px !important;
  }

  #dlaczego-my .service-card h3{
    font-size:21px !important;
  }

  #dlaczego-my .service-card p{
    font-size:16px !important;
    line-height:1.6 !important;
  }
}

/* v3.31 final cascade override: clean image, then white card with border on hover. */
#dlaczego-my .service-card,
#dlaczego-my .service-card:first-child{
  border:2px solid transparent !important;
  box-shadow:none !important;
  transition:border-color .28s ease,box-shadow .28s ease !important;
}
#dlaczego-my .service-card:hover,
#dlaczego-my .service-card:focus-within{
  border-color:#221A4A !important;
  background:#fff !important;
  box-shadow:0 10px 24px rgba(34,26,74,.09) !important;
}
#dlaczego-my .service-card:hover::before,
#dlaczego-my .service-card:focus-within::before{opacity:0 !important}
#dlaczego-my .service-card:hover::after,
#dlaczego-my .service-card:focus-within::after{
  opacity:1 !important;
  background:#fff !important;
}
#dlaczego-my .service-card:hover > div:first-child,
#dlaczego-my .service-card:focus-within > div:first-child{
  background:#fff !important;
  box-shadow:0 8px 22px rgba(34,26,74,.06) !important;
}


/* v3.34: clickable illustrations and product photos open at full size on click/tap. */
#dlaczego-my .service-card[data-service-lightbox-src],
.product-lightbox-trigger,
[data-lightbox-src]{
  cursor:zoom-in !important;
}

#dlaczego-my .service-card[data-service-lightbox-src]:focus-visible,
.product-lightbox-trigger:focus-visible,
[data-lightbox-src]:focus-visible{
  outline:3px solid rgba(34,26,74,.42) !important;
  outline-offset:4px !important;
}

.service-lightbox{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:clamp(18px,3vw,44px);
  background:rgba(13,10,28,.88);
  opacity:0;
  visibility:hidden;
  transition:opacity .2s ease,visibility .2s ease;
}

.service-lightbox.is-open{
  opacity:1;
  visibility:visible;
}

.service-lightbox__dialog{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  width:min(94vw,1500px);
  height:min(90dvh,1000px);
}

.service-lightbox__image{
  display:block;
  max-width:100%;
  max-height:100%;
  width:auto;
  height:auto;
  object-fit:contain;
  border-radius:12px;
  box-shadow:0 24px 70px rgba(0,0,0,.35);
}

.service-lightbox__close{
  position:absolute;
  top:-12px;
  right:-12px;
  z-index:2;
  display:grid;
  place-items:center;
  width:46px;
  height:46px;
  padding:0;
  border:0;
  border-radius:999px;
  background:#fff;
  color:#221A4A;
  font-size:30px;
  line-height:1;
  cursor:pointer;
  box-shadow:0 10px 28px rgba(0,0,0,.22);
}

.service-lightbox__close:focus-visible{
  outline:3px solid #fff;
  outline-offset:3px;
}

body.service-lightbox-open{
  overflow:hidden;
}

@media (max-width: 767px){
  .service-lightbox{
    padding:16px;
  }
  .service-lightbox__dialog{
    width:100%;
    height:calc(100dvh - 32px);
  }
  .service-lightbox__close{
    top:0;
    right:0;
    width:44px;
    height:44px;
  }
}

@media (prefers-reduced-motion:reduce){
  .service-lightbox{
    transition:none;
  }
}

/* v3.36: section labels styled like the supplied cyan CTA reference —
   solid Egerton cyan, white bold text, with stronger rounded corners. */
.section-eyebrow{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:.58rem 1.2rem;
  margin-bottom:.9rem !important;
  border:0 !important;
  border-radius:20px !important;
  background:#14b8ca !important;
  color:#fff !important;
  font-weight:800 !important;
  letter-spacing:.04em !important;
  line-height:1.05;
  text-transform:none !important;
  box-shadow:none !important;
}

.section-eyebrow::before{
  content:none !important;
}

#usluga .section-eyebrow,
#kontakt .section-eyebrow{
  background:#14b8ca !important;
  color:#fff !important;
  border:0 !important;
  box-shadow:none !important;
}

@media (max-width: 767px){
  .section-eyebrow{
    min-height:36px;
    padding:.52rem 1rem;
    border-radius:18px !important;
    font-size:.78rem !important;
    letter-spacing:.03em !important;
  }
}

/* v3.37: H2 and H3 styled closer to the bold hero typography. */
main section:not(.hero-screen) h2,
main section:not(.hero-screen) h3{
  font-weight:900 !important;
  letter-spacing:-.055em !important;
  text-wrap:balance;
  text-rendering:geometricPrecision;
}

main section:not(.hero-screen) h2{
  line-height:.96 !important;
}

main section:not(.hero-screen) h3{
  line-height:1.02 !important;
}

main section:not(.hero-screen) h2 span,
main section:not(.hero-screen) h3 span{
  color:#03BCCF;
}

#dlaczego-my h3,
#produkt h3,
#usluga h3,
#dla-kogo h3,
#kontakt h3{
  font-size:clamp(1.1rem,1.35vw,1.45rem) !important;
}

#dlaczego-my h2,
#produkt h2,
#usluga h2,
#dla-kogo h2,
#kontakt h2{
  font-size:clamp(2rem,3.4vw,3.6rem) !important;
}

@media (max-width: 767px){
  #dlaczego-my h2,
  #produkt h2,
  #usluga h2,
  #dla-kogo h2,
  #kontakt h2{
    font-size:clamp(1.75rem,9vw,2.5rem) !important;
  }

  #dlaczego-my h3,
  #produkt h3,
  #usluga h3,
  #dla-kogo h3,
  #kontakt h3{
    font-size:1.08rem !important;
  }
}

/* v3.38: add turquoise accent to H2/H3 and refine responsive sizing for phone/tablet. */
main section:not(.hero-screen) h2,
main section:not(.hero-screen) h3{
  background-image:linear-gradient(90deg, #221A4A 0 62%, #03BCCF 62% 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent !important;
}

#usluga h2,
#usluga h3,
#kontakt h2,
#kontakt h3{
  background-image:linear-gradient(90deg, #ffffff 0 62%, #03BCCF 62% 100%);
}

#dlaczego-my h2,
#produkt h2,
#usluga h2,
#dla-kogo h2,
#kontakt h2{
  font-size:clamp(1.85rem, 2.1vw + 1rem, 3.35rem) !important;
  line-height:.98 !important;
}

#dlaczego-my h3,
#produkt h3,
#usluga h3,
#dla-kogo h3,
#kontakt h3{
  font-size:clamp(1rem, .6vw + .9rem, 1.4rem) !important;
  line-height:1.06 !important;
}

@media (min-width: 768px) and (max-width: 1024px){
  #dlaczego-my h2,
  #produkt h2,
  #usluga h2,
  #dla-kogo h2,
  #kontakt h2{
    font-size:clamp(2.15rem, 3.2vw, 2.8rem) !important;
  }

  #dlaczego-my h3,
  #produkt h3,
  #usluga h3,
  #dla-kogo h3,
  #kontakt h3{
    font-size:1.08rem !important;
  }
}

@media (max-width: 767px){
  main section:not(.hero-screen) h2,
  main section:not(.hero-screen) h3{
    background-image:linear-gradient(180deg, currentColor 0%, currentColor 0%);
    -webkit-background-clip:initial;
    background-clip:initial;
  }

  #dlaczego-my h2,
  #produkt h2,
  #dla-kogo h2{
    color:#221A4A !important;
  }

  #usluga h2,
  #kontakt h2{
    color:#ffffff !important;
  }

  #dlaczego-my h3,
  #produkt h3,
  #dla-kogo h3,
  #usluga h3,
  #kontakt h3{
    color:#03BCCF !important;
  }

  #dlaczego-my h2,
  #produkt h2,
  #usluga h2,
  #dla-kogo h2,
  #kontakt h2{
    font-size:clamp(1.55rem, 7vw, 2.2rem) !important;
    line-height:1.02 !important;
  }

  #dlaczego-my h3,
  #produkt h3,
  #usluga h3,
  #dla-kogo h3,
  #kontakt h3{
    font-size:clamp(.98rem, 4.4vw, 1.14rem) !important;
    line-height:1.12 !important;
  }
}

/* v3.39 FIX: deliberate Egerton turquoise accents — no gradient clipping through letters. */
main section:not(.hero-screen) h2,
main section:not(.hero-screen) h3{
  background:none !important;
  -webkit-background-clip:initial !important;
  background-clip:initial !important;
  -webkit-text-fill-color:currentColor !important;
}

/* Light sections keep the main heading dark; only explicit <span> accents are turquoise. */
#dlaczego-my h2,
#dlaczego-my h3,
#produkt h2,
#produkt h3,
#dla-kogo h2,
#dla-kogo h3{
  color:#221A4A !important;
}

/* Dark sections keep the main heading white; only explicit <span> accents are turquoise. */
#usluga h2,
#usluga h3,
#kontakt h2,
#kontakt h3{
  color:#fff !important;
}

main section:not(.hero-screen) h2 > span,
main section:not(.hero-screen) h3 > span{
  color:#03BCCF !important;
  -webkit-text-fill-color:#03BCCF !important;
}

/* Responsive heading scale inspired by the hero, without overwhelming phone/tablet layouts. */
#dlaczego-my h2,
#produkt h2,
#usluga h2,
#dla-kogo h2,
#kontakt h2{
  font-size:clamp(2.15rem,3.15vw,3.7rem) !important;
  line-height:.98 !important;
  letter-spacing:-.055em !important;
  font-weight:900 !important;
}

#dlaczego-my h3,
#produkt h3,
#usluga h3,
#dla-kogo h3,
#kontakt h3{
  font-size:clamp(1.12rem,.72vw + .78rem,1.55rem) !important;
  line-height:1.05 !important;
  letter-spacing:-.045em !important;
  font-weight:900 !important;
}

@media (min-width:768px) and (max-width:1180px){
  #dlaczego-my h2,
  #produkt h2,
  #usluga h2,
  #dla-kogo h2,
  #kontakt h2{
    font-size:clamp(2.25rem,4.2vw,3.05rem) !important;
  }

  #dlaczego-my h3,
  #produkt h3,
  #usluga h3,
  #dla-kogo h3,
  #kontakt h3{
    font-size:clamp(1.08rem,1.65vw,1.3rem) !important;
    line-height:1.08 !important;
  }
}

@media (max-width:767px){
  #dlaczego-my h2,
  #produkt h2,
  #usluga h2,
  #dla-kogo h2,
  #kontakt h2{
    font-size:clamp(1.85rem,8.4vw,2.35rem) !important;
    line-height:1 !important;
    letter-spacing:-.05em !important;
  }

  #dlaczego-my h3,
  #produkt h3,
  #usluga h3,
  #dla-kogo h3,
  #kontakt h3{
    font-size:clamp(1.02rem,4.8vw,1.2rem) !important;
    line-height:1.1 !important;
    letter-spacing:-.035em !important;
  }
}

/* v3.40: remove duplicated Kontakt nav tab and keep all H3 headings in one solid color. */
main section:not(.hero-screen) h3{
  background:none !important;
  -webkit-background-clip:initial !important;
  background-clip:initial !important;
  color:#221A4A !important;
}

#usluga h3,
#kontakt h3{
  color:#ffffff !important;
}

/* v3.41 definitive fix: H3 is always a single solid color; only H2 may use turquoise spans. */
main section:not(.hero-screen) h3,
main section:not(.hero-screen) h3 > span{
  background:none !important;
  -webkit-background-clip:initial !important;
  background-clip:initial !important;
  -webkit-text-fill-color:currentColor !important;
}

#dlaczego-my h3,
#produkt h3,
#dla-kogo h3{
  color:#221A4A !important;
}

#usluga h3,
#kontakt h3{
  color:#ffffff !important;
}

main section:not(.hero-screen) h3 > span{
  color:inherit !important;
}

/* v3.42: keep the feature-panel heading visible on the dark card. */
#produkt .product-feature-panel .product-feature-panel__title,
#produkt .product-feature-panel .product-feature-panel__title > span{
  color:#ffffff !important;
  background:none !important;
  -webkit-background-clip:initial !important;
  background-clip:initial !important;
  -webkit-text-fill-color:#ffffff !important;
}

/* v3.43: compact landing-page footer with direct contact + one CTA. */
.landing-footer{
  background:#221A4A;
  color:#fff;
  border-top:1px solid rgba(255,255,255,.10);
}

.landing-footer__inner{
  padding-top:34px;
  padding-bottom:18px;
}

.landing-footer__grid{
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(260px,.9fr) minmax(260px,.85fr);
  gap:clamp(28px,4vw,72px);
  align-items:center;
}

.landing-footer__brand{
  max-width:480px;
}

.landing-footer__logo{
  display:block;
  width:auto;
  height:38px;
  object-fit:contain;
  object-position:left center;
}

.landing-footer__brand p{
  margin-top:14px;
  max-width:470px;
  color:rgba(255,255,255,.72);
  font-size:1rem;
  line-height:1.6;
}

.landing-footer__contact h4{
  margin:0 0 12px;
  color:#fff;
  font-size:.82rem;
  font-weight:800;
  line-height:1.2;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.landing-footer__contact{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}

.landing-footer__contact a{
  display:inline-flex;
  align-items:center;
  gap:9px;
  min-height:31px;
  color:rgba(255,255,255,.82);
  font-size:.96rem;
  line-height:1.3;
  text-decoration:none;
  transition:color .18s ease, transform .18s ease;
}

.landing-footer__contact a:hover{
  color:#fff;
  transform:translateX(2px);
}

.landing-footer__contact svg{
  width:17px;
  height:17px;
  flex:0 0 17px;
  color:#03BCCF;
}

.landing-footer__cta{
  justify-self:end;
  width:min(100%,320px);
}

.landing-footer__cta p{
  margin:0 0 12px;
  color:rgba(255,255,255,.72);
  font-size:.95rem;
  line-height:1.45;
}

.landing-footer__cta > a{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:52px;
  width:100%;
  padding:0 22px;
  border-radius:18px;
  background:#03BCCF;
  color:#fff;
  font-weight:700;
  font-size:1rem;
  text-decoration:none;
  box-shadow:0 12px 28px rgba(3,188,207,.18);
  transition:transform .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.landing-footer__cta > a:hover{
  transform:translateY(-2px);
  background:#12c5d6;
  box-shadow:0 16px 32px rgba(3,188,207,.24);
}

.landing-footer__cta svg{
  width:19px;
  height:19px;
}

.landing-footer__bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-top:28px;
  padding-top:15px;
  border-top:1px solid rgba(255,255,255,.10);
  color:rgba(255,255,255,.50);
  font-size:.82rem;
  line-height:1.4;
}

.landing-footer__bottom a{
  color:rgba(255,255,255,.68);
  text-decoration:none;
}

.landing-footer__bottom a:hover{
  color:#fff;
  text-decoration:underline;
}

@media (max-width:1023px){
  .landing-footer__grid{
    grid-template-columns:minmax(0,1fr) minmax(240px,.85fr);
    align-items:start;
  }

  .landing-footer__cta{
    grid-column:1 / -1;
    justify-self:stretch;
    width:100%;
    max-width:none;
    display:grid;
    grid-template-columns:1fr minmax(250px,340px);
    align-items:center;
    gap:20px;
  }

  .landing-footer__cta p{
    margin:0;
  }
}

@media (max-width:639px){
  .landing-footer__inner{
    padding-top:28px;
    padding-bottom:14px;
  }

  .landing-footer__grid{
    grid-template-columns:1fr;
    gap:26px;
  }

  .landing-footer__brand,
  .landing-footer__contact,
  .landing-footer__cta{
    width:100%;
    max-width:none;
  }

  .landing-footer__logo{
    height:34px;
  }

  .landing-footer__brand p{
    font-size:.94rem;
  }

  .landing-footer__cta{
    grid-column:auto;
    display:block;
  }

  .landing-footer__cta p{
    margin-bottom:10px;
  }

  .landing-footer__bottom{
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
    margin-top:24px;
  }
}



/* v3.46: make the contact section visually richer with a photo background and a strong parallax layer. */
.contact-section{
  isolation:isolate;
  --contact-parallax-y:0px;
  --contact-parallax-scale:1.18;
  background:#1f184b;
}

.contact-section::before{
  content:"";
  position:absolute;
  inset:-10% -4%;
  z-index:0;
  background-image:
    linear-gradient(90deg, rgba(31,24,75,.93) 0%, rgba(31,24,75,.88) 30%, rgba(31,24,75,.72) 58%, rgba(31,24,75,.46) 100%),
    linear-gradient(180deg, rgba(19,14,48,.16) 0%, rgba(19,14,48,.04) 42%, rgba(19,14,48,.22) 100%),
    url("../assets/hero-hospital-room-final.webp");
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
  transform:translate3d(0, var(--contact-parallax-y), 0) scale(var(--contact-parallax-scale));
  transform-origin:center center;
  will-change:transform;
  filter:saturate(1.03) contrast(1.02);
}

.contact-section::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    radial-gradient(circle at 78% 22%, rgba(3,188,207,.22), transparent 24%),
    radial-gradient(circle at 16% 76%, rgba(3,188,207,.10), transparent 20%),
    linear-gradient(180deg, rgba(255,255,255,.02) 0%, rgba(255,255,255,0) 18%, rgba(255,255,255,.03) 100%);
}

.contact-section__intro,
.contact-card{
  position:relative;
  z-index:2;
}

.contact-section__intro{
  padding:clamp(18px, 2vw, 28px) 0;
}

.contact-section__intro .section-eyebrow,
.contact-section__intro h2,
.contact-section__intro p{
  position:relative;
  z-index:2;
}

@media(max-width:1023px){
  .contact-section::before{
    inset:-9% -8%;
    background-position:62% center;
  }
}

@media(max-width:639px){
  .contact-section::before{
    inset:-8% -12%;
    background-position:68% center;
  }
}

@media(prefers-reduced-motion:reduce){
  .contact-section::before{transform:none !important}
}

/* v3.47: strong, reliable scroll-linked section lift. */
.scroll-lift-section{
  --lift-section-y:0px;
  --lift-content-y:0px;
  --lift-content-scale:1;
  --lift-content-opacity:1;
  position:relative;
  z-index:1;
  transform:translate3d(0,var(--lift-section-y),0);
  will-change:transform;
}

.scroll-lift-section > .container{
  transform:translate3d(0,var(--lift-content-y),0) scale(var(--lift-content-scale));
  transform-origin:50% 0%;
  opacity:var(--lift-content-opacity);
  will-change:transform,opacity;
}

/* Deliberately strong desktop motion so the effect is unmistakable. */
.scroll-lift-ready .scroll-lift-section{
  --lift-section-y:120px;
  --lift-content-y:190px;
  --lift-content-scale:.955;
  --lift-content-opacity:.24;
}

@media(max-width:1024px){
  .scroll-lift-ready .scroll-lift-section{
    --lift-section-y:88px;
    --lift-content-y:135px;
    --lift-content-scale:.968;
    --lift-content-opacity:.34;
  }
}

@media(max-width:767px){
  .scroll-lift-ready .scroll-lift-section{
    --lift-section-y:54px;
    --lift-content-y:86px;
    --lift-content-scale:.982;
    --lift-content-opacity:.50;
  }
}

@media(prefers-reduced-motion:reduce){
  .scroll-lift-section,
  .scroll-lift-section > .container{
    transform:none !important;
    opacity:1 !important;
  }
}

/* v3.48: redesigned Kontakt background — photo lives mainly on the left,
   while the form keeps a clean high-contrast zone on the right. */
.contact-section{
  --contact-parallax-x:0px;
  --contact-parallax-y:0px;
  --contact-parallax-scale:1.24;
  min-height:clamp(700px,82vh,900px);
  display:flex;
  align-items:center;
  background:#221A4A !important;
}

.contact-section::before{
  inset:-18% auto -18% -8% !important;
  width:72% !important;
  background-image:url("../assets/hero-hospital-corridor.webp") !important;
  background-size:cover !important;
  background-position:42% center !important;
  filter:saturate(.92) contrast(1.08) brightness(.82) !important;
  opacity:1 !important;
  transform:translate3d(var(--contact-parallax-x),var(--contact-parallax-y),0) scale(var(--contact-parallax-scale)) !important;
  transform-origin:center center !important;
}

.contact-section::after{
  z-index:1 !important;
  background:
    linear-gradient(90deg,
      rgba(25,18,63,.82) 0%,
      rgba(28,20,69,.78) 28%,
      rgba(31,23,74,.82) 48%,
      rgba(34,26,74,.96) 66%,
      #221A4A 78%,
      #221A4A 100%),
    radial-gradient(circle at 22% 40%,rgba(3,188,207,.18),transparent 24%) !important;
}

.contact-section__grid{
  grid-template-columns:minmax(320px,.88fr) minmax(540px,1.12fr) !important;
  gap:clamp(72px,8vw,138px) !important;
}

.contact-section__intro{
  max-width:500px !important;
  padding:clamp(28px,4vw,58px) 0 !important;
}

.contact-section__intro::before{
  content:"";
  position:absolute;
  left:-34px;
  top:8%;
  bottom:8%;
  width:3px;
  border-radius:999px;
  background:linear-gradient(180deg,transparent,#03BCCF 20%,#03BCCF 80%,transparent);
  opacity:.9;
}

.contact-card{
  max-width:670px !important;
  border-radius:30px !important;
  border:1px solid rgba(255,255,255,.78) !important;
  box-shadow:0 30px 80px rgba(10,5,35,.34),0 8px 22px rgba(10,5,35,.18) !important;
}

@media(max-width:1023px){
  .contact-section{
    min-height:auto;
  }

  .contact-section::before{
    inset:-15% -12% -15% -12% !important;
    width:auto !important;
    background-position:50% center !important;
    filter:saturate(.9) contrast(1.06) brightness(.72) !important;
  }

  .contact-section::after{
    background:
      linear-gradient(180deg,rgba(34,26,74,.88) 0%,rgba(34,26,74,.90) 48%,rgba(34,26,74,.97) 100%),
      radial-gradient(circle at 72% 18%,rgba(3,188,207,.16),transparent 26%) !important;
  }

  .contact-section__grid{
    grid-template-columns:1fr !important;
    gap:42px !important;
  }

  .contact-section__intro::before{
    left:0;
    top:auto;
    bottom:-16px;
    width:96px;
    height:3px;
  }
}

@media(max-width:639px){
  .contact-section::before{
    inset:-12% -18% -12% -18% !important;
    background-position:45% center !important;
  }

  .contact-section__intro{
    padding-top:8px !important;
  }
}

/* v3.49: darker Kontakt section, no decorative side stripe. */
.contact-section::before{
  filter:saturate(.82) contrast(1.08) brightness(.52) !important;
}

.contact-section::after{
  background:
    linear-gradient(90deg,
      rgba(19,14,48,.92) 0%,
      rgba(22,16,56,.90) 24%,
      rgba(27,19,66,.92) 46%,
      rgba(31,23,74,.97) 64%,
      #221A4A 78%,
      #221A4A 100%),
    linear-gradient(180deg,
      rgba(10,8,28,.14) 0%,
      rgba(10,8,28,.24) 100%),
    radial-gradient(circle at 20% 38%, rgba(3,188,207,.10), transparent 24%) !important;
}

.contact-section__intro::before{
  content:none !important;
  display:none !important;
}

.contact-section__intro{
  max-width:480px !important;
}

@media(max-width:1023px){
  .contact-section::before{
    filter:saturate(.8) contrast(1.06) brightness(.46) !important;
  }

  .contact-section::after{
    background:
      linear-gradient(180deg,
        rgba(24,18,60,.92) 0%,
        rgba(28,21,68,.94) 44%,
        rgba(34,26,74,.98) 100%),
      radial-gradient(circle at 70% 16%, rgba(3,188,207,.12), transparent 24%) !important;
  }
}

/* v3.50: subtle micro-details for the "Kluczowe cechy" checklist. */
.product-feature-panel__list{
  counter-reset:feature-item;
}

.product-feature-panel__item{
  counter-increment:feature-item;
  position:relative;
  align-items:center;
  min-height:58px;
  margin:0 -10px;
  padding:13px 42px 13px 10px;
  border-bottom:1px solid rgba(255,255,255,.09);
  border-radius:12px;
  transition:background-color .2s ease, transform .2s ease, border-color .2s ease;
}

.product-feature-panel__item:first-child{
  padding-top:13px;
}

.product-feature-panel__item svg{
  width:32px !important;
  height:32px !important;
  padding:6px;
  border-radius:10px;
  background:rgba(3,188,207,.11);
  border:1px solid rgba(3,188,207,.18);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025);
  transition:background-color .2s ease, transform .2s ease, box-shadow .2s ease;
}

.product-feature-panel__item::after{
  content:counter(feature-item, decimal-leading-zero);
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);
  color:rgba(255,255,255,.28);
  font-size:.68rem;
  font-weight:700;
  letter-spacing:.08em;
  line-height:1;
}

.product-feature-panel__item::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:3px;
  height:0;
  border-radius:999px;
  background:#03BCCF;
  transform:translateY(-50%);
  opacity:0;
  transition:height .2s ease, opacity .2s ease;
}

@media (hover:hover){
  .product-feature-panel__item:hover{
    background:rgba(3,188,207,.075);
    border-color:rgba(3,188,207,.18);
    transform:translateX(4px);
  }

  .product-feature-panel__item:hover svg{
    background:rgba(3,188,207,.18);
    transform:scale(1.06);
    box-shadow:0 6px 16px rgba(3,188,207,.10);
  }

  .product-feature-panel__item:hover::before{
    height:26px;
    opacity:1;
  }

  .product-feature-panel__item:hover::after{
    color:rgba(3,188,207,.75);
  }
}

@media(max-width:639px){
  .product-feature-panel__item{
    min-height:54px;
    padding:12px 36px 12px 8px;
    margin:0 -8px;
  }

  .product-feature-panel__item:first-child{
    padding-top:12px;
  }

  .product-feature-panel__item svg{
    width:30px !important;
    height:30px !important;
    border-radius:9px;
  }

  .product-feature-panel__item::after{
    right:8px;
    font-size:.64rem;
  }
}

/* v3.51: small Egerton-style enrichments for process + contact. */
.process-section{
  position:relative;
  overflow:hidden;
  isolation:isolate;
}

.process-section::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 18%, rgba(3,188,207,.085), transparent 24%),
    radial-gradient(circle at 84% 82%, rgba(3,188,207,.055), transparent 22%),
    linear-gradient(rgba(255,255,255,.026) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.026) 1px, transparent 1px);
  background-size:auto,auto,72px 72px,72px 72px;
  mask-image:linear-gradient(180deg, transparent 0%, #000 15%, #000 86%, transparent 100%);
  -webkit-mask-image:linear-gradient(180deg, transparent 0%, #000 15%, #000 86%, transparent 100%);
}

.process-section__inner{
  position:relative;
  z-index:1;
}

.process-section__head::after{
  content:"";
  display:block;
  width:72px;
  height:2px;
  margin:24px auto 0;
  border-radius:999px;
  background:linear-gradient(90deg, transparent, #03BCCF, transparent);
  opacity:.9;
}

.process-flow{
  position:relative;
}

.process-step{
  position:relative;
  overflow:hidden;
  background:linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.008));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
  transition:border-color .22s ease, transform .22s ease, background-color .22s ease, box-shadow .22s ease !important;
}

.process-step::after{
  content:attr(data-step);
  position:absolute;
  top:18px;
  right:20px;
  color:rgba(255,255,255,.075);
  font-size:clamp(2.6rem,4vw,4.2rem);
  font-weight:800;
  line-height:1;
  letter-spacing:-.06em;
  pointer-events:none;
}

.process-step__dot{
  position:absolute;
  top:0;
  left:28px;
  width:42px;
  height:3px;
  border-radius:0 0 999px 999px;
  background:#03BCCF;
  box-shadow:0 6px 20px rgba(3,188,207,.22);
}

@media (hover:hover){
  .process-step:hover{
    transform:translateY(-5px);
    border-color:rgba(3,188,207,.48) !important;
    background:linear-gradient(180deg, rgba(3,188,207,.065), rgba(255,255,255,.014));
    box-shadow:0 18px 38px rgba(8,5,28,.18), inset 0 1px 0 rgba(255,255,255,.04);
  }
}

@media(min-width:1024px){
  .process-flow::before{
    content:"";
    position:absolute;
    left:7%;
    right:7%;
    top:-17px;
    height:1px;
    background:linear-gradient(90deg, transparent, rgba(3,188,207,.55) 12%, rgba(3,188,207,.22) 50%, rgba(3,188,207,.55) 88%, transparent);
    pointer-events:none;
  }
}

.contact-trust-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:24px;
}

.contact-trust-chip{
  display:inline-flex;
  align-items:center;
  gap:9px;
  min-height:36px;
  padding:8px 13px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  background:rgba(255,255,255,.055);
  color:rgba(255,255,255,.88);
  font-size:.82rem;
  font-weight:600;
  line-height:1;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}

.contact-trust-chip__dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#03BCCF;
  box-shadow:0 0 0 4px rgba(3,188,207,.10);
  flex:0 0 auto;
}

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

.contact-card::before{
  content:"";
  position:absolute;
  top:0;
  left:30px;
  right:30px;
  height:3px;
  border-radius:0 0 999px 999px;
  background:linear-gradient(90deg, transparent 0%, #03BCCF 24%, #03BCCF 76%, transparent 100%);
  opacity:.9;
}

.contact-card::after{
  content:"";
  position:absolute;
  width:150px;
  height:150px;
  top:-90px;
  right:-74px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(3,188,207,.10), rgba(3,188,207,0) 70%);
  pointer-events:none;
}

@media(max-width:1023px){
  .process-section::before{background-size:auto,auto,56px 56px,56px 56px}
  .contact-trust-row{margin-top:20px}
}

@media(max-width:639px){
  .process-step::after{font-size:2.7rem;top:16px;right:16px}
  .process-step__dot{left:22px;width:34px}
  .contact-trust-row{gap:8px}
  .contact-trust-chip{font-size:.76rem;min-height:34px;padding:8px 11px}
  .contact-card::before{left:22px;right:22px}
}

@media(prefers-reduced-motion:reduce){
  .process-step{transition:none !important}
}

/* v3.53: keep the process section design, remove only the divider lines. */
.process-section__head::after,
.process-flow::before{
  content:none !important;
  display:none !important;
}

/* v3.54: on hover, the large step numbers light up in turquoise. */
.process-step::after{
  transition:color .22s ease, text-shadow .22s ease, opacity .22s ease !important;
}

@media (hover:hover){
  .process-step:hover::after{
    color:rgba(3,188,207,.92) !important;
    text-shadow:0 0 18px rgba(3,188,207,.18), 0 0 34px rgba(3,188,207,.10);
    opacity:1;
  }
}

/* v3.55: desktop product sidebar stays visible in the viewport while the product gallery scrolls. */
@media (min-width:1024px){
  #produkt,
  #produkt > .container{
    transform:none !important;
    opacity:1 !important;
  }

  #produkt .product-showcase__aside{
    position:-webkit-sticky !important;
    position:sticky !important;
    top:calc(var(--header-height-scrolled) + 14px) !important;
    align-self:start !important;
    height:calc(100dvh - var(--header-height-scrolled) - 28px);
    max-height:calc(100dvh - var(--header-height-scrolled) - 28px);
    min-height:0;
    overflow:visible;
    z-index:12;
  }

  #produkt .product-feature-panel{
    height:100%;
    max-height:100%;
    min-height:0;
    display:flex;
    flex-direction:column;
    padding:clamp(18px,2.1vh,26px) 26px clamp(16px,1.9vh,22px);
    overflow:hidden;
  }

  #produkt .product-feature-panel__title{
    flex:0 0 auto;
    margin-bottom:clamp(10px,1.6vh,18px);
  }

  #produkt .product-feature-panel__list{
    flex:1 1 auto;
    min-height:0;
    display:grid;
    grid-template-rows:repeat(8,minmax(0,1fr));
    align-content:stretch;
  }

  #produkt .product-feature-panel__item{
    min-height:0;
    padding:clamp(7px,1.25vh,13px) 0;
    align-items:center;
  }

  #produkt .product-feature-panel__item:first-child{
    padding-top:clamp(5px,.8vh,9px);
  }

  #produkt .product-feature-panel__item > span:not(.feature-detail-number){
    line-height:1.28;
  }

  #produkt .product-feature-panel__cta{
    flex:0 0 auto;
    margin-top:clamp(12px,1.7vh,20px);
  }

  #produkt .product-feature-panel__button{
    min-height:46px;
  }
}

/* v3.56: subtle moving shine across the sidebar CTA button. */
.product-feature-panel__button{
  position:relative;
  overflow:hidden;
  isolation:isolate;
}

.product-feature-panel__button::before{
  content:"";
  position:absolute;
  top:-35%;
  bottom:-35%;
  left:-42%;
  width:24%;
  z-index:0;
  pointer-events:none;
  background:linear-gradient(100deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.16) 32%,
    rgba(255,255,255,.58) 50%,
    rgba(255,255,255,.16) 68%,
    rgba(255,255,255,0) 100%);
  transform:skewX(-18deg);
  filter:blur(.2px);
  animation:egerton-button-shine 3.1s ease-in-out infinite;
}

.product-feature-panel__button > *{
  position:relative;
  z-index:1;
}

@keyframes egerton-button-shine{
  0%, 56%{left:-42%; opacity:0}
  62%{opacity:1}
  82%{left:118%; opacity:1}
  88%,100%{left:118%; opacity:0}
}

@media(prefers-reduced-motion:reduce){
  .product-feature-panel__button::before{
    animation:none !important;
    display:none !important;
  }
}

/* v3.57: move the shine effect from the sidebar CTA to the header "Zapytaj o wycenę" button. */
.product-feature-panel__button::before{
  content:none !important;
  display:none !important;
  animation:none !important;
}

.site-header__cta{
  position:relative;
  overflow:hidden;
  isolation:isolate;
}

.site-header__cta::before{
  content:"";
  position:absolute;
  top:-38%;
  bottom:-38%;
  left:-44%;
  width:26%;
  z-index:0;
  pointer-events:none;
  background:linear-gradient(100deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.14) 30%,
    rgba(255,255,255,.72) 50%,
    rgba(255,255,255,.14) 70%,
    rgba(255,255,255,0) 100%);
  transform:skewX(-18deg);
  animation:egerton-header-cta-shine 3.2s ease-in-out infinite;
}

@keyframes egerton-header-cta-shine{
  0%,55%{left:-44%;opacity:0}
  61%{opacity:1}
  81%{left:120%;opacity:1}
  87%,100%{left:120%;opacity:0}
}

@media(prefers-reduced-motion:reduce){
  .site-header__cta::before{
    animation:none !important;
    display:none !important;
  }
}

/* v3.59: secondary footer CTA to the full Egerton product catalog. */
.landing-footer__cta .landing-footer__products-button{
  margin-top:10px;
  background:transparent;
  color:#fff;
  border:1px solid rgba(255,255,255,.28);
  box-shadow:none;
}

.landing-footer__cta .landing-footer__products-button:hover{
  background:rgba(255,255,255,.07);
  border-color:#03BCCF;
  color:#fff;
  box-shadow:0 10px 24px rgba(3,188,207,.10);
}