:root{
  --deep:#0c3d4a;
  --deep2:#0a3039;
  --teal:#14606b;
  --aqua:#7ad7cb;
  --sand:#f6ecd8;
  --gold:#eebd72;
  --gold2:#f8dfae;
  --ink:#eaf5f3;
  --hh:72px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

html{
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--hh) + 10px);
  -webkit-text-size-adjust:100%;
  background:var(--deep2);
  overflow-x:hidden;
}
html.lock{overflow:hidden}

body{
  font-family:'Tajawal',Tahoma,Arial,sans-serif;
  background:var(--deep2);
  color:var(--ink);
  line-height:1.8;
  min-height:100vh;
  max-width:100%;
  overflow-x:hidden;
}

img{max-width:100%;display:block}
a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
button{font-family:inherit;-webkit-tap-highlight-color:transparent}
ul{list-style:none}

.wrap{width:100%;max-width:1280px;margin-inline:auto;padding-inline:20px}

.hdr{
  position:fixed;
  top:0;left:0;right:0;
  z-index:100;
  padding-top:env(safe-area-inset-top,0px);
}
.hdr::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:rgba(10,48,57,.7);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(255,255,255,.1);
  transition:background .3s,box-shadow .3s;
}
.hdr.sc::before{
  background:rgba(10,48,57,.94);
  box-shadow:0 10px 30px rgba(0,0,0,.22);
}
.hdr-in{
  height:var(--hh);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.logo{flex:none;display:flex;align-items:center}
.logo img{
  height:52px;
  width:auto;
  max-width:170px;
  object-fit:contain;
  filter:drop-shadow(0 4px 10px rgba(0,0,0,.28));
  transition:transform .4s;
}
.logo:hover img{transform:rotate(-3deg) scale(1.06)}

.nav{display:flex;align-items:center;gap:2px}
.lnk{
  position:relative;
  padding:8px 13px;
  border-radius:50px;
  font-size:15px;
  font-weight:500;
  color:var(--ink);
  white-space:nowrap;
  transition:background .3s,color .3s,transform .3s;
}
.lnk:hover{background:rgba(255,255,255,.12)}
.lnk.act{
  color:var(--deep2);
  font-weight:900;
  background:linear-gradient(110deg,var(--gold2),var(--gold),var(--gold2));
  background-size:220% 100%;
  animation:shine 3.2s linear infinite;
  box-shadow:0 0 0 3px rgba(238,189,114,.22),0 8px 22px rgba(238,189,114,.4);
  transform:translateY(-1px);
}
.lnk.act::after{
  content:"";
  position:absolute;
  bottom:-9px;
  left:50%;
  width:6px;height:6px;
  margin-left:-3px;
  border-radius:50%;
  background:var(--gold2);
  box-shadow:0 0 10px var(--gold);
}
@keyframes shine{to{background-position:-220% 0}}

.call{
  flex:none;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 20px;
  border-radius:50px;
  font-weight:700;
  color:#fff;
  background:linear-gradient(135deg,#2fbf88,#18936a);
  box-shadow:0 8px 20px rgba(24,147,106,.38);
  transition:transform .3s,box-shadow .3s;
  white-space:nowrap;
}
.call:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(24,147,106,.5)}
.ring{display:inline-block;transform-origin:50% 60%;animation:ring 1.8s ease-in-out infinite}
@keyframes ring{
  0%,55%,100%{transform:rotate(0)}
  10%,30%{transform:rotate(-16deg)}
  20%,40%{transform:rotate(16deg)}
}

.burger,.veil{display:none}

.hero{
  position:relative;
  min-height:100vh;
  min-height:100svh;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  overflow:hidden;
  background:var(--deep);
  color:#fff;
  padding:calc(var(--hh) + 50px) 0 110px;
}
.layer{position:absolute;inset:-6%;will-change:transform}
.l1{
  background:
    radial-gradient(ellipse at 20% 15%,rgba(122,215,203,.28) 0,transparent 55%),
    radial-gradient(ellipse at 85% 90%,rgba(238,189,114,.16) 0,transparent 50%),
    linear-gradient(165deg,#0f4c5a 0%,#14606b 50%,#0c3d4a 100%);
  animation:zoomA 14s ease-in-out infinite alternate;
}
.l2{animation:zoomB 18s ease-in-out infinite alternate}
.pat{display:block;width:100%;height:100%}
@keyframes zoomA{from{transform:scale(1)}to{transform:scale(1.14)}}
@keyframes zoomB{from{transform:scale(1.04)}to{transform:scale(1.22)}}

.glow{
  position:absolute;
  border-radius:50%;
  filter:blur(46px);
  pointer-events:none;
}
.g-a{
  width:340px;height:340px;
  top:-90px;right:-90px;
  background:radial-gradient(circle,rgba(238,189,114,.3),transparent 70%);
  animation:float 10s ease-in-out infinite;
}
.g-b{
  width:320px;height:320px;
  bottom:50px;left:-100px;
  background:radial-gradient(circle,rgba(122,215,203,.28),transparent 70%);
  animation:float 12s ease-in-out infinite reverse;
}
@keyframes float{50%{transform:translate(30px,30px) scale(1.15)}}

.bub{
  position:absolute;
  bottom:-70px;
  border-radius:50%;
  background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.45),rgba(122,215,203,.1));
  border:1px solid rgba(255,255,255,.25);
  animation:rise linear infinite;
  pointer-events:none;
}
.b1{width:36px;height:36px;left:8%;animation-duration:12s}
.b2{width:18px;height:18px;left:24%;animation-duration:9s;animation-delay:2s}
.b3{width:54px;height:54px;left:45%;animation-duration:15s;animation-delay:1s}
.b4{width:26px;height:26px;left:63%;animation-duration:10s;animation-delay:3s}
.b5{width:44px;height:44px;left:80%;animation-duration:13s}
.b6{width:14px;height:14px;left:92%;animation-duration:8s;animation-delay:4s}
@keyframes rise{
  0%{transform:translateY(0) translateX(0);opacity:0}
  10%{opacity:1}
  100%{transform:translateY(-115vh) translateX(30px);opacity:0}
}

.hero-in{position:relative;z-index:2;max-width:900px}
.tag{
  display:inline-block;
  padding:6px 18px;
  margin-bottom:20px;
  font-size:14px;
  border-radius:50px;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.22);
  animation:up .8s both;
}
.hero h1{
  font-size:clamp(28px,6vw,56px);
  line-height:1.5;
  font-weight:900;
  animation:up .9s .15s both;
}
.hero h1 span{display:block}
.hero h1 b{
  display:block;
  background:linear-gradient(90deg,var(--gold2),var(--aqua),var(--gold2));
  background-size:220% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  animation:shine 6s linear infinite;
}
.hero-p{
  max-width:740px;
  margin:18px auto 0;
  font-size:clamp(15px,2.3vw,18px);
  color:#d6ebe8;
  animation:up 1s .3s both;
}
.hero-p2{margin-top:10px;margin-bottom:28px;animation-delay:.4s}
.btns{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:14px;
  animation:up 1s .5s both;
}
@keyframes up{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}

.btn{
  display:inline-block;
  padding:14px 34px;
  font-size:17px;
  font-weight:700;
  border-radius:50px;
  border:2px solid transparent;
  cursor:pointer;
  transition:transform .35s,background .35s,color .35s,box-shadow .35s;
}
.btn-gold{
  background:linear-gradient(135deg,var(--gold2),var(--gold));
  color:var(--deep2);
  box-shadow:0 10px 26px rgba(238,189,114,.4);
}
.btn-gold:hover{transform:translateY(-4px) scale(1.03);box-shadow:0 16px 34px rgba(238,189,114,.5)}
.btn-line{
  color:#fff;
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.55);
}
.btn-line:hover{background:#fff;color:var(--deep2);transform:translateY(-4px)}

.chips{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:10px;
  margin-top:30px;
  animation:up 1s .65s both;
}
.chips li{
  padding:7px 16px;
  font-size:14px;
  font-weight:500;
  border-radius:50px;
  background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.18);
  -webkit-backdrop-filter:blur(6px);
  backdrop-filter:blur(6px);
  transition:transform .3s,background .3s;
}
.chips li:hover{transform:translateY(-3px);background:rgba(255,255,255,.17)}

.seo{
  max-width:760px;
  margin:24px auto 0;
  font-size:13.5px;
  line-height:2;
  color:#b9d8d4;
  animation:up 1s .8s both;
}

