/* ============================================
   RESPONSIVE SIZING CONFIGURATION
   ============================================ */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: "museo-sans-rounded", sans-serif;
  background: linear-gradient(200deg, #003848 0%, #001927 80%);
  min-height: 100vh;
  color: #FFFFFF;
}

.container {
  max-width: 65.2883569097vw;
  margin: 0 auto;
  padding: 4.0805223069vw 0px;
  position: relative;
}

.tagline {
  font-size: 2.2850924918vw;
  font-weight: 900;
  font-style: italic;
  line-height: 1.3057671382vw;
  color: #E2BE59;
  margin-bottom: 1.9586507073vw;
}

.headline {
  font-size: 4.8966267682vw;
  font-weight: 1000;
  font-style: italic;
  color: #FFFFFF;
  line-height: 4.4613710555vw;
  margin-bottom: 1.7410228509vw;
}

.speech-bubbles {
  position: relative;
  width: 100vw;
  left: 50%;
  transform: translateX(-50%);
  min-height: 23.3949945593vw;
  margin-bottom: 0.5440696409vw;
}

.bubble {
  position: absolute;
  font-size: 2.6343852013vw;
  font-weight: 800;
  font-style: italic;
  color: #000000;
  line-height: 2.1762785637vw;
}

.bubble-yellow {
  background-color: #E2BE59;
  top: 0;
  border-radius: 0 3.9173014146vw 3.9173014146vw 0;
  padding: 1.7410228509vw 3.0467899891vw 1.7410228509vw 18.7704026115vw;
}

.bubble-pink {
  background-color: #EF5EA2;
  top: 1.4145810664vw;
  right: 0px;
  left: auto;
  border-radius: 5.2230685528vw 0 0 5.2230685528vw;
  padding: 2.5571273123vw 40.5875952122vw 2.8291621328vw 2.3394994559vw;
}

.bubble-green {
  background-color: #73C050;
  top: 11.2622415669vw;
  left: 10.8813928183vw;
  border-radius: 5.5495103373vw;
  padding: 2.39390642vw 3.4820457018vw 1.5233949946vw 17.7910772579vw;
}

.content {
  margin-bottom: 1.19695321vw;
  color: #FFFFFF;
}

.familiar-heading {
  font-size: 1.5233949946vw;
  font-weight: 700;
  line-height: 2.0674646355vw;
  color: #FFFFFF;
  margin-bottom: 2.1762785637vw;
}

.content h3 {
  font-size: 1.5233949946vw;
  font-weight: 700;
  line-height: 2.0674646355vw;
  margin-bottom: 1.3601741023vw;
}

.content p {
  font-size: 1.3057671382vw;
  line-height: 1.6322089227vw;
  margin-bottom: 1.3601741023vw;
}

.lets-talk-btn {
  display: inline-flex;
  align-items: center;
  gap: 1.0881392818vw;
  background: transparent;
  border: none;
  color: #73C050;
  font-family: "museo-sans-rounded", sans-serif;
  font-size: 1.6322089227vw;
  cursor: pointer;
  padding: 0.5440696409vw 0;
  transition: color 0.3s ease;
}
.lets-talk-btn .arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s ease;
  margin-left: -8.7051142546vw;
}
.lets-talk-btn:hover {
  opacity: 0.9;
}
.lets-talk-btn:hover .arrow {
  transform: translateX(8px);
}

.mobile-text {
  display: none;
}

.animate-slide-top {
  opacity: 0;
  transform: translateY(-50px);
}

.animate-slide-left {
  opacity: 0;
  transform: translateX(-100px);
}

.animate-slide-right {
  opacity: 0;
  transform: translateX(100px);
}

.animate-slide-bottom {
  opacity: 0;
  transform: translateY(50px);
}

/* Animated states with bounce */
.animate-slide-top.animate {
  animation: slideInTop 1.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards;
}

.animate-slide-left.animate {
  animation: slideInLeftBounce 1.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards;
}

.animate-slide-right.animate {
  animation: slideInRightBounce 1.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards;
}

.animate-slide-bottom.animate {
  animation: slideInBottom 1.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards;
}

