/*
    Author: Leandro Zambelli
*/ 

:root {

  --brand-color-primary-default: #2F2FC9;
  --brand-color-primary-dark: #2424A1;

  --text-color-default: #03032a;

  --font-family: 'Plus Jakarta Sans', sans-serif;

  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-bold: 700;

  --line-height-100: 100%;
  --line-height-120: 120%;
  --line-height-150: 150%;
  
  --title-size-xl: 90px; 
  --title-size-lg: 46px;
  --title-size-md: 38px;
  --title-size-sm: 24px;

  --text-size-xl: 24px;
  --text-size-lg: 20px;
  --text-size-md: 18px;
  --text-size-sm: 16px;
  --text-size-xs: 14px;

  --radius-lg: 40px;
  --radius-md: 32px;
  --radius-sm: 16px;

  --spacing-lg: 128px;
  --spacing-md: 80px;
  --spacing-sm: 40px;
  --spacing-xs: 24px;

}


body { background: linear-gradient(#E2E2FF 0%, #fff 500px); font-family: var(--font-family); color: var(--text-color-default); }


/* =Bootstrap Reset 
*/

@media (max-width: 576px) {
 .container { padding-left: 32px; padding-right: 32px;}
}

@media (min-width: 1400px) {
  .container { max-width: 1260px; }
}

.form-control { background: none; }

.form-floating > .form-control:not(:-moz-placeholder-shown) ~ label {
  color: white
}
.form-floating > .form-control:focus ~ label,
.form-floating > .form-control:not(:placeholder-shown) ~ label,
.form-floating > .form-control-plaintext ~ label,
.form-floating > .form-select ~ label {
  color: white
}
.form-floating > .form-control:not(:-moz-placeholder-shown) ~ label::after {
  background-color: var(--brand-color-primary-default);
}
.form-floating > .form-control:focus ~ label::after,
.form-floating > .form-control:not(:placeholder-shown) ~ label::after,
.form-floating > .form-control-plaintext ~ label::after,
.form-floating > .form-select ~ label::after {
  background-color: var(--brand-color-primary-default);
}

.modal-content { overflow: hidden; }


/* Helper - Utilities
*/

.cursor-pointer { cursor: pointer; }

.spacing-lg { padding-top: var(--spacing-lg); }
.spacing-md { padding-top: var(--spacing-md); }
.spacing-sm { padding-top: var(--spacing-sm); }
.spacing-xs { padding-top: var(--spacing-xs); }

.spacing-y-lg { padding-top: var(--spacing-lg); padding-bottom: var(--spacing-lg); }
.spacing-y-md { padding-top: var(--spacing-md); padding-bottom: var(--spacing-md); }
.spacing-y-sm { padding-top: var(--spacing-sm); padding-bottom: var(--spacing-sm); }
.spacing-y-xs { padding-top: var(--spacing-xs); padding-bottom: var(--spacing-xs); }

@media (max-width: 768px) {
    .spacing-lg { padding-top: var(--spacing-md); }
    .spacing-sm, .spacing-md { padding-top: var(--spacing-sm); }
}

.radius-lg { border-radius: var(--radius-lg); }
.radius-md { border-radius: var(--radius-md); }
.radius-sm { border-radius: var(--radius-sm); }

.title-size-xl, .title-size-lg, .title-size-md, .title-size-sm, .title-size-xs { font-weight: var(--font-weight-bold); line-height: 120%; }
.title-size-xl { font-size: var(--title-size-xl); font-size: clamp(52px, 10vw, 90px); line-height: var(--line-height-100); }
.title-size-lg { font-size: var(--title-size-lg); }
.title-size-md { font-size: var(--title-size-md); }
.title-size-sm { font-size: var(--title-size-sm); }
  @media ( max-width: 767px) { .title-size-md { font-size: 36px; } }

.text-size-xl { font-size: var(--text-size-xl); }
.text-size-lg { font-size: var(--text-size-lg); }
.text-size-md { font-size: var(--text-size-md); }
.text-size-sm { font-size: var(--text-size-sm); }
.text-size-xs { font-size: var(--text-size-xs); }

.line-height-100 { line-height: var(--line-height-100); }
.line-height-120 { line-height: var(--line-height-120); }
.line-height-150 { line-height: var(--line-height-150); }

.letter-spacing { letter-spacing: -1px; }

.text-color-primary-default { color: var(--brand-color-primary-default); }
.text-color-secondary-default { color: var(--brand-color-secondary-default); }

.text-color-default { color: var(--text-color-default); }

.bg-color-primary-default { background: var(--brand-color-primary-default); }
.bg-color-primary-dark { background: var(--brand-color-primary-dark); }
.bg-circles { position: absolute; width: 400px; top: 0; right: 0; z-index: -1; }
  @media (max-width: 1190px) { .bg-circles { width: 360px } }
  @media (max-width: 992px) { .bg-circles { display: none; } }

.font-weight-regular { font-weight: var(--font-weight-regular); }
.font-weight-medium { font-weight: var(--font-weight-medium); }
.font-weight-bold { font-weight: var(--font-weight-bold); }

.button { display: inline-block; padding: 10px 24px; border: 2px solid transparent; border-radius: var(--radius-md); font-weight: var(--font-weight-bold); text-decoration: none; position: relative; overflow: hidden; transform: perspective(1px); }

.button-primary { background: var(--brand-color-primary-default); color: #fff;  }
.button-primary:hover { background: var(--brand-color-primary-default); color: white; border-color: var(--brand-color-primary-dark); }

.button-primary::before {
  content: "";
  position: absolute;
  background: var(--brand-color-primary-dark);
  top:0;
  left:0;
  bottom: 0;
  right: 0;
  z-index: -1;
  border-radius: 100px;
  transform: translateX(-100%);
  transition: transform 0.3s ease;
}

.button-primary:hover::before { transform: translateX(0); }

.button-outline { background: white; color: var(--brand-color-primary-default); border-color: var(--brand-color-primary-default); }
.button-outline:hover { color: var(--brand-color-primary-default); }

.button-outline::before {
  content: "";
  position: absolute;
  background: #E2E2FF;
  top:0;
  left:0;
  bottom: 0;
  right: 0;
  z-index: -1;
  border-radius: 100px;
  transform: translateX(-100%);
  transition: transform 0.3s ease;
}

.button-outline:hover::before { transform: translateX(0); }

.chip { border: 1px solid var(--brand-color-primary-default); padding: 8px 16px; font-weight: var(--font-weight-bold); }

.centralized-text { transform: translate(0, 60%);}
  @media (max-width: 1199px) { .centralized-text { transform: translate(0, 40%);} }
  @media (max-width: 991px) { .centralized-text { transform: translate(0, 88px);} }


/* =Typography Selectors
*/

h1, h2, h3, h4, h5, h6 { font-family: var(--font-family) ; font-weight: var(--font-weight-bold); margin: 0; }

p { font-weight: var(--font-weight-medium); font-size: var(--text-size-md); line-height: var(--line-height-paragraph); margin-bottom: var(--spacing-xs) }

b, strong { font-weight: var(--font-weight-semibold); }
a { color: var(--brand-color-primary-default); font-weight: var(--font-weight-bold); }
a:hover { color: var(--brandcolor-primary-default); text-decoration: none; }

ul { padding-left: 16px; }


/* =Header, Nav and Search Box
*/

header { padding: 16px 0;  }

nav { display: inline-block; }
nav a { padding-right: 16px; font-weight: var(--font-weight-regular); text-decoration: none; color: var(--text-color-default); transition: all 0.3s ease; }
nav a:hover { text-decoration: none; color: var(--brand-color-primary-default); }


/* =Backgrounds for desktop and mobile
*/

.bg-coaching { background: url(../img/background/bg-coaching.jpg) center no-repeat; width: 100%; height: 538px; }

@media (max-width: 991px) {
    .bg-coaching { background: none; }
}
@media (max-width: 991px) {
  .bg-coaching-mobile { background: url(../img/background/bg-coaching-mobile.jpg) no-repeat; width: 100%; height: 857px; background-position: -30px 0; }
}

.bg-bluebar { position: absolute; top:-400px; height: 400px; width: 100%; z-index: -1; background: var(--brand-color-primary-default); }
.bg-gradient-section { background: linear-gradient(#E2E2FF 0%, #fff 100%); }

@media (max-width:991px) {
  .bg-blue-section-mobile { background: var(--brand-color-primary-default); }
  .bg-gradient-section-mobile { background: linear-gradient(#E2E2FF 0%, #fff 100%); }
  }

@media (min-width: 991px) {
  .bg-sur { background: url(../img/profile/deepy-sur-lg.jpg) top center no-repeat;  background-size: cover; }
  .bg-gagan { background: url(../img/profile/gagan-singh-lg.jpg) top center no-repeat;  background-size: cover; }
  .bg-amrita { background: url(../img/profile/amrita-singh-lg.jpg) top center no-repeat;  background-size: cover; }
  .bg-counselling { background: url(../img/services/counselling.jpg) top center no-repeat;  background-size: cover; }
  .bg-consulting { background: url(../img/services/consulting.jpg) top center no-repeat;  background-size: cover; }
}



/* =Footer
*/

footer { position: relative; z-index: 3; padding: var(--spacing-lg) 0; background: var(--brand-color-primary-default); color: #fff; }

footer .form-floating input, footer .form-floating textarea  { color: white; border-radius: 16px; }
footer .form-floating input:focus, footer .form-floating textarea:focus { background: var(--brand-color-primary-default); color: white; }

.footer-bottom { padding: 16px 0; background: var(--brand-color-primary-dark);}
.footer-bottom a { color: white; text-decoration: none; padding-left: 16px; }
.footer-bottom a:hover { opacity: 0.6 }