/* Aquablu CSS */

/* FONTS */

@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&display=swap');

@font-face { font-family: "Futura Now Headline Bold"; src: url("https://framerusercontent.com/assets/cCLQrwbBOc4SkKkXji5TpAMTiKk.woff2"); font-display: swap; font-style: normal; font-weight: 700 }
@font-face { font-family: "Futura Now Headline ExtraBold"; src: url("https://framerusercontent.com/assets/fTjYTY7ZaxWnqBDEvKPGoTdbUU.woff2"); font-display: swap; font-style: normal; font-weight: 800 }
@font-face { font-family: "Futura Now Headline Bold"; src: url("https://framerusercontent.com/assets/cCLQrwbBOc4SkKkXji5TpAMTiKk.woff2"); font-display: swap }
@font-face { font-family: "Futura Now Headline Black"; src: url("https://framerusercontent.com/assets/9WRuZcyMavenbwl5X8YKN9Og.woff2"); font-display: swap }
@font-face { font-family: "Futura Now Headline Regular"; src: url("https://framerusercontent.com/assets/PemjH6oLY6y8wd4sGKEnnfKe2Yo.woff2"); font-display: swap }
@font-face { font-family: "Futura Now Headline Medium"; src: url("https://framerusercontent.com/assets/n1jRRNg06cYat9zNIhnxwdJRLfI.woff2"); font-display: swap }
@font-face { font-family: "Futura Now Headline Regular"; src: url("https://framerusercontent.com/assets/PemjH6oLY6y8wd4sGKEnnfKe2Yo.woff2"); font-display: swap; font-style: normal; font-weight: 400 }
@font-face { font-family: "Futura Now Headline Medium"; src: url("https://framerusercontent.com/assets/n1jRRNg06cYat9zNIhnxwdJRLfI.woff2"); font-display: swap; font-style: normal; font-weight: 500 }
@font-face { font-family: "Futura Now Headline Black"; src: url("https://framerusercontent.com/assets/9WRuZcyMavenbwl5X8YKN9Og.woff2"); font-style: normal; font-weight: 900 }
@font-face { font-family: "Futura Now Headline Italic"; src: url("https://framerusercontent.com/assets/FMDJam26aBtUdPcD7orR0zN1p4.woff2"); font-display: swap; font-style: italic; font-weight: 400 }
@font-face { font-family: "Futura Now Headline ExtraBlack"; src: url("https://framerusercontent.com/assets/x5XTGePeFT7x6oDL4wgIFBk4tY4.woff2"); font-style: normal; font-weight: 950 }
@font-face { font-family: "Futura Now Headline Bold Italic"; src: url("https://framerusercontent.com/assets/SEv21RH0B0s5xd3hwvBa6VxC6qQ.woff2"); font-display: swap; font-style: italic; font-weight: 700 }

@font-face { font-family: "Futura Now Headline Bold Placeholder"; src: local("Arial"); ascent-override: 76.33%; descent-override: 25.13%; line-gap-override: 18.62%; size-adjust: 107.43% }
@font-face { font-family: "Futura Now Headline ExtraBold Placeholder"; src: local("Arial"); ascent-override: 72.12%; descent-override: 23.75%; line-gap-override: 17.59%; size-adjust: 113.70% }
@font-face { font-family: "Futura Now Headline Black Placeholder"; src: local("Arial"); ascent-override: 67.85%; descent-override: 22.34%; line-gap-override: 16.55%; size-adjust: 120.86% }
@font-face { font-family: "Futura Now Headline Regular Placeholder"; src: local("Arial"); ascent-override: 84.26%; descent-override: 27.74%; line-gap-override: 20.55%; size-adjust: 97.32% }
@font-face { font-family: "Futura Now Headline Medium Placeholder"; src: local("Arial"); ascent-override: 81.05%; descent-override: 26.69%; line-gap-override: 19.77%; size-adjust: 101.17% }
@font-face { font-family: "Futura Now Headline Italic Placeholder"; src: local("Arial"); ascent-override: 84.12%; descent-override: 27.70%; line-gap-override: 20.52%; size-adjust: 97.48% }
@font-face { font-family: "Futura Now Headline Bold Italic Placeholder"; src: local("Arial"); ascent-override: 76.20%; descent-override: 25.09%; line-gap-override: 18.59%; size-adjust: 107.61% }