.mq{
  position:absolute;
  left:0;right:0;bottom:0;
  z-index:2;
  overflow:hidden;
  direction:ltr;
  padding:14px 0;
  background:rgba(0,0,0,.14);
  border-top:1px solid rgba(255,255,255,.12);
}
.mq-t{display:flex;width:max-content;animation:mq 34s linear infinite}
.mq-g{display:flex;flex:none}
.mq-g span{
  direction:rtl;
  white-space:nowrap;
  padding:0 22px;
  font-size:15px;
  font-weight:700;
  color:var(--gold2);
}
.mq-g span::before{content:"✦";margin-inline-start:22px;color:var(--aqua)}
@keyframes mq{to{transform:translateX(-50%)}}

@media (max-width:1100px){
  .call{display:none}

  .burger{
    display:flex;
    flex:none;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:5px;
    width:46px;height:46px;
    border-radius:14px;
    border:1px solid rgba(255,255,255,.25);
    background:rgba(255,255,255,.1);
    cursor:pointer;
    position:relative;
    z-index:3;
  }
  .burger span{
    display:block;
    width:22px;height:2.5px;
    border-radius:3px;
    background:var(--gold2);
    transition:transform .35s,opacity .25s;
  }
  .burger.open span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
  .burger.open span:nth-child(2){opacity:0}
  .burger.open span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}

  .veil{
    display:block;
    position:fixed;
    top:0;left:0;right:0;bottom:0;
    z-index:90;
    background:rgba(5,28,34,.45);
    -webkit-backdrop-filter:blur(8px);
    backdrop-filter:blur(8px);
    opacity:0;
    visibility:hidden;
    transition:opacity .35s,visibility .35s;
  }
  .veil.show{opacity:1;visibility:visible}

  .nav{
    position:fixed;
    top:calc(env(safe-area-inset-top,0px) + var(--hh) + 10px);
    left:0;right:0;
    margin-inline:auto;
    width:min(88vw,320px);
    max-height:calc(100vh - var(--hh) - 40px);
    max-height:calc(100svh - var(--hh) - 40px - env(safe-area-inset-top,0px));
    overflow-y:auto;
    overscroll-behavior:contain;
    z-index:2;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:6px;
    padding:16px 14px 14px;
    border-radius:26px;
    background:linear-gradient(165deg,rgba(20,96,107,.97),rgba(10,48,57,.98));
    border:1px solid rgba(248,223,174,.35);
    box-shadow:0 30px 60px rgba(0,0,0,.45),0 0 0 6px rgba(255,255,255,.05);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(-40px) scale(.94);
    transform-origin:50% 0;
    transition:transform .45s cubic-bezier(.2,.9,.3,1.2),opacity .3s,visibility .3s;
  }
  .nav::before{
    content:"";
    display:block;
    width:46px;height:4px;
    margin:0 auto 8px;
    border-radius:4px;
    background:linear-gradient(90deg,var(--gold2),var(--gold));
  }
  .nav.open{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateY(0) scale(1);
  }
  .lnk{
    display:block;
    text-align:center;
    padding:11px 14px;
    font-size:16px;
    border-radius:16px;
    opacity:0;
    transform:translateY(-14px);
    transition:opacity .35s,transform .35s,background .3s;
  }
  .nav.open .lnk{opacity:1;transform:none}
  .nav.open .lnk:nth-child(1){transition-delay:.08s}
  .nav.open .lnk:nth-child(2){transition-delay:.12s}
  .nav.open .lnk:nth-child(3){transition-delay:.16s}
  .nav.open .lnk:nth-child(4){transition-delay:.2s}
  .nav.open .lnk:nth-child(5){transition-delay:.24s}
  .nav.open .lnk:nth-child(6){transition-delay:.28s}
  .nav.open .lnk:nth-child(7){transition-delay:.32s}
  .nav.open .lnk:nth-child(8){transition-delay:.36s}
  .lnk.act::after{display:none}
  .lnk.act{transform:none}
}

@media (max-width:560px){
  :root{--hh:64px}
  .wrap{padding-inline:16px}
  .logo img{height:44px;max-width:140px}
  .hero{padding:calc(var(--hh) + 34px) 0 100px}
  .btns{flex-direction:column;align-items:stretch;max-width:320px;margin-inline:auto}
  .btn{width:100%;text-align:center;padding:13px 20px;font-size:16px}
  .chips{gap:8px}
  .chips li{font-size:13px;padding:6px 13px}
  .seo{font-size:12.5px}
  .mq-g span{font-size:13px;padding:0 16px}
  .mq-g span::before{margin-inline-start:16px}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
}
.about{
  position:relative;
  background:var(--sand);
  color:#17434b;
  padding:120px 0 90px;
  overflow:hidden;
}
.about::before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;
  height:22px;
  z-index:3;
  background:
    linear-gradient(135deg,var(--deep2) 25%,transparent 25%) -11px 0/22px 22px,
    linear-gradient(225deg,var(--deep2) 25%,transparent 25%) -11px 0/22px 22px;
}
.ab-blob{
  position:absolute;
  border-radius:50%;
  filter:blur(60px);
  pointer-events:none;
}
.ab-b1{
  width:360px;height:360px;
  top:80px;left:-120px;
  background:radial-gradient(circle,rgba(122,215,203,.35),transparent 70%);
  animation:float 12s ease-in-out infinite;
}
.ab-b2{
  width:340px;height:340px;
  bottom:-80px;right:-100px;
  background:radial-gradient(circle,rgba(238,189,114,.4),transparent 70%);
  animation:float 14s ease-in-out infinite reverse;
}

.ab-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:56px;
  align-items:center;
}

.rv{
  opacity:0;
  transform:translateY(34px);
  transition:opacity .8s ease,transform .8s ease;
  transition-delay:calc(var(--i,0) * .1s);
}
.rv.in{opacity:1;transform:none}

.ab-eb{
  display:inline-block;
  padding:5px 18px;
  margin-bottom:14px;
  font-size:14px;
  font-weight:700;
  color:var(--teal);
  background:rgba(20,96,107,.1);
  border:1px solid rgba(20,96,107,.2);
  border-radius:50px;
}