@keyframes slideInTop {
  0% {
    opacity: 0;
    transform: translateY(-50px);
  }
  60% {
    opacity: 1;
    transform: translateY(10px);
  }
  80% {
    transform: translateY(-5px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes slideInLeftBounce {
  0% {
    opacity: 0;
    transform: translateX(-100px);
  }
  60% {
    opacity: 1;
    transform: translateX(20px);
  }
  80% {
    transform: translateX(-10px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes slideInRightBounce {
  0% {
    opacity: 0;
    transform: translateX(100px);
  }
  60% {
    opacity: 1;
    transform: translateX(-20px);
  }
  80% {
    transform: translateX(10px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes slideInBottom {
  0% {
    opacity: 0;
    transform: translateY(50px);
  }
  60% {
    opacity: 1;
    transform: translateY(-10px);
  }
  80% {
    transform: translateY(5px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}
.modal-overlay.active {
  opacity: 1;
  visibility: visible;
}

.modal {
  background: #FFFFFF;
  border-radius: 1.2513601741vw;
  max-width: 31.556039173vw;
  width: 90%;
  max-height: 90vh;
  overflow-y: auto;
  position: relative;
}

.modal-close {
  position: absolute;
  top: 0.8161044614vw;
  right: 1.0881392818vw;
  background: none;
  border: none;
  font-size: 1.7410228509vw;
  color: #fff;
  cursor: pointer;
  z-index: 10;
}

.modal-header {
  background: linear-gradient(200deg, #003848 0%, #001927 100%);
  text-transform: uppercase;
  color: #fff;
  padding: 1.6322089227vw 3.5364526659vw;
  font-size: 0.9793253536vw;
}

.modal-body {
  padding: 2.8291621328vw 3.5364526659vw;
}

.form-group {
  margin-bottom: 1.6322089227vw;
}
.form-group label {
  display: block;
  color: #003848;
  font-size: 0.9793253536vw;
}
.form-group input {
  width: 100%;
  padding: 0.5440696409vw 0;
  border: none;
  border-bottom: 0.1088139282vw solid #ccc;
  font-family: "museo-sans-rounded", sans-serif;
  font-size: 1rem;
  color: #000000;
  transition: border-bottom-color 0.3s ease;
}
.form-group input:focus {
  outline: none;
  border-bottom-color: #003848;
}

.submit-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5440696409vw;
  background: #FFFFFF;
  border: 0.1088139282vw solid #003848;
  color: #003848;
  font-family: "museo-sans-rounded", sans-serif;
  font-size: 0.9793253536vw;
  padding: 0 1.0881392818vw;
  cursor: pointer;
  transition: all 0.3s ease;
  margin-top: 0.5440696409vw;
  border-radius: 0.4352557127vw;
}
.submit-btn .arrow {
  display: flex;
  align-items: center;
  transition: transform 0.3s ease;
  margin-left: -8.1610446137vw;
}
.submit-btn:hover {
  background: #003848;
  color: #FFFFFF;
}
.submit-btn:hover .arrow {
  transform: translateX(5px);
}

.disclaimer {
  margin-top: 1.2513601741vw;
  font-size: 0.4896626768vw;
  color: #A7A9AC;
  line-height: 0.598476605vw;
}

.thankyou-page {
  display: flex;
  justify-content: center;
  min-height: 100vh;
}

.thankyou-container {
  display: flex;
  justify-content: center;
  flex-direction: column;
  text-align: center;
  padding-top: 8.1610446137vw;
}
.thankyou-container .tagline {
  margin-bottom: 2.4483133841vw;
}

.thankyou-box {
  border: 0.1088139282vw solid #d4a84b;
  border-radius: 2.1762785637vw;
  padding: 8.1610446137vw 5.9847660501vw 5.4406964091vw 2.7203482046vw;
  max-width: 39.9891186072vw;
  min-height: 32.6441784548vw;
  text-align: left;
  color: #FFFFFF;
}
.thankyou-box .bold-text {
  font-size: 1.5233949946vw;
  line-height: 2.0674646355vw;
  font-weight: 700;
  margin-bottom: 1.3601741023vw;
}
.thankyou-box p {
  font-size: 1.3057671382vw;
  line-height: 1.6322089227vw;
  font-weight: 500;
  margin-bottom: 1.3601741023vw;
}

/* ============================================
   MOBILE RESPONSIVE STYLES
   ============================================ */
@media (max-width: 1175px) {
  .container {
    max-width: 84.8896434635vw;
    padding: 10.1867572156vw 1.6977928693vw;
    position: static;
  }
  .tagline {
    font-size: 3.5653650255vw;
    line-height: 2.0373514431vw;
    margin-bottom: 3.3955857385vw;
  }
  .headline {
    font-size: 7.6400679117vw;
    line-height: 6.960950764vw;
    margin-bottom: 3.8200339559vw;
  }
  .speech-bubbles {
    position: relative;
    width: 100vw;
    left: 50%;
    transform: translateX(-50%);
    min-height: 88.2003395586vw;
    margin-bottom: 11.0356536503vw;
  }
  .bubble {
    font-size: 7.5551782683vw;
    line-height: 7.5551782683vw;
  }
  .bubble-yellow {
    border-radius: 0 11.3752122241vw 11.3752122241vw 0;
    padding: 3.2644178455vw 8.3191850594vw 5.0933786078vw 16.9779286927vw;
  }
  .bubble-pink {
    top: 25.466893039vw;
    border-radius: 15.025466893vw 0 0 15.025466893vw;
    padding: 7.8947368421vw 9.8471986418vw 9.7623089983vw 7.4702886248vw;
  }
  .bubble-green {
    top: 59.4227504244vw;
    left: 0;
    border-radius: 0 15.9592529711vw 15.9592529711vw 0;
    padding: 7.0458404075vw 10.0169779287vw 4.584040747vw 8.5738539898vw;
  }
  .content {
    margin-bottom: 1.8675721562vw;
  }
  .content h3 {
    font-size: 4.0747028862vw;
    line-height: 5.0933786078vw;
    margin-bottom: 5.7724957555vw;
  }
  .content p {
    font-size: 3.5653650255vw;
    line-height: 5.0933786078vw;
    margin-bottom: 3.3955857385vw;
  }
  .lets-talk-btn {
    gap: 4.2444821732vw;
    font-size: 4.4991511036vw;
    padding: 3.3955857385vw 0;
  }
  .lets-talk-btn .arrow {
    margin-left: -33.9558573854vw;
  }
  .mobile-text {
    display: block;
  }
  .desktop-text {
    display: none;
  }
  .modal {
    border-radius: 1.9524617997vw;
    max-width: 83.1918505942vw;
  }
  .modal-close {
    top: 2.9711375212vw;
    right: 5.0933786078vw;
    font-size: 5.0933786078vw;
  }
  .modal-header {
    padding: 4.4142614601vw 9.5925297114vw;
    font-size: 2.5466893039vw;
  }
  .modal-body {
    padding: 7.0458404075vw 9.5925297114vw;
  }
  .form-group {
    margin-bottom: 5.0933786078vw;
  }
  .form-group label {
    font-size: 3.0560271647vw;
  }
  .form-group input {
    width: 100%;
    padding: 2.5466893039vw 0;
    border: none;
    border-bottom: 0.1697792869vw solid #ccc;
    font-size: 1rem;
  }
  .submit-btn {
    gap: 1.6977928693vw;
    border: 0.1697792869vw solid #003848;
    font-size: 3.0560271647vw;
    padding: 0 3.3955857385vw;
    border-radius: 0.6791171477vw;
  }
  .submit-btn .arrow {
    margin-left: -29.7113752122vw;
  }
  .disclaimer {
    margin-top: 3.2258064516vw;
    font-size: 1.273344652vw;
    line-height: 1.5280135823vw;
  }
  .thankyou-container {
    padding-top: 15.025466893vw;
    margin-bottom: 16.9779286927vw;
  }
  .thankyou-container .tagline {
    margin-bottom: 5.0933786078vw;
  }
  .thankyou-box {
    border: 0.1697792869vw solid #d4a84b;
    border-radius: 3.480475382vw;
    padding: 21.4770797963vw 6.8760611205vw 21.4770797963vw 6.3667232598vw;
    max-width: 83.9558573854vw;
    min-height: none;
  }
  .thankyou-box .bold-text {
    font-size: 4.0747028862vw;
    line-height: 4.3293718166vw;
    margin-bottom: 3.3955857385vw;
  }
  .thankyou-box p {
    font-size: 3.3106960951vw;
    line-height: 5.0933786078vw;
    margin-bottom: 3.3955857385vw;
  }
}/*# sourceMappingURL=styles.css.map */