@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@500;700;800&family=JetBrains+Mono:wght@700&display=swap');

.cwaqua{
  --navy:#07203D;
  --navy-2:#0E3A6B;
  --blue:#1268F3;
  --blue-lt:#5AA0FF;
  --aqua:#22C0E8;
  --sky:#E6F0FF;
  --ice:#F4F8FF;
  --slate:#7D94B0;
  --text:#0B2340;
  font-family:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
  color:var(--text);max-width:1060px;margin:0 auto;box-sizing:border-box;-webkit-font-smoothing:antialiased;
}
.cwaqua *,.cwaqua *::before,.cwaqua *::after{box-sizing:border-box;}

.cwaqua [data-rise]{opacity:0;transform:translateY(14px);animation:cwaRise .7s cubic-bezier(.2,.7,.3,1) forwards;}
.cwaqua [data-rise="2"]{animation-delay:.12s;}
@keyframes cwaRise{to{opacity:1;transform:none;}}

.cwaqua-head{text-align:center;margin-bottom:22px;}
.cwaqua-eyebrow{
  display:inline-block;font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:800;
  color:var(--blue);background:var(--sky);padding:7px 14px;border-radius:99px;margin:0 0 14px;
}
.cwaqua-title{font-size:clamp(26px,4.6vw,44px);line-height:1.08;font-weight:800;letter-spacing:-.025em;margin:0 0 10px;}
.cwaqua-title span{background:linear-gradient(90deg,var(--blue),var(--aqua));-webkit-background-clip:text;background-clip:text;color:transparent;}
.cwaqua-sub{margin:0 auto;font-size:15px;line-height:1.55;color:#54708F;max-width:54ch;}

.cwaqua-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:20px;align-items:stretch;}

.cwaqua-panel{
  background:linear-gradient(160deg,var(--navy) 0%,var(--navy-2) 100%);
  color:#fff;border-radius:22px;padding:26px 24px 28px;position:relative;overflow:hidden;
}
.cwaqua-panel::before{
  content:"";position:absolute;width:300px;height:300px;right:-120px;top:-130px;border-radius:50%;
  background:radial-gradient(circle,rgba(34,192,232,.35),transparent 65%);
  animation:cwaGlow 8s ease-in-out infinite alternate;
}
@keyframes cwaGlow{from{transform:scale(1);opacity:.65;}to{transform:scale(1.3);opacity:1;}}
.cwaqua-panel h3{position:relative;margin:0 0 18px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:800;color:var(--blue-lt);}
.cwaqua-field{position:relative;padding:15px 0;border-top:1px solid rgba(255,255,255,.12);}
.cwaqua-field:first-of-type{border-top:0;padding-top:0;}
.cwaqua-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:10px;}
.cwaqua-label{font-size:14px;font-weight:600;line-height:1.3;color:#fff;}
.cwaqua-val{
  font-family:'JetBrains Mono',ui-monospace,Menlo,Consolas,monospace;font-size:14px;font-weight:700;color:#fff;
  background:rgba(90,160,255,.22);padding:4px 10px;border-radius:8px;white-space:nowrap;
  transition:transform .18s ease,background .18s ease;
}
.cwaqua-val.bump{transform:scale(1.09);background:rgba(34,192,232,.42);}
.cwaqua-hint{font-size:12px;color:rgba(255,255,255,.55);margin:9px 0 0;}

.cwaqua-seg{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;background:rgba(255,255,255,.09);padding:5px;border-radius:12px;}
.cwaqua-seg button{
  font-family:inherit;font-size:12.5px;font-weight:700;color:rgba(255,255,255,.72);cursor:pointer;
  background:transparent;border:0;padding:10px 6px;border-radius:9px;line-height:1.25;
  transition:background .2s ease,color .2s ease,transform .15s ease;
}
.cwaqua-seg button small{display:block;font-weight:600;font-size:10.5px;opacity:.7;margin-top:2px;}
.cwaqua-seg button:hover{color:#fff;background:rgba(255,255,255,.08);}
.cwaqua-seg button.on{background:#fff;color:var(--navy);transform:translateY(-1px);}
.cwaqua-seg button:focus-visible{outline:2px solid var(--blue-lt);outline-offset:2px;}

.cwaqua input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:24px;background:transparent;margin:0;display:block;padding:0;border:0;}
.cwaqua input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:99px;background:rgba(255,255,255,.18);}
.cwaqua input[type=range]::-moz-range-track{height:6px;border-radius:99px;background:rgba(255,255,255,.18);}
.cwaqua input[type=range]::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;width:22px;height:22px;border-radius:50%;background:#fff;margin-top:-8px;
  cursor:pointer;box-shadow:0 0 0 4px rgba(90,160,255,.35);transition:box-shadow .2s ease,transform .12s ease;
}
.cwaqua input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#fff;border:none;cursor:pointer;box-shadow:0 0 0 4px rgba(90,160,255,.35);}
.cwaqua input[type=range]:hover::-webkit-slider-thumb{box-shadow:0 0 0 7px rgba(90,160,255,.3);}
.cwaqua input[type=range]:active::-webkit-slider-thumb{transform:scale(1.12);}
.cwaqua input[type=range]:focus-visible{outline:2px solid var(--blue-lt);outline-offset:4px;border-radius:8px;}

.cwaqua-result{
  background:#fff;border-radius:22px;padding:26px 24px 28px;
  box-shadow:0 2px 4px rgba(7,32,61,.05),0 24px 48px -28px rgba(7,32,61,.45);
  display:flex;flex-direction:column;
}
.cwaqua-result h3{margin:0 0 18px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:800;color:var(--blue);}