/*
.jost-<uniquifier> {
  font-family: "Jost", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
*/

/* FONT FACE */
.font-futura {
  font-family: "Futura Now Headline Regular", "Futura Now Headline Regular Placeholder", sans-serif !important;
}
.font-futura-medium {
  font-family: "Futura Now Headline Medium", "Futura Now Headline Medium Placeholder", sans-serif !important;
}
.font-futura-bold {
  font-family: "Futura Now Headline Bold", "Futura Now Headline Bold Placeholder", sans-serif !important;
}
.font-futura-extrabold {
  font-family: "Futura Now Headline ExtraBold", "Futura Now Headline ExtraBold Placeholder", sans-serif !important;
}
.font-futura-black {
  font-family: "Futura Now Headline Black", "Futura Now Headline Black Placeholder", sans-serif !important;
}

/* BG COLOR */
.bg-iceblue {
 background-color: #B2E0FF !important;
}
.bg-alabaster-grey {
 background-color: #DBDBDB !important;
}
.bg-neon {
 background-color: #16243E !important;
}
.bg-orange {
  background-color: #f04923 !important;
}

/* FONT COLOR */
.text-black {
  color: #000000 !important;
}
.text-neon {
  color: #16243E !important;
}
.text-teal {
  color: #00ffff !important;
}
.text-orange {
  color: #f04923 !important;
}
.text-alabaster-grey {
 color: #DBDBDB !important;
}

/* VIDEO BANNER */
.aquablu-video-banner.secondary-overlay[data-overlay-dark]:before,
.aquablu-image-banner.secondary-overlay[data-overlay-dark]:before {
    background: #16243e;
}

/* Baristocraat x Aquablu */

/* STEPS */
.process-style02 .img .img1 {
  margin-left:-20px
}
.process-style02 .line:after {
  content:"";
  display:inline-block;
  height:3px;
  width:60px;
  background-color:#f04923;
}

.shape-1 {
  width:600px;
  height:600px;
  border-radius:50%;
  border:90px solid rgba(255,255,255,0.05);
  position:absolute;
  bottom:-300px;
  left:-310px
}
.shape-2 {
  width:270px;
  height:270px;
  border-radius:50%;
  border:40px solid rgba(255,255,255,0.05);
  position:absolute;
  top:-110px;
  right:-100px
}
/* .shape-3 {
  width:600px;
  height:600px;
  border-radius:50%;
  border:90px solid rgba(240,73,35,0.3);
  position:absolute;
  bottom:-330px;
  left:-310px
} */
.shape-3 {
  width: 300px;
  height: 300px;
  border-radius: 50%;
  border: 60px solid rgba(240,73,35,0.4);
  position: absolute;
  bottom: 100px;
  left: -156px;
}
.shape-4 {
  width:470px;
  height:530px;
  border-radius:50%;
  border:75px solid rgba(22,36,62,0.4);
  position:absolute;
  /* top:132px; */
  top:25px;
  right:-262px
}
/* STEPS */

/* FLAVORS */
.cover-background {
    position: relative !important;
    background-size: cover !important;
    overflow: hidden !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}