.ab-t h2{
  font-weight:900;
  line-height:1.4;
  color:#0c3d4a;
  margin-bottom:20px;
}
.nm{
  display:block;
  font-size:clamp(42px,8vw,78px);
  line-height:1.35;
}
.nm::after{
  content:"";
  display:block;
  width:0;
  height:6px;
  margin-top:4px;
  border-radius:6px;
  background:linear-gradient(90deg,var(--gold),var(--aqua));
  transition:width 1.2s .7s ease;
}
.ab-t h2.in .nm::after{width:150px}
.nm em{
  font-style:normal;
  display:inline-block;
  opacity:0;
  background:linear-gradient(100deg,#0c3d4a 0%,#14606b 35%,#d49a3f 60%,#14606b 85%,#0c3d4a 100%);
  background-size:220% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
}
.ab-t h2.in .nm em{
  animation:word 1s cubic-bezier(.2,.8,.2,1) both,shine 6s linear 1.2s infinite;
}
.ab-t h2.in .nm em:nth-child(2){animation-delay:.3s,1.2s}
@keyframes word{
  from{opacity:0;filter:blur(12px);transform:translateY(26px) scale(.96)}
  to{opacity:1;filter:blur(0);transform:none}
}
.sub{
  display:block;
  margin-top:6px;
  font-size:clamp(19px,3.2vw,30px);
  font-weight:700;
  color:var(--teal);
}

.ab-lead{
  font-size:clamp(16px,2.4vw,19px);
  font-weight:500;
  color:#143e46;
  margin-bottom:14px;
}
.ab-p{
  font-size:16px;
  color:#3d6068;
  margin-bottom:14px;
}

.ab-vis{
  display:flex;
  flex-direction:column;
  gap:2px;
  margin:20px 0 24px;
  padding:14px 20px;
  border-radius:18px;
  border-right:5px solid var(--gold);
  background:linear-gradient(90deg,rgba(238,189,114,.22),rgba(238,189,114,.05));
}
.ab-vis b{color:#0c3d4a;font-size:17px}
.ab-vis span{color:#3d6068;font-size:15px}

.ab-vals{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-bottom:24px;
}
.ab-val{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:14px;
  background:#fff;
  border-radius:18px;
  border:1px solid rgba(20,96,107,.08);
  box-shadow:0 8px 24px rgba(12,61,74,.08);
  transition:opacity .8s ease,transform .4s ease,box-shadow .4s ease;
}
.ab-val.in:hover{transform:translateY(-6px);box-shadow:0 18px 36px rgba(12,61,74,.16)}
.ab-val i{
  flex:none;
  display:grid;
  place-items:center;
  width:46px;height:46px;
  font-style:normal;
  font-size:24px;
  border-radius:14px;
  background:#e7f3ef;
  transition:transform .4s,background .4s;
}
.ab-val:hover i{transform:rotate(-10deg) scale(1.12);background:var(--gold2)}
.ab-val h3{font-size:16px;color:#0c3d4a;margin-bottom:2px}
.ab-val p{font-size:13.5px;line-height:1.7;color:#4d6f76}

.ab-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin-bottom:26px;
}
.ab-stats div{
  text-align:center;
  padding:16px 8px;
  border-radius:20px;
  background:linear-gradient(160deg,#14606b,#0c3d4a);
  box-shadow:0 14px 30px rgba(12,61,74,.25);
}
.ab-stats strong{
  display:block;
  font-size:clamp(26px,5vw,38px);
  line-height:1.3;
  color:var(--gold2);
}
.ab-stats strong::after{content:attr(data-s)}
.ab-stats span{font-size:13.5px;color:#d6ebe8}

.btn-teal{
  background:linear-gradient(135deg,#14606b,#0c3d4a);
  color:#fff;
  box-shadow:0 12px 28px rgba(12,61,74,.3);
}
.btn-teal:hover{transform:translateY(-4px) scale(1.03);box-shadow:0 18px 36px rgba(12,61,74,.4)}

.ab-card{
  position:relative;
  width:100%;
  max-width:470px;
  margin-inline:auto;
  padding:24px 20px 70px;
  border-radius:36px;
  overflow:hidden;
  background:
    radial-gradient(circle at 80% 15%,rgba(238,189,114,.22),transparent 45%),
    linear-gradient(160deg,#14606b,#0a3039);
  border:1px solid rgba(248,223,174,.3);
  box-shadow:0 36px 70px rgba(12,61,74,.35),0 0 0 8px rgba(255,255,255,.5);
}
.scene{display:block;width:100%;height:auto;overflow:visible}

.dr{
  fill:none;
  stroke-width:3;
  stroke-linecap:round;
  stroke-linejoin:round;
  stroke-dasharray:1;
  stroke-dashoffset:1;
}
.gold{stroke:#f8dfae}
.aq{stroke:#7ad7cb}
.ab-card.in .dr{animation:draw 2.2s ease forwards;animation-delay:var(--d,0s)}
@keyframes draw{to{stroke-dashoffset:0}}

.fl{opacity:0}
.ab-card.in .fl{animation:fade 1.2s 1.8s forwards}
@keyframes fade{to{opacity:1}}

.lt{fill:#f8dfae;fill-opacity:0;stroke:none}
.ab-card.in .lt{animation:lit 3.2s ease-in-out infinite;animation-delay:calc(2.6s + var(--t,0s))}
@keyframes lit{0%,100%{fill-opacity:.1}50%{fill-opacity:.65}}

.sp{
  fill:#f8dfae;
  opacity:0;
  transform-box:fill-box;
  transform-origin:center;
}
.ab-card.in .sp{animation:tw 2.8s ease-in-out infinite;animation-delay:var(--t,0s)}
@keyframes tw{
  0%,100%{opacity:.1;transform:scale(.6) rotate(0)}
  50%{opacity:1;transform:scale(1.2) rotate(45deg)}
}

.rays{transform-origin:330px 92px}
.ab-card.in .rays{animation:spin 22s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

.cb{
  position:absolute;
  bottom:-30px;
  border-radius:50%;
  background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.4),rgba(122,215,203,.08));
  border:1px solid rgba(255,255,255,.22);
  animation:rise linear infinite;
  pointer-events:none;
}
.cb1{width:22px;height:22px;left:14%;animation-duration:10s}
.cb2{width:14px;height:14px;left:38%;animation-duration:8s;animation-delay:2s}
.cb3{width:30px;height:30px;left:62%;animation-duration:13s;animation-delay:1s}
.cb4{width:16px;height:16px;left:84%;animation-duration:9s;animation-delay:3s}

.fb{
  position:absolute;
  padding:8px 14px;
  font-size:13px;
  font-weight:700;
  color:#fff;
  border-radius:16px;
  background:rgba(255,255,255,.13);
  border:1px solid rgba(255,255,255,.25);
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
  white-space:nowrap;
  animation:bob 5s ease-in-out infinite;
}
.fb1{top:16px;left:16px}
.fb2{bottom:16px;right:16px;animation-delay:1.2s}
.fb3{bottom:16px;left:16px;animation-delay:2.4s}
@keyframes bob{50%{transform:translateY(-8px)}}

@media (max-width:900px){
  .about{padding:100px 0 70px}
  .ab-grid{grid-template-columns:1fr;gap:44px}
  .ab-card{max-width:420px}
}

@media (max-width:560px){
  .about{padding:90px 0 60px}
  .ab-vals{grid-template-columns:1fr}
  .ab-stats{gap:8px}
  .ab-stats span{font-size:12.5px}
  .ab-card{padding:18px 14px 66px;border-radius:28px}
  .fb{font-size:12px;padding:7px 11px}
  .btn-teal{width:100%;text-align:center}
}
.services{
  position:relative;
  padding:110px 0 90px;
  overflow:hidden;
  background:linear-gradient(180deg,#e4f2ef 0%,#eef7f4 60%,#e4f2ef 100%);
  color:#17434b;
}
.services::before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;
  height:14px;
  z-index:3;
  background:radial-gradient(circle at 50% 0,var(--sand) 12px,transparent 13px) 0 0/28px 14px repeat-x;
}
.sv-blob{
  position:absolute;
  border-radius:50%;
  filter:blur(60px);
  pointer-events:none;
}
.sv-b1{
  width:360px;height:360px;
  top:160px;right:-120px;
  background:radial-gradient(circle,rgba(238,189,114,.3),transparent 70%);
  animation:float 13s ease-in-out infinite;
}
.sv-b2{
  width:360px;height:360px;
  bottom:120px;left:-120px;
  background:radial-gradient(circle,rgba(122,215,203,.4),transparent 70%);
  animation:float 15s ease-in-out infinite reverse;
}
.services .wrap{position:relative;z-index:2}

.sv-head{
  max-width:820px;
  margin:0 auto 34px;
  text-align:center;
}
.sv-head h2{
  font-size:clamp(26px,4.6vw,44px);
  line-height:1.5;
  font-weight:900;
  color:#0c3d4a;
  margin:6px 0 14px;
}
.sv-head h2 em{
  font-style:normal;
  background:linear-gradient(100deg,#14606b,#d49a3f,#14606b);
  background-size:220% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  animation:shine 6s linear infinite;
}
.sv-head p{
  font-size:clamp(15px,2.3vw,17px);
  color:#3d6068;
}

.sv-tabs{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:10px;
  margin-bottom:38px;
}
.sv-tab{
  cursor:pointer;
  padding:10px 22px;
  font-size:15px;
  font-weight:700;
  color:#0c3d4a;
  background:#fff;
  border:1px solid rgba(20,96,107,.16);
  border-radius:50px;
  box-shadow:0 6px 16px rgba(12,61,74,.07);
  transition:transform .3s,background .3s,color .3s,box-shadow .3s;
}
.sv-tab:hover{transform:translateY(-3px)}
.sv-tab.on{
  color:#fff;
  background:linear-gradient(135deg,#14606b,#0c3d4a);
  border-color:transparent;
  box-shadow:0 12px 26px rgba(12,61,74,.32);
}

.sv-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:26px;
}
.sv{
  display:flex;
  flex-direction:column;
  overflow:hidden;
  background:#fff;
  border-radius:26px;
  border:1px solid rgba(20,96,107,.08);
  box-shadow:0 14px 34px rgba(12,61,74,.1);
  transition:opacity .8s ease,transform .45s ease,box-shadow .45s ease;
}
.sv.in:hover{
  transform:translateY(-10px);
  box-shadow:0 30px 56px rgba(12,61,74,.2);
}
.sv.off{display:none}
.sv.pop{animation:pop .65s cubic-bezier(.2,.9,.3,1.1) both}
@keyframes pop{
  from{opacity:0;transform:translateY(30px) scale(.94)}
  to{opacity:1;transform:none}
}

.sv-img{
  position:relative;
  aspect-ratio:16/10;
  overflow:hidden;
  background:linear-gradient(145deg,#14606b,#0a3039);
}
.sv[data-c="pest"] .sv-img{background:linear-gradient(145deg,#8a5a1f,#3a2a10)}
.sv[data-c="sterile"] .sv-img{background:linear-gradient(145deg,#1d8a86,#0c3d4a)}
.sv-img::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:45%;
  z-index:2;
  pointer-events:none;
  background:linear-gradient(0deg,rgba(6,30,36,.55),transparent);
}
.sv-ph{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  font-size:68px;
  animation:bob 4.5s ease-in-out infinite;
}
.sv-img img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:1;
  transition:transform .9s ease;
}
.sv:hover .sv-img img{transform:scale(1.12)}
.sv-n{
  position:absolute;
  top:12px;left:14px;
  z-index:3;
  font-size:26px;
  font-weight:900;
  color:#fff;
  opacity:.9;
  text-shadow:0 2px 10px rgba(0,0,0,.45);
}
.sv-k{
  position:absolute;
  top:14px;right:14px;
  z-index:3;
  padding:4px 14px;
  font-size:13px;
  font-weight:700;
  color:#0c3d4a;
  background:linear-gradient(135deg,var(--gold2),var(--gold));
  border-radius:50px;
}

.sv-b{
  display:flex;
  flex-direction:column;
  flex:1;
  padding:22px 22px 24px;
}
.sv-b h3{
  font-size:20px;
  line-height:1.5;
  font-weight:900;
  color:#0c3d4a;
  margin-bottom:8px;
}
.sv-b p{
  font-size:15px;
  line-height:1.95;
  color:#4d6f76;
  margin-bottom:14px;
}
.sv-b ul{
  display:grid;
  gap:6px;
  margin-bottom:18px;
}
.sv-b li{
  position:relative;
  padding-inline-start:26px;
  font-size:14.5px;
  font-weight:500;
  color:#2c5058;
}
.sv-b li::before{
  content:"✔";
  position:absolute;
  right:0;
  top:0;
  width:18px;height:18px;
  display:grid;
  place-items:center;
  font-size:10px;
  color:#0c3d4a;
  background:var(--gold2);
  border-radius:50%;
  line-height:1;
  margin-top:5px;
}
.sv-a{
  margin-top:auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:12px 20px;
  font-size:15px;
  font-weight:700;
  color:#fff;
  background:linear-gradient(135deg,#14606b,#0c3d4a);
  border-radius:50px;
  box-shadow:0 10px 22px rgba(12,61,74,.25);
  transition:transform .3s,box-shadow .3s,gap .3s;
}
.sv-a span{display:inline-block;transition:transform .3s}
.sv-a:hover{transform:translateY(-3px);box-shadow:0 16px 30px rgba(12,61,74,.35)}
.sv-a:hover span{transform:translateX(-6px)}

.sv-cta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  margin-top:48px;
  padding:34px 34px;
  border-radius:30px;
  color:#fff;
  background:
    radial-gradient(circle at 12% 20%,rgba(238,189,114,.25),transparent 45%),
    linear-gradient(150deg,#14606b,#0a3039);
  border:1px solid rgba(248,223,174,.3);
  box-shadow:0 26px 56px rgba(12,61,74,.3);
}
.sv-cta h3{
  font-size:clamp(20px,3.2vw,28px);
  font-weight:900;
  margin-bottom:6px;
}
.sv-cta p{
  color:#d6ebe8;
  font-size:15.5px;
  max-width:560px;
}
.sv-cta-b{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  flex:none;
}

@media (max-width:1000px){
  .sv-grid{grid-template-columns:repeat(2,1fr);gap:20px}
  .sv-cta{flex-direction:column;align-items:flex-start}
}

@media (max-width:640px){
  .services{padding:90px 0 64px}
  .sv-grid{grid-template-columns:1fr}
  .sv-tabs{gap:8px}
  .sv-tab{padding:9px 16px;font-size:14px}
  .sv-b{padding:18px 18px 22px}
  .sv-cta{padding:26px 20px;border-radius:24px}
  .sv-cta-b{width:100%;flex-direction:column}
  .sv-cta-b .btn{width:100%;text-align:center}
}
.how{
  position:relative;
  padding:120px 0 90px;
  overflow:hidden;
  color:#fff;
  background:
    radial-gradient(ellipse at 15% 10%,rgba(122,215,203,.18),transparent 50%),
    radial-gradient(ellipse at 90% 90%,rgba(238,189,114,.14),transparent 50%),
    linear-gradient(170deg,#0f4c5a 0%,#0c3d4a 50%,#0a3039 100%);
}
.how::before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;
  height:22px;
  z-index:3;
  background:
    linear-gradient(135deg,#e4f2ef 25%,transparent 25%) -11px 0/22px 22px,
    linear-gradient(225deg,#e4f2ef 25%,transparent 25%) -11px 0/22px 22px;
}
.how .wrap{position:relative;z-index:2}

.hw-blob{
  position:absolute;
  border-radius:50%;
  filter:blur(60px);
  pointer-events:none;
}
.hw-b1{
  width:340px;height:340px;
  top:140px;left:-120px;
  background:radial-gradient(circle,rgba(238,189,114,.22),transparent 70%);
  animation:float 12s ease-in-out infinite;
}
.hw-b2{
  width:360px;height:360px;
  bottom:80px;right:-120px;
  background:radial-gradient(circle,rgba(122,215,203,.25),transparent 70%);
  animation:float 14s ease-in-out infinite reverse;
}
.hw-dot{
  position:absolute;
  bottom:-20px;
  width:10px;height:10px;
  border-radius:50%;
  background:rgba(248,223,174,.5);
  animation:rise linear infinite;
  pointer-events:none;
}
.hw-dot.d1{left:10%;animation-duration:16s}
.hw-dot.d2{left:30%;animation-duration:12s;animation-delay:3s;width:7px;height:7px}
.hw-dot.d3{left:55%;animation-duration:18s;animation-delay:1s}
.hw-dot.d4{left:75%;animation-duration:13s;animation-delay:5s;width:8px;height:8px}
.hw-dot.d5{left:90%;animation-duration:15s;animation-delay:2s}

.hw-head{
  max-width:820px;
  margin:0 auto 54px;
  text-align:center;
}
.how .ab-eb{
  color:var(--gold2);
  background:rgba(248,223,174,.12);
  border-color:rgba(248,223,174,.3);
}
.hw-head h2{
  font-size:clamp(26px,4.6vw,44px);
  line-height:1.5;
  font-weight:900;
  margin:6px 0 14px;
  color:#fff;
}
.hw-head h2 em{
  font-style:normal;
  background:linear-gradient(90deg,var(--gold2),var(--aqua),var(--gold2));
  background-size:220% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  animation:shine 6s linear infinite;
}
.hw-head p{
  font-size:clamp(15px,2.3vw,17px);
  color:#cfe6e3;
}

.hw-steps{
  position:relative;
  display:grid;
  gap:38px;
  padding:6px 0;
}
.hw-track{
  position:absolute;
  top:0;bottom:0;
  left:50%;
  width:4px;
  transform:translateX(-50%);
  border-radius:4px;
  background:rgba(255,255,255,.12);
}
.hw-fill{
  width:100%;
  height:0;
  border-radius:4px;
  background:linear-gradient(180deg,var(--gold2),var(--gold),var(--aqua));
  box-shadow:0 0 18px rgba(238,189,114,.7);
}

.hw-s{
  position:relative;
  display:grid;
  grid-template-columns:1fr 1fr;
  align-items:start;
}
.hw-c{
  position:relative;
  grid-column:1;
  margin-inline-end:56px;
  padding:26px 24px 22px;
  overflow:hidden;
  border-radius:26px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.16);
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
  box-shadow:0 20px 44px rgba(0,0,0,.2);
  transition:opacity .8s ease,transform .6s ease,background .4s ease,border-color .4s ease;
}
.hw-s:nth-child(even) .hw-c{
  grid-column:2;
  margin-inline-end:0;
  margin-inline-start:56px;
}
.hw-c.in:hover{
  transform:translateY(-8px);
  background:rgba(255,255,255,.13);
  border-color:rgba(248,223,174,.5);
}
.hw-big{
  position:absolute;
  top:6px;left:16px;
  font-size:78px;
  font-weight:900;
  line-height:1;
  color:rgba(255,255,255,.07);
  pointer-events:none;
}
.hw-i{
  display:grid;
  place-items:center;
  width:60px;height:60px;
  margin-bottom:12px;
  font-style:normal;
  font-size:30px;
  border-radius:18px;
  background:rgba(248,223,174,.15);
  border:1px solid rgba(248,223,174,.3);
  animation:bob 4.5s ease-in-out infinite;
}
.hw-c h3{
  font-size:21px;
  font-weight:900;
  line-height:1.5;
  color:var(--gold2);
  margin-bottom:8px;
}
.hw-c p{
  font-size:15.5px;
  line-height:1.95;
  color:#d6ebe8;
  margin-bottom:14px;
}
.hw-tag{
  display:inline-block;
  padding:5px 14px;
  font-size:13.5px;
  font-weight:700;
  color:var(--deep2);
  background:linear-gradient(135deg,var(--gold2),var(--gold));
  border-radius:50px;
}

.hw-node{
  position:absolute;
  top:22px;
  left:50%;
  z-index:3;
  display:grid;
  place-items:center;
  width:58px;height:58px;
  transform:translateX(-50%);
  border-radius:50%;
  background:#0c3d4a;
  border:3px solid rgba(255,255,255,.25);
  transition:background .5s,border-color .5s,box-shadow .5s;
}
.hw-node b{
  font-size:24px;
  font-weight:900;
  color:rgba(255,255,255,.55);
  transition:color .5s;
}
.hw-node.on{
  background:linear-gradient(135deg,var(--gold2),var(--gold));
  border-color:#fff3d6;
  animation:pulse 2.6s infinite;
}
.hw-node.on b{color:var(--deep2)}
@keyframes pulse{
  0%{box-shadow:0 0 0 0 rgba(238,189,114,.6)}
  100%{box-shadow:0 0 0 22px rgba(238,189,114,0)}
}

.hw-strip{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
  margin-top:64px;
}
.hw-strip div{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  padding:20px 12px;
  border-radius:22px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.16);
  transition:transform .4s,background .4s;
}
.hw-strip div:hover{transform:translateY(-6px);background:rgba(255,255,255,.14)}
.hw-strip i{
  font-style:normal;
  font-size:32px;
  margin-bottom:6px;
  animation:bob 5s ease-in-out infinite;
}
.hw-strip b{font-size:16.5px;color:var(--gold2)}
.hw-strip span{font-size:13.5px;color:#cfe6e3;line-height:1.7}
.hw-go{
  margin-top:34px;
  text-align:center;
}

@media (max-width:800px){
  .how{padding:100px 0 70px}
  .hw-steps{gap:26px}
  .hw-track{
    left:auto;
    right:24px;
    transform:none;
  }
  .hw-s{grid-template-columns:1fr}
  .hw-c,
  .hw-s:nth-child(even) .hw-c{
    grid-column:1;
    margin-inline-start:0;
    margin-inline-end:70px;
  }
  .hw-node{
    left:auto;
    right:0;
    width:52px;height:52px;
    transform:none;
    top:18px;
  }
  .hw-node b{font-size:21px}
  .hw-strip{grid-template-columns:1fr 1fr}
}

@media (max-width:560px){
  .how{padding:90px 0 60px}
  .hw-head{margin-bottom:40px}
  .hw-c,
  .hw-s:nth-child(even) .hw-c{
    margin-inline-end:64px;
    padding:20px 16px 18px;
    border-radius:22px;
  }
  .hw-i{width:52px;height:52px;font-size:26px}
  .hw-c h3{font-size:18.5px}
  .hw-c p{font-size:14.5px;line-height:1.9}
  .hw-big{font-size:60px}
  .hw-strip{gap:10px;margin-top:48px}
  .hw-strip div{padding:16px 8px}
  .hw-strip b{font-size:14.5px}
  .hw-strip span{font-size:12.5px}
  .hw-go .btn{width:100%;text-align:center}
}
.faq{
  position:relative;
  padding:120px 0 90px;
  overflow:hidden;
  color:#17434b;
  background:var(--sand);
}
.faq::before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;
  height:14px;
  z-index:3;
  background:radial-gradient(circle at 50% 0,#0a3039 12px,transparent 13px) 0 0/28px 14px repeat-x;
}
.faq .wrap{position:relative;z-index:2}

.fq-blob{
  position:absolute;
  border-radius:50%;
  filter:blur(60px);
  pointer-events:none;
}
.fq-b1{
  width:340px;height:340px;
  top:120px;right:-120px;
  background:radial-gradient(circle,rgba(122,215,203,.38),transparent 70%);
  animation:float 13s ease-in-out infinite;
}
.fq-b2{
  width:340px;height:340px;
  bottom:60px;left:-120px;
  background:radial-gradient(circle,rgba(238,189,114,.4),transparent 70%);
  animation:float 15s ease-in-out infinite reverse;
}

.fq-head{
  max-width:780px;
  margin:0 auto 46px;
  text-align:center;
}
.fq-head h2{
  font-size:clamp(26px,4.6vw,42px);
  line-height:1.5;
  font-weight:900;
  color:#0c3d4a;
  margin:6px 0 14px;
}
.fq-head h2 em{
  font-style:normal;
  background:linear-gradient(100deg,#14606b,#d49a3f,#14606b);
  background-size:220% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  animation:shine 6s linear infinite;
}
.fq-head p{
  font-size:clamp(15px,2.3vw,17px);
  color:#3d6068;
}

.fq-grid{
  display:grid;
  grid-template-columns:1.5fr 1fr;
  gap:34px;
  align-items:start;
}
.fq-list{display:grid;gap:14px}

.fq-q{
  overflow:hidden;
  background:#fff;
  border-radius:22px;
  border:1px solid rgba(20,96,107,.1);
  box-shadow:0 10px 28px rgba(12,61,74,.08);
  transition:opacity .8s ease,transform .8s ease,box-shadow .4s ease,border-color .4s ease;
}
.fq-q.in:hover{box-shadow:0 18px 38px rgba(12,61,74,.15)}
.fq-q[open]{
  border-color:var(--gold);
  box-shadow:0 20px 44px rgba(12,61,74,.16);
}
.fq-q summary{
  display:flex;
  align-items:center;
  gap:14px;
  padding:16px 18px;
  cursor:pointer;
  list-style:none;
  -webkit-tap-highlight-color:transparent;
}
.fq-q summary::-webkit-details-marker{display:none}
.fq-q summary::marker{content:""}

.fq-ic{
  flex:none;
  display:grid;
  place-items:center;
  width:46px;height:46px;
  font-size:23px;
  border-radius:14px;
  background:#e7f3ef;
  transition:transform .4s,background .4s;
}
.fq-q[open] .fq-ic{background:var(--gold2);transform:rotate(-8deg) scale(1.08)}
.fq-t{
  flex:1;
  font-size:16.5px;
  font-weight:700;
  line-height:1.7;
  color:#0c3d4a;
}
.fq-pm{
  flex:none;
  position:relative;
  width:34px;height:34px;
  border-radius:50%;
  background:#e7f3ef;
  transition:background .4s,transform .4s;
}
.fq-pm::before,
.fq-pm::after{
  content:"";
  position:absolute;
  top:50%;left:50%;
  width:14px;height:2.5px;
  margin:-1.25px 0 0 -7px;
  border-radius:3px;
  background:#14606b;
  transition:transform .4s,background .4s;
}
.fq-pm::after{transform:rotate(90deg)}
.fq-q[open] .fq-pm{background:linear-gradient(135deg,var(--gold2),var(--gold))}
.fq-q[open] .fq-pm::after{transform:rotate(0)}
.fq-q[open] .fq-pm::before,
.fq-q[open] .fq-pm::after{background:#0c3d4a}

.fq-a{padding:0 18px 20px}
.fq-a p{
  padding:14px 16px;
  font-size:15.5px;
  line-height:2;
  color:#3d6068;
  background:linear-gradient(90deg,rgba(238,189,114,.16),rgba(238,189,114,.04));
  border-right:4px solid var(--gold);
  border-radius:14px;
}
.fq-q[open] .fq-a p{animation:fqIn .5s ease both}
@keyframes fqIn{
  from{opacity:0;transform:translateY(-10px)}
  to{opacity:1;transform:none}
}

.fq-side{
  position:sticky;
  top:calc(var(--hh) + 20px);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  gap:12px;
  padding:34px 26px 28px;
  text-align:center;
  color:#fff;
  border-radius:30px;
  background:
    radial-gradient(circle at 80% 10%,rgba(238,189,114,.25),transparent 45%),
    linear-gradient(160deg,#14606b,#0a3039);
  border:1px solid rgba(248,223,174,.3);
  box-shadow:0 28px 56px rgba(12,61,74,.3);
}
.fq-side > *{position:relative;z-index:2}
.fq-big{
  width:84px;height:84px;
  margin:0 auto;
  display:grid;
  place-items:center;
  font-size:42px;
  border-radius:50%;
  background:rgba(255,255,255,.12);
  animation:bob 4.5s ease-in-out infinite;
}
.fq-side h3{
  font-size:24px;
  font-weight:900;
  color:var(--gold2);
}
.fq-side p{
  font-size:15px;
  line-height:1.9;
  color:#d6ebe8;
  margin-bottom:6px;
}
.fq-side .btn{
  width:100%;
  text-align:center;
}
.fq-bub{
  position:absolute;
  bottom:-30px;
  border-radius:50%;
  background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.4),rgba(122,215,203,.08));
  border:1px solid rgba(255,255,255,.22);
  animation:rise linear infinite;
  pointer-events:none;
  z-index:1;
}
.fq-bub.fb1{width:22px;height:22px;left:12%;animation-duration:10s}
.fq-bub.fb2{width:14px;height:14px;left:50%;animation-duration:8s;animation-delay:2s}
.fq-bub.fb3{width:28px;height:28px;left:82%;animation-duration:12s;animation-delay:1s}

@media (max-width:900px){
  .faq{padding:100px 0 70px}
  .fq-grid{grid-template-columns:1fr;gap:30px}
  .fq-side{position:relative;top:auto}
}

@media (max-width:560px){
  .faq{padding:90px 0 60px}
  .fq-head{margin-bottom:34px}
  .fq-q summary{padding:14px 12px;gap:10px}
  .fq-ic{width:40px;height:40px;font-size:20px;border-radius:12px}
  .fq-t{font-size:15px}
  .fq-pm{width:30px;height:30px}
  .fq-a{padding:0 12px 16px}
  .fq-a p{font-size:14.5px;padding:12px 12px}
  .fq-side{padding:28px 18px 22px;border-radius:24px}
}
.rw{
  position:relative;
  padding:120px 0 90px;
  overflow:hidden;
  color:#fff;
  background:
    radial-gradient(ellipse at 85% 8%,rgba(238,189,114,.16),transparent 50%),
    radial-gradient(ellipse at 10% 95%,rgba(122,215,203,.2),transparent 50%),
    linear-gradient(170deg,#0f4c5a 0%,#0c3d4a 55%,#0a3039 100%);
}
.rw::before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;
  height:22px;
  z-index:3;
  background:
    linear-gradient(135deg,var(--sand) 25%,transparent 25%) -11px 0/22px 22px,
    linear-gradient(225deg,var(--sand) 25%,transparent 25%) -11px 0/22px 22px;
}
.rw .wrap{position:relative;z-index:2}

.rw-blob{
  position:absolute;
  border-radius:50%;
  filter:blur(60px);
  pointer-events:none;
}
.rw-b1{
  width:340px;height:340px;
  top:120px;left:-120px;
  background:radial-gradient(circle,rgba(122,215,203,.25),transparent 70%);
  animation:float 13s ease-in-out infinite;
}
.rw-b2{
  width:360px;height:360px;
  bottom:60px;right:-120px;
  background:radial-gradient(circle,rgba(238,189,114,.22),transparent 70%);
  animation:float 15s ease-in-out infinite reverse;
}

.rw-head{
  max-width:780px;
  margin:0 auto 44px;
  text-align:center;
}
.rw .ab-eb{
  color:var(--gold2);
  background:rgba(248,223,174,.12);
  border-color:rgba(248,223,174,.3);
}
.rw-head h2{
  font-size:clamp(26px,4.6vw,44px);
  line-height:1.5;
  font-weight:900;
  margin:6px 0 14px;
  color:#fff;
}
.rw-head h2 em{
  font-style:normal;
  background:linear-gradient(90deg,var(--gold2),var(--aqua),var(--gold2));
  background-size:220% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  animation:shine 6s linear infinite;
}
.rw-head p{
  font-size:clamp(15px,2.3vw,17px);
  color:#cfe6e3;
}
.rw-sum{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-top:18px;
  padding:8px 20px;
  font-size:14.5px;
  font-weight:700;
  color:#e6f3f1;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.2);
  border-radius:50px;
}
.rw-sum span{
  color:var(--gold);
  letter-spacing:2px;
  font-size:17px;
}

.rw-row{
  position:relative;
  z-index:2;
  overflow:hidden;
  direction:ltr;
  padding:12px 0;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 8%,#000 92%,transparent 100%);
}
.rw-track{
  display:flex;
  width:max-content;
  animation:rwMove 70s linear infinite;
}
.rw-rev .rw-track{animation-direction:reverse;animation-duration:80s}
@keyframes rwMove{to{transform:translateX(-50%)}}

.rc{
  flex:none;
  direction:rtl;
  width:340px;
  margin:0 11px;
  padding:24px 22px 20px;
  display:flex;
  flex-direction:column;
  position:relative;
  border-radius:26px;
  background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.18);
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
  box-shadow:0 18px 40px rgba(0,0,0,.2);
  transition:transform .4s,background .4s,border-color .4s;
}
.rc::before{
  content:"”";
  position:absolute;
  top:-4px;left:18px;
  font-size:80px;
  line-height:1;
  color:var(--gold);
  opacity:.3;
  pointer-events:none;
}
.rc:hover{
  transform:translateY(-8px);
  background:rgba(255,255,255,.15);
  border-color:rgba(248,223,174,.5);
}
.rc-s{
  color:var(--gold);
  font-size:18px;
  letter-spacing:3px;
  margin-bottom:8px;
}
.rc blockquote{
  flex:1;
  font-size:15.5px;
  line-height:2;
  color:#e2f1ef;
  margin-bottom:16px;
}
.rc figcaption{
  display:flex;
  align-items:center;
  gap:12px;
  padding-top:14px;
  border-top:1px solid rgba(255,255,255,.14);
}
.rc-av{
  flex:none;
  display:grid;
  place-items:center;
  width:42px;height:42px;
  font-size:19px;
  font-weight:900;
  color:var(--deep2);
  background:linear-gradient(135deg,var(--gold2),var(--gold));
  border-radius:50%;
}
.rc b{
  font-size:16.5px;
  font-weight:900;
  color:var(--gold2);
}

.rw-go{
  margin-top:44px;
  text-align:center;
}
.rw-go p{
  margin-bottom:16px;
  font-size:17px;
  font-weight:700;
  color:#e2f1ef;
}

@media (hover:hover){
  .rw-row:hover .rw-track{animation-play-state:paused}
}

@media (max-width:560px){
  .rw{padding:90px 0 64px}
  .rw-head{margin-bottom:34px}
  .rc{width:285px;margin:0 8px;padding:20px 18px 16px;border-radius:22px}
  .rc blockquote{font-size:14.5px;line-height:1.95}
  .rw-row{
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 5%,#000 95%,transparent 100%);
    mask-image:linear-gradient(90deg,transparent 0,#000 5%,#000 95%,transparent 100%);
  }
  .rw-go .btn{width:100%;max-width:320px;text-align:center}
}

@media (prefers-reduced-motion:reduce){
  .rw-row{overflow-x:auto}
  .rw-track{animation:none!important;transform:none!important}
}
.wy{
  position:relative;
  padding:120px 0 90px;
  overflow:hidden;
  color:#17434b;
  background:linear-gradient(180deg,#e4f2ef 0%,#f1f8f5 55%,var(--sand) 100%);
}
.wy::before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;
  height:22px;
  z-index:3;
  background:
    linear-gradient(135deg,#0a3039 25%,transparent 25%) -11px 0/22px 22px,
    linear-gradient(225deg,#0a3039 25%,transparent 25%) -11px 0/22px 22px;
}
section.wy .wrap{position:relative;z-index:2}

.wy-blob{
  position:absolute;
  border-radius:50%;
  filter:blur(60px);
  pointer-events:none;
}
.wy-b1{
  width:360px;height:360px;
  top:140px;right:-120px;
  background:radial-gradient(circle,rgba(238,189,114,.34),transparent 70%);
  animation:float 13s ease-in-out infinite;
}
.wy-b2{
  width:360px;height:360px;
  bottom:140px;left:-120px;
  background:radial-gradient(circle,rgba(122,215,203,.4),transparent 70%);
  animation:float 15s ease-in-out infinite reverse;
}

.wy-head{
  max-width:820px;
  margin:0 auto 50px;
  text-align:center;
}
.wy-head h2{
  font-size:clamp(26px,4.6vw,42px);
  line-height:1.55;
  font-weight:900;
  color:#0c3d4a;
  margin:6px 0 14px;
}
.wy-head h2 em{
  font-style:normal;
  background:linear-gradient(100deg,#14606b,#d49a3f,#14606b);
  background-size:220% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  animation:shine 6s linear infinite;
}
.wy-head p{
  font-size:clamp(15px,2.3vw,17px);
  color:#3d6068;
}

.wy-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
}
div.wy{
  position:relative;
  padding:0;
  background:none;
  overflow:visible;
  perspective:800px;
}
div.wy::before{display:none}
.wy-in{
  position:relative;
  height:100%;
  padding:26px 20px 22px;
  overflow:hidden;
  background:#fff;
  border-radius:26px;
  border:1px solid rgba(20,96,107,.1);
  box-shadow:0 12px 30px rgba(12,61,74,.09);
  transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));
  transform-style:preserve-3d;
  transition:transform .25s ease-out,box-shadow .4s ease;
}
.wy-in::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:5px;
  background:linear-gradient(90deg,var(--gold),var(--aqua));
  transform:scaleX(0);
  transform-origin:right;
  transition:transform .5s ease;
}
.wy-in:hover{box-shadow:0 28px 52px rgba(12,61,74,.2)}
.wy-in:hover::after{transform:scaleX(1)}
.wy-no{
  position:absolute;
  top:10px;left:16px;
  font-size:56px;
  font-weight:900;
  line-height:1;
  color:rgba(20,96,107,.08);
  pointer-events:none;
}
.wy-in i{
  display:grid;
  place-items:center;
  width:62px;height:62px;
  margin-bottom:14px;
  font-style:normal;
  font-size:31px;
  border-radius:20px;
  background:linear-gradient(145deg,#e7f3ef,#fff4dc);
  border:1px solid rgba(20,96,107,.1);
  animation:bob 5s ease-in-out infinite;
  transition:background .4s;
}
.wy-in:hover i{background:var(--gold2)}
.wy-in h3{
  font-size:18.5px;
  font-weight:900;
  line-height:1.55;
  color:#0c3d4a;
  margin-bottom:8px;
}
.wy-in p{
  font-size:14.5px;
  line-height:1.95;
  color:#4d6f76;
}

.wy-cmp{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  gap:18px;
  align-items:stretch;
  margin-top:56px;
}
.wy-pn{
  padding:28px 26px;
  border-radius:28px;
  transition:opacity .8s ease,transform .8s ease;
}
.wy-pn h3{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:21px;
  font-weight:900;
  margin-bottom:16px;
}
.wy-pn h3 i{font-style:normal;font-size:24px}
.wy-pn ul{display:grid;gap:10px}
.wy-pn li{
  position:relative;
  padding-inline-start:32px;
  font-size:15.5px;
  font-weight:500;
  line-height:1.8;
}
.wy-pn li::before{
  position:absolute;
  right:0;top:3px;
  display:grid;
  place-items:center;
  width:22px;height:22px;
  font-size:12px;
  font-weight:900;
  border-radius:50%;
  line-height:1;
}
.wy-yes{
  color:#fff;
  background:
    radial-gradient(circle at 85% 10%,rgba(238,189,114,.25),transparent 45%),
    linear-gradient(160deg,#14606b,#0a3039);
  border:1px solid rgba(248,223,174,.35);
  box-shadow:0 26px 54px rgba(12,61,74,.3);
}
.wy-yes h3{color:var(--gold2)}
.wy-yes li{color:#e2f1ef}
.wy-yes li::before{content:"✔";color:#0c3d4a;background:var(--gold2)}
.wy-no2{
  color:#5b6b6e;
  background:rgba(255,255,255,.7);
  border:1px dashed rgba(20,96,107,.25);
}
.wy-no2 h3{color:#7a6a58}
.wy-no2 li::before{content:"✖";color:#fff;background:#b9a99a}
.wy-vs{
  display:grid;
  place-items:center;
  transition:opacity .8s ease,transform .8s ease;
}
.wy-vs span{
  display:grid;
  place-items:center;
  width:60px;height:60px;
  font-size:18px;
  font-weight:900;
  color:#0c3d4a;
  background:linear-gradient(135deg,var(--gold2),var(--gold));
  border-radius:50%;
  animation:pulse 2.6s infinite;
}

.wy-pr{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  margin-top:50px;
  padding:34px;
  overflow:hidden;
  color:#fff;
  border-radius:30px;
  background:
    radial-gradient(circle at 12% 20%,rgba(238,189,114,.25),transparent 45%),
    linear-gradient(150deg,#14606b,#0a3039);
  border:1px solid rgba(248,223,174,.3);
  box-shadow:0 26px 56px rgba(12,61,74,.3);
}
.wy-pt,.wy-pbn{position:relative;z-index:2}
.wy-pt h3{
  font-size:clamp(20px,3.2vw,28px);
  font-weight:900;
  color:var(--gold2);
  margin-bottom:6px;
}
.wy-pt p{
  max-width:560px;
  font-size:15.5px;
  color:#d6ebe8;
}
.wy-pbn{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  flex:none;
}
.wy-pb{
  position:absolute;
  bottom:-30px;
  border-radius:50%;
  background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.4),rgba(122,215,203,.08));
  border:1px solid rgba(255,255,255,.22);
  animation:rise linear infinite;
  pointer-events:none;
  z-index:1;
}
.wy-pb.pb1{width:22px;height:22px;left:20%;animation-duration:10s}
.wy-pb.pb2{width:14px;height:14px;left:52%;animation-duration:8s;animation-delay:2s}
.wy-pb.pb3{width:30px;height:30px;left:76%;animation-duration:13s;animation-delay:1s}

@media (max-width:1000px){
  .wy-grid{grid-template-columns:repeat(2,1fr)}
  .wy-pr{flex-direction:column;align-items:flex-start}
}

@media (max-width:800px){
  .wy{padding:100px 0 70px}
  .wy-cmp{grid-template-columns:1fr;gap:14px}
  .wy-vs span{width:52px;height:52px;font-size:16px}
}

@media (max-width:560px){
  .wy{padding:90px 0 60px}
  .wy-head{margin-bottom:36px}
  .wy-grid{grid-template-columns:1fr;gap:16px}
  .wy-in{padding:22px 18px 20px;border-radius:22px}
  .wy-pn{padding:24px 18px;border-radius:24px}
  .wy-pn h3{font-size:19px}
  .wy-pn li{font-size:14.5px}
  .wy-pr{padding:26px 20px;border-radius:24px}
  .wy-pbn{width:100%;flex-direction:column}
  .wy-pbn .btn{width:100%;text-align:center}
}

@media (hover:none){
  .wy-in{transform:none!important}
}
.ct{
  position:relative;
  padding:120px 0 90px;
  overflow:hidden;
  color:#fff;
  background:
    radial-gradient(ellipse at 12% 8%,rgba(122,215,203,.2),transparent 50%),
    radial-gradient(ellipse at 90% 92%,rgba(238,189,114,.16),transparent 50%),
    linear-gradient(170deg,#0f4c5a 0%,#0c3d4a 55%,#0a3039 100%);
}
.ct::before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;
  height:22px;
  z-index:3;
  background:
    linear-gradient(135deg,var(--sand) 25%,transparent 25%) -11px 0/22px 22px,
    linear-gradient(225deg,var(--sand) 25%,transparent 25%) -11px 0/22px 22px;
}
.ct .wrap{position:relative;z-index:2}
.ct .ab-eb{
  color:var(--gold2);
  background:rgba(248,223,174,.12);
  border-color:rgba(248,223,174,.3);
}

.ct-blob{
  position:absolute;
  border-radius:50%;
  filter:blur(60px);
  pointer-events:none;
}
.ct-b1{
  width:340px;height:340px;
  top:140px;right:-120px;
  background:radial-gradient(circle,rgba(238,189,114,.24),transparent 70%);
  animation:float 13s ease-in-out infinite;
}
.ct-b2{
  width:360px;height:360px;
  bottom:60px;left:-120px;
  background:radial-gradient(circle,rgba(122,215,203,.26),transparent 70%);
  animation:float 15s ease-in-out infinite reverse;
}
.ct-dot{
  position:absolute;
  bottom:-20px;
  width:9px;height:9px;
  border-radius:50%;
  background:rgba(248,223,174,.5);
  animation:rise linear infinite;
  pointer-events:none;
}
.ct-dot.cd1{left:12%;animation-duration:16s}
.ct-dot.cd2{left:38%;animation-duration:12s;animation-delay:3s;width:7px;height:7px}
.ct-dot.cd3{left:64%;animation-duration:18s;animation-delay:1s}
.ct-dot.cd4{left:88%;animation-duration:14s;animation-delay:4s;width:8px;height:8px}

.ct-head{
  max-width:800px;
  margin:0 auto 48px;
  text-align:center;
}
.ct-head h2{
  font-size:clamp(26px,4.6vw,44px);
  line-height:1.5;
  font-weight:900;
  margin:6px 0 14px;
  color:#fff;
}
.ct-head h2 em{
  font-style:normal;
  background:linear-gradient(90deg,var(--gold2),var(--aqua),var(--gold2));
  background-size:220% 100%;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  -webkit-text-fill-color:transparent;
  animation:shine 6s linear infinite;
}
.ct-head p{
  font-size:clamp(15px,2.3vw,17px);
  color:#cfe6e3;
}

.ct-grid{
  display:grid;
  grid-template-columns:1fr 1.1fr;
  gap:34px;
  align-items:start;
}
.ct-info{display:grid;gap:14px}
.ct-c{
  display:flex;
  align-items:center;
  gap:14px;
  padding:16px 18px;
  border-radius:22px;
  background:rgba(255,255,255,.09);
  border:1px solid rgba(255,255,255,.18);
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
  transition:opacity .8s ease,transform .4s ease,background .4s ease,border-color .4s ease;
}
a.ct-c.in:hover{
  transform:translateX(-8px);
  background:rgba(255,255,255,.15);
  border-color:rgba(248,223,174,.5);
}
.ct-c i{
  flex:none;
  display:grid;
  place-items:center;
  width:54px;height:54px;
  font-style:normal;
  font-size:27px;
  border-radius:16px;
  background:rgba(248,223,174,.16);
  border:1px solid rgba(248,223,174,.3);
  animation:bob 5s ease-in-out infinite;
}
.ct-wa i{background:rgba(47,191,136,.22);border-color:rgba(47,191,136,.5)}
.ct-c div{flex:1;min-width:0}
.ct-c b{
  display:block;
  font-size:17px;
  font-weight:900;
  color:var(--gold2);
}
.ct-c span{
  display:block;
  font-size:14.5px;
  line-height:1.8;
  color:#d6ebe8;
}
.ct-c em{
  flex:none;
  font-style:normal;
  font-size:22px;
  color:var(--gold2);
}

.ct-pts{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:4px;
}
.ct-pts span{
  padding:7px 16px;
  font-size:14px;
  font-weight:700;
  color:var(--deep2);
  background:linear-gradient(135deg,var(--gold2),var(--gold));
  border-radius:50px;
}

.ct-form{
  display:grid;
  gap:16px;
  padding:32px 28px;
  color:#17434b;
  background:#fff;
  border-radius:30px;
  border:1px solid rgba(248,223,174,.5);
  box-shadow:0 30px 60px rgba(0,0,0,.3);
}
.ct-form h3{
  font-size:25px;
  font-weight:900;
  color:#0c3d4a;
}
.ct-sub{
  margin-top:-8px;
  font-size:14.5px;
  color:#4d6f76;
}
.ct-f{
  display:grid;
  gap:6px;
}
.ct-f > span{
  font-size:15px;
  font-weight:700;
  color:#0c3d4a;
}
.ct-f small{
  font-weight:500;
  color:#7a9096;
}
.ct-f input,
.ct-f select,
.ct-f textarea{
  width:100%;
  padding:13px 16px;
  font-family:inherit;
  font-size:16px;
  color:#0c3d4a;
  background:#f4faf8;
  border:2px solid rgba(20,96,107,.14);
  border-radius:16px;
  outline:none;
  transition:border-color .3s,box-shadow .3s,background .3s;
}
.ct-f textarea{resize:vertical;min-height:110px}
.ct-f input:focus,
.ct-f select:focus,
.ct-f textarea:focus{
  background:#fff;
  border-color:var(--gold);
  box-shadow:0 0 0 4px rgba(238,189,114,.25);
}
.ct-f.bad input{
  border-color:#d9534f;
  box-shadow:0 0 0 4px rgba(217,83,79,.15);
}
.ct-send{
  width:100%;
  font-family:inherit;
  text-align:center;
}
.ct-note{
  min-height:22px;
  font-size:14.5px;
  font-weight:700;
  text-align:center;
}
.ct-note.ok{color:#18936a}
.ct-note.err{color:#d9534f}

.ft{
  position:relative;
  padding:70px 0 0;
  color:#cfe6e3;
  background:linear-gradient(180deg,#082a32 0%,#061f26 100%);
  border-top:4px solid var(--gold);
}
.ft-grid{
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr 1.2fr;
  gap:36px;
  padding-bottom:44px;
}
.ft-logo{display:inline-block;margin-bottom:14px}
.ft-logo img{
  height:58px;
  width:auto;
  max-width:190px;
  object-fit:contain;
}
.ft-about p{
  font-size:14.5px;
  line-height:2;
  color:#b9d8d4;
}
.ft h4{
  position:relative;
  margin-bottom:18px;
  padding-bottom:10px;
  font-size:18px;
  font-weight:900;
  color:var(--gold2);
}
.ft h4::after{
  content:"";
  position:absolute;
  right:0;bottom:0;
  width:40px;height:3px;
  border-radius:3px;
  background:linear-gradient(90deg,var(--gold),var(--aqua));
}
.ft ul{display:grid;gap:10px}
.ft li a{
  display:inline-block;
  font-size:15px;
  color:#b9d8d4;
  transition:color .3s,transform .3s;
}
.ft li a:hover{
  color:var(--gold2);
  transform:translateX(-6px);
}
.ft-ct li a{
  display:flex;
  align-items:center;
  gap:10px;
}
.ft-ct li a span{
  flex:none;
  display:grid;
  place-items:center;
  width:36px;height:36px;
  font-size:17px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.14);
  border-radius:12px;
}
.ft-ct li a b{font-weight:500}

.ft-bar{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  padding:20px 0 calc(20px + env(safe-area-inset-bottom,0px));
  text-align:center;
  border-top:1px solid rgba(255,255,255,.12);
}
.ft-bar p{
  font-size:13.5px;
  color:#9fc4c0;
}
.ft-credit{
  font-size:14.5px!important;
  color:#cfe6e3!important;
}
.ft-credit a{
  font-weight:900;
  color:var(--gold2);
  border-bottom:2px solid rgba(248,223,174,.4);
  transition:color .3s,border-color .3s;
}
.ft-credit a:hover{
  color:#fff;
  border-color:var(--aqua);
}

.fx{
  position:fixed;
  left:16px;
  bottom:calc(16px + env(safe-area-inset-bottom,0px));
  z-index:80;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
}
.fx-b{
  position:relative;
  display:grid;
  place-items:center;
  width:54px;height:54px;
  font-size:26px;
  color:#fff;
  border-radius:50%;
  box-shadow:0 12px 26px rgba(0,0,0,.35);
  transition:transform .3s,box-shadow .3s,opacity .3s,visibility .3s;
  -webkit-tap-highlight-color:transparent;
}
.fx-b:hover{transform:translateY(-4px) scale(1.08)}
.fx-wa{background:linear-gradient(135deg,#34d399,#128a5a)}
.fx-call{background:linear-gradient(135deg,#14606b,#0c3d4a);border:2px solid rgba(248,223,174,.6)}
.fx-wa::before,
.fx-call::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  z-index:-1;
  animation:fxPulse 2.4s infinite;
}
.fx-wa::before{background:rgba(52,211,153,.5)}
.fx-call::before{background:rgba(238,189,114,.45);animation-delay:1.1s}
@keyframes fxPulse{
  0%{transform:scale(1);opacity:.8}
  100%{transform:scale(1.7);opacity:0}
}
.fx-b span{display:block;animation:ring 2.4s ease-in-out infinite}
.fx-wa span{animation-name:bob}
.fx-up{
  width:46px;height:46px;
  font-size:22px;
  font-weight:900;
  color:var(--deep2);
  background:linear-gradient(135deg,var(--gold2),var(--gold));
  opacity:0;
  visibility:hidden;
  transform:translateY(10px);
}
.fx-up.show{
  opacity:1;
  visibility:visible;
  transform:none;
}
.fx-up.show:hover{transform:translateY(-4px) scale(1.08)}

@media (max-width:1000px){
  .ft-grid{grid-template-columns:1fr 1fr;gap:34px}
}

@media (max-width:900px){
  .ct{padding:100px 0 70px}
  .ct-grid{grid-template-columns:1fr;gap:28px}
}

@media (max-width:560px){
  .ct{padding:90px 0 60px}
  .ct-head{margin-bottom:34px}
  .ct-c{padding:14px;gap:12px;border-radius:20px}
  .ct-c i{width:48px;height:48px;font-size:24px}
  .ct-c b{font-size:16px}
  .ct-c span{font-size:13.5px}
  .ct-form{padding:24px 18px;border-radius:24px}
  .ct-form h3{font-size:22px}
  .ft{padding-top:54px}
  .ft-grid{grid-template-columns:1fr;gap:30px;padding-bottom:34px}
  .fx{left:12px;gap:10px}
  .fx-b{width:50px;height:50px;font-size:24px}
  .fx-up{width:42px;height:42px}
}

@media (prefers-reduced-motion:reduce){
  .fx-wa::before,.fx-call::before{animation:none}
}