.cwaqua-hero{display:flex;align-items:center;gap:20px;}
.cwaqua-glass{width:100px;flex:none;}
.cwaqua-glass svg{display:block;width:100%;height:auto;overflow:visible;}
.cwa-drop{animation:cwaDrop 2.6s cubic-bezier(.5,0,.9,.5) infinite;transform-origin:center;}
@keyframes cwaDrop{
  0%{opacity:0;transform:translateY(-6px) scale(.6);}
  15%{opacity:1;}
  70%{opacity:1;transform:translateY(26px) scale(1);}
  85%,100%{opacity:0;transform:translateY(30px) scale(1.3);}
}
#cwa-wave-g{transition:transform .8s cubic-bezier(.25,.8,.3,1);}
.cwa-wave{animation:cwaWave 5s linear infinite;}
.cwa-wave.b{animation-duration:7.5s;animation-direction:reverse;opacity:.5;}
@keyframes cwaWave{from{transform:translateX(0);}to{transform:translateX(-120px);}}

.cwaqua-big{flex:1;min-width:0;}
.cwaqua-big .lbl{font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:800;color:var(--slate);}
.cwaqua-big .amt{
  font-family:'JetBrains Mono',ui-monospace,monospace;font-weight:700;font-size:clamp(30px,5.6vw,44px);
  line-height:1.06;letter-spacing:-.03em;color:var(--blue);margin:6px 0 4px;word-break:break-word;
}
.cwaqua-big .note{margin:0;font-size:13.5px;line-height:1.5;color:#54708F;}

.cwaqua-bars{margin:22px 0 6px;}
.cwaqua-bar{margin-bottom:14px;}
.cwaqua-bar .cap{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;font-weight:600;color:#54708F;margin-bottom:6px;}
.cwaqua-bar .cap b{font-family:'JetBrains Mono',ui-monospace,monospace;color:var(--text);white-space:nowrap;}
.cwaqua-bar .track{height:12px;border-radius:99px;background:var(--ice);overflow:hidden;}
.cwaqua-bar .fill{height:100%;border-radius:99px;width:0;transition:width .8s cubic-bezier(.25,.8,.3,1);}
.cwaqua-bar.pet .fill{background:linear-gradient(90deg,#B9C9DA,#93A9C0);}
.cwaqua-bar.ro .fill{background:linear-gradient(90deg,var(--blue),var(--aqua));position:relative;overflow:hidden;}
.cwaqua-bar.ro .fill::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,transparent 20%,rgba(255,255,255,.55) 50%,transparent 80%);
  transform:translateX(-100%);animation:cwaShine 2.8s ease-in-out infinite;
}
@keyframes cwaShine{0%{transform:translateX(-100%);}55%,100%{transform:translateX(220%);}}

.cwaqua-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:8px;}
.cwaqua-stat{background:var(--ice);border-radius:14px;padding:13px 12px;text-align:center;}
.cwaqua-stat .k{display:block;font-size:11px;letter-spacing:.05em;text-transform:uppercase;font-weight:700;color:var(--slate);margin-bottom:5px;line-height:1.3;}
.cwaqua-stat .v{font-family:'JetBrains Mono',ui-monospace,monospace;font-weight:700;font-size:15px;color:var(--text);}

.cwaqua-payback{margin-top:16px;background:var(--sky);border-radius:14px;padding:14px 16px;font-size:13.5px;line-height:1.55;}
.cwaqua-payback b{font-family:'JetBrains Mono',ui-monospace,monospace;color:var(--blue);}
.cwaqua-eco{
  margin-top:10px;border-radius:14px;padding:14px 16px;font-size:13.5px;line-height:1.55;
  background:linear-gradient(120deg,rgba(34,192,232,.14),rgba(18,104,243,.10));
}
.cwaqua-eco b{font-family:'JetBrains Mono',ui-monospace,monospace;color:#0B7FA8;}

.cwaqua-specs{display:flex;flex-wrap:wrap;gap:7px;margin-top:16px;}
.cwaqua-specs span{
  font-size:11.5px;font-weight:700;color:var(--blue);background:var(--sky);
  padding:7px 11px;border-radius:99px;
}

.cwaqua-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;padding-top:20px;}
.cwaqua-btn{display:inline-block;text-decoration:none;font-weight:800;font-size:14px;padding:14px 22px;border-radius:99px;transition:transform .18s ease,box-shadow .18s ease,background .18s ease;}
.cwaqua-btn.primary{background:var(--blue);color:#fff;box-shadow:0 8px 18px -8px rgba(18,104,243,.9);}
.cwaqua-btn.primary:hover{background:#0B57D0;color:#fff;transform:translateY(-2px);box-shadow:0 14px 24px -10px rgba(18,104,243,.95);}
.cwaqua-btn.ghost{background:#fff;color:var(--blue);box-shadow:inset 0 0 0 1.5px rgba(18,104,243,.35);}
.cwaqua-btn.ghost:hover{background:var(--ice);color:var(--blue);transform:translateY(-2px);}
.cwaqua-btn:focus-visible{outline:2px solid var(--blue);outline-offset:3px;}

.cwaqua-foot{margin-top:14px;font-size:12px;color:var(--slate);line-height:1.55;}
.cwaqua-foot a{color:var(--blue);font-weight:700;text-decoration:none;}

@media (max-width:860px){
  .cwaqua-grid{grid-template-columns:1fr;}
  .cwaqua-glass{width:80px;}
}
@media (max-width:420px){
  .cwaqua-stats{grid-template-columns:1fr;}
}
@media (prefers-reduced-motion:reduce){
  .cwaqua *,.cwaqua *::before,.cwaqua *::after{animation:none !important;transition:none !important;}
  .cwaqua [data-rise]{opacity:1;transform:none;}
}