.card-style7 {
  transition:all 0.3s ease 0.1s
}
.card-style7 .service-card {
  padding:75px 40px 30px 40px;
  transition:0.4s;
  min-height:420px;
  height:100%
}
.card-style7 .service-card:before {
  background:linear-gradient(-180deg, transparent, #14212B 110%);
  content:"";
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  left:0;
  width:100%;
  height:100%
}
.card-style7 .service-card .service-details {
  overflow:hidden;
  position:absolute;
  left:0;
  bottom:-65px;
  width:100%;
  padding:3rem;
  transition:all 0.3s;
  z-index:9
}
.card-style7 .service-card .service-details p {
  visibility:hidden;
  opacity:0;
  transition:all 0.3s ease 0.1s;
  height:70px
}
.card-style7 .service-card .service-details h6 {
  letter-spacing:.2em
}
.card-style7 .service-card .service-details h3 {
  margin-bottom:0
}
.card-style7:hover {
  box-shadow:0 10px 35px rgba(0,0,0,0.25);
  transform:translateY(-3px)
}
.card-style7:hover .service-card .service-details {
  bottom:10px
}
.card-style7:hover .service-card .service-details p {
  height:auto;
  opacity:1;
  visibility:visible
}
.card-style7:hover .service-card .service-details h3 {
  margin-bottom:20px
}
@media screen and (max-width: 1199px) {
  .card-style7 .service-card .service-details {
    padding:2rem
  }
}

/* .services-carousel-three.owl-carousel .owl-nav button.owl-next,
.services-carousel-three.owl-carousel .owl-nav button.owl-prev,
.services-carousel-three.owl-carousel button.owl-dot {
  background-color: #16243e !important;
} */
.owl-theme .owl-dots,
.owl-theme .owl-nav.disabled {
  margin-top: 15px !important;
}
.owl-theme .owl-nav.disabled + .owl-dots span,
.owl-theme .owl-dots .owl-dot span,
.owl-theme .owl-dots .owl-dot:hover span {
  background: #16243e !important;
}
.owl-theme .owl-dots .owl-dot.active span {
  background: #f04923 !important;
}

/* FLAVORS */

/* BENEFITS */
.blog-card {
  border: 1px solid rgba(0,0,0,0.075);
  border-radius: 6px;
  height: 100%;
}
/* BENEFITS */

/* IMPACT */
.aquablu-ecological-impact.secondary-overlay[data-overlay-dark]::before {
  background: #16243e;
  opacity: .65;
}
/* IMPACT */

/* Prompt for Pay-per-Drink */
.team-block:hover .team-hover,
.team-block:hover .image::before {
  border-radius: 6px;
  opacity:1;
  -webkit-transform:translateY(0px);
  -ms-transform:translateY(0px);
  transform:translateY(0px);
}
.team-block .image {
  position:relative;
  overflow:hidden
}
.team-block .image img {
  border-radius:6px
}
.team-block .image::before {
  position:absolute;
  content:"";
  bottom:0;
  left:0;
  height:100%;
  width:100%;
  background:#16243e;
  background:linear-gradient(0deg, #16243e 0%, rgba(9,184,80,0) 120%);
  -webkit-transition:all 0.4s ease;
  -o-transition:all 0.4s ease;
  transition:all 0.4s ease;
  -webkit-transform:translateY(100px);
  -ms-transform:translateY(100px);
  transform:translateY(100px);
  opacity:0
}
.team-block .team-hover {
  bottom:0;
  left:0;
  width:100%;
  -webkit-transform:translateY(100px);
  -ms-transform:translateY(100px);
  transform:translateY(100px);
  opacity:0;
  -webkit-transition:all 0.4s ease;
  -o-transition:all 0.4s ease;
  transition:all 0.4s ease
}
/* Prompt for Pay-per-Drink */

/* PAY PER DRINK PAGE */

/* PPD : How it works */
.service-icons {
  background:linear-gradient(0deg, rgba(240,73,35,0.1) 20%, rgba(240,73,35,0.4) 100%);
  width:80px;
  height:80px;
  border-radius:100%;
  position:relative;
  line-height:95px
}
.service-icons>i {
  font-size:42px;
  color:#f04923;
  margin-top:40px
}
@media screen and (max-width: 767px) {
  .service-icons {
    width:70px;
    height:70px;
    line-height:85px
  }
  .service-icons>i {
    font-size:32px
  }
}
/* PPD : How it works */
/* PPD : Ideal for */
.list-style-16 {
  list-style:none;
  margin:0;
  padding:0
}
.list-style-16 li {
  line-height:24px;
  margin-bottom:20px;
  position:relative;
  padding-left:30px;
  -webkit-transition:all 0.3s ease 0s;
  -moz-transition:all 0.3s ease 0s;
  -o-transition:all 0.3s ease 0s;
  transition:all 0.3s ease 0s
}
.list-style-16 li:after {
  content:'\f14a';
  font-family:Font Awesome\ 5 Free;
  position:absolute;
  left:0px;
  top:1px;
  z-index:1;
  color:#16243e
}
.list-style-16 li:hover {
  padding-left:40px
}
.list-style-16 li:last-child {
  margin-bottom:0
}
.list-style-16 li:after {
  color:#16243e
}
/* PPD : Ideal for */

/* PPD : table comparision */
.payperdrink-comparision {
  font-size: 18px;
}
@media (max-width: 768px) {
  .payperdrink-comparision { font-size: 16px; }
}
@media (max-width: 575px) {
  .payperdrink-comparision { font-size: 14px; }
}
/* PPD : table comparision */

/* START : AQUABLU PRICING MODULE */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&display=swap');


/* .manrope-200 {
  font-family: "Manrope", sans-serif;
  font-optical-sizing: auto;
  font-weight: 200;
  font-style: normal;
}
.manrope-300 {
  font-family: "Manrope", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
}
.manrope-400 {
  font-family: "Manrope", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}
.manrope-500 {
  font-family: "Manrope", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
}
.manrope-600 {
  font-family: "Manrope", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}
.manrope-700 {
  font-family: "Manrope", sans-serif;
  font-optical-sizing: auto;
  font-weight: 700;
  font-style: normal;
}
.manrope-800 {
  font-family: "Manrope", sans-serif;
  font-optical-sizing: auto;
  font-weight: 800;
  font-style: normal;
} */

.aquablu-pricing-lists {
  min-height: 100vh;
  padding: 100px 20px;
}

.bg-blue-gradient {
  background: linear-gradient(#4a8ece 0%,#3a60a6 100%);
  color: #fff;
}

/* ── HERO ── */
.hero-title {
  font-size: clamp(2.2rem, 5vw, 3.5rem);
  text-align: center;
  line-height: 1.1;
  text-transform: uppercase;
  letter-spacing: -0.5px;
  color: #fff;
}
.hero-title span { color: #00e5ff; display: block; }
.hero-sub {
  text-align: center;
  font-family: "Futura Now Headline Regular", "Futura Now Headline Regular Placeholder", sans-serif !important;
  font-size: 24px;
  max-width: 640px;
  margin: 14px auto 0;
  line-height: 1.6;
}

/* ── SECTION TITLE ── */
.section-title {
  font-size: 2.3rem;
  text-align: center;
  text-transform: uppercase;
  margin-bottom: 20px;
  color: #fff;
}

/* ── NAV PILLS ── */
.pill-nav-wrap {
  display: flex;
  justify-content: center;
  /* margin-bottom: 40px; */
  margin-bottom: 60px;
}

.pill-nav {
  position: relative;
  background-color: rgba(255, 255, 255, 0.2);
  opacity: 1;
  border-radius: 12px;
  padding: 5px;
  display: inline-flex;
  gap: 0;
  border: 1px solid rgba(255,255,255,0.15);
}

/* Sliding pill indicator – injected by JS */
#pill-slider {
  position: absolute;
  top: 5px;
  left: 5px;
  height: calc(100% - 10px);
  background: #fff;
  border-radius: 6px;
  z-index: 0;
  transition: transform 0.35s cubic-bezier(0.4,0,0.2,1),
              width   0.35s cubic-bezier(0.4,0,0.2,1);
  pointer-events: none;
}

.pill-nav .nav-item { z-index: 1; }

.pill-nav .nav-link {
  font-family: "Manrope", sans-serif;
  font-weight: 700;
  font-size: 0.92rem;
  letter-spacing: 0.3px;
  text-transform: uppercase;
  color: #fff;
  background: transparent !important;
  border: none !important;
  border-radius: 6px;
  padding: 8px 20px;
  transition: color 0.25s ease;
  position: relative;
  z-index: 1;
  white-space: nowrap;
  text-align: center;
  line-height: 1.3;
}

.pill-nav .nav-link.active             { color: #000 !important; }
.pill-nav .nav-link:not(.active):hover { color: rgba(255,255,255,0.95) !important; }

/* Desktop: keep label on one line */
.pill-nav .nav-link .pill-num  { display: inline; }
.pill-nav .nav-link .pill-unit { display: inline; }
.pill-nav .nav-link .pill-num::after { content: '\00a0'; }

/* Mobile: two-line label, centered, wider pill */
@media (max-width: 575px) {
  .pill-nav .nav-link {
    padding: 7px 0;
    font-size: 0.7rem;
    white-space: normal;
    width: 68px;
    text-align: center;
  }
  .pill-nav .nav-link .pill-num {
    display: block;
    text-align: center;
    font-size: 1.05rem;
    font-weight: 800;
    line-height: 1.15;
  }
  .pill-nav .nav-link .pill-num::after { content: ''; }
  .pill-nav .nav-link .pill-unit {
    display: block;
    text-align: center;
    font-size: 0.64rem;
    font-weight: 600;
    letter-spacing: 0.4px;
  }
}

/* ── PRICING CARDS ── */

.pricing-cards-row {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  gap: 30px;
  align-items: center;
}

.pricing-card {
  background: rgba(255,255,255,0.10);
  border: 2px solid #fff;
  border-radius: 10px;
  padding: 36px 30px 34px;
  /* width: 320px; */
  width: 360px;
  transition: transform 0.28s cubic-bezier(0.34,1.56,0.64,1), box-shadow 0.28s ease;
  cursor: pointer;
  margin-bottom: 10px;
}

.pricing-card:hover {
  transform: scale(1.05);
  box-shadow: 0 20px 60px rgba(0,0,0,0.25);
}

.pricing-card.featured {
  background: #fff;
  border-color: #fff;
  color: #1a2a3a;
  z-index: 2;
  /* scale: 1.1; */
  scale: 1.06;
  /* width: 340px; */
  width: 380px;
  padding: 36px 30px 34px;
}

.pricing-card.featured:hover {
  transform: scale(1.06);
  box-shadow: 0 24px 70px rgba(0,0,0,0.30);
}

@media (max-width: 768px) {
  .pricing-cards-row { flex-wrap: wrap; flex-direction: column; align-items: center; gap:10px; }
  .pricing-card,
  .pricing-card.featured { width: 100%; max-width: 360px; scale: 1; }
}

.plan-name {
  font-size: 32px;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 2px;
}
.featured .plan-name { color: #1a2a3a; }

.plan-desc {
  font-size: 18px;
  text-transform: lowercase;
  margin-bottom: 22px;
}

.plan-price {
  color: #00e5ff;
  line-height: 1;
  font-size: 48px;
}

.plan-price .per-drink {
  font-size: 1.3rem;
  color: #fff;
  position: relative;
  bottom: 8px;
}

.featured .plan-price { color: rgb(57, 95, 164); }
.featured .plan-price .per-drink { color: #000; }

.plan-volume {
  font-weight: 800;
  font-size: 0.95rem;
  margin-top: 16px;
  margin-bottom: 2px;
  color: #fff;
}
.featured .plan-volume { color: #1a2a3a; }

.plan-per-emp {
  margin-bottom: 22px;
  font-size: 18px;
}
.featured .plan-per-emp {
  color: #000;
  margin-bottom: 22px;
}

.plan-features,
.plan-features ul{
  list-style: none;
  padding: 0;
  margin: 0 0 28px;
}

.plan-features li {
  font-size: 14px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 4px 0;
}

.plan-features li::before {
  content: "\f058"; /* FontAwesome circle-check */
  font-family: "Font Awesome 6 Free";
  font-weight: 400; /* regular */
  font-size: 16px;
  color: #fff;
  flex-shrink: 0;
  top: 2px;
  position: relative;
}

.featured .plan-features li::before {
  color: #000;
}

.plan-features li i {
  font-size: 16px;
  color: #fff;
  flex-shrink: 0;
}
.featured .plan-features li i { color: #000; }

.btn-plan {
  width: 100%;
  border-radius: 50px;
  font-size: 0.90rem;
  text-transform: uppercase;
  padding: 14px 20px;
  transition: all 0.2s ease;
  cursor: pointer;
}
.btn-plan-outline {
  border: 2px solid rgba(255,255,255,0.55);
  color: #000;
  background: #fff;
}
.btn-plan-outline:hover {
  border-color: #fff;
  color: #000;
  background: rgba(255,255,255,0.95);
}
.btn-plan-dark {
  background: #1a2a3a;
  color: #fff;
  border: none;
}
.btn-plan-dark:hover {
  background: #0f1e2d;
  color: #fff;
  transform: translateY(-1px);
}

@media (min-width: 769px) and (max-width: 991px) {
  .pricing-card { width: 30%; min-width: 0; padding: 36px 15px 34px; }
  .pricing-card.featured { width: 30%; min-width: 0; padding: 36px 15px 34px; }
  .plan-name { font-size: 28px; }
  .plan-price, .featured .plan-price { font-size: 32px; }
  .plan-price .per-drink { font-size: 1rem; position: relative; bottom: 5px; }
  .plan-per-emp { font-size: 16px; }
}
/* END : AQUABLU PRICING MODULE */
