/* -------------------- VARIABLES -------------------- */
:root {
    /* colors */
    --primary: #1152d4;
    --primary-20: #1152d420;
    --primary-40: #1152d440;
    --primary-80: #1152d480;
    --primary-light: #cdebff;
    --primary-light-2: #d0dbf6;
    --primary-light-3: #edf1fb;
    --primary-dark: #0371bf;
    --primary-darkest: #344256;
    --grey: #606060;
    --grey-2: #f6f7f8;
    --grey-3: #7b899d;
    --green: #3ad32e;
    --green-2: #17a34a;
    --green-33: #3ad22d33;
    --green-cc: #16a34acc;
    --green-fluorescent: #3ad22de6;
    --grey-light: #f2f2f2;
    --grey-light-2: #d9e0e8;
    --text-color: #151515;
    --black: #000000;
    --white: #ffffff;
    --white-30: #ffffff30;
    --white-80: #ffffff80;
    /* font family */
    --font-primary: "Roboto", sans-serif;
    /* misc */
    --shadow: 0px 0px 4px 0 rgba(0, 0, 0, 0.25);
}
/* -------------------- VARIABLES ENDS -------------------- */

/* -------------------- BASE -------------------- */
/* css reset */
*,
*::after,
*::before {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: var(--font-primary);
    color: var(--primary-darkest);
}
/* css reset */

html {
    /* This defines what 1rem is */
    font-size: 62.5%; /* //1rem = 10px; 10px/16 = 62.5%; */
    scroll-behavior: smooth;
}

/* body:has(.ahCustomPage) {
    box-sizing: border-box;
    font-family: var(--font-primary);
    font-size: 1.6rem;
    font-weight: 400;
} */

/* -------------------- BASE ENDS -------------------- */

/* -------------------- COLORS -------------------- */
/* colors are present here */
::selection {
    background-color: var(--primary);
    color: var(--white);
}

/* == background colors == */
.ah-bg-primary {
    background-color: var(--primary);
}
.ah-bg-white {
    background-color: var(--white);
}
.ah-bg-black {
    background-color: var(--black);
}
.ah-bg-primary-3 {
    background-color: var(--primary-light-3);
}
.ahBgGrey2 {
    background-color: var(--grey-2);
}
/* == text colors == */
.ah-color-primary {
    color: var(--primary);
}
.ah-color-primary-darkest,
.ah-color-text {
    color: var(--primary-darkest);
}
.ah-color-secondary {
    color: var(--secondary);
}
.ah-color-grey {
    color: var(--grey);
}
.ah-color-grey-3 {
    color: var(--grey-3);
}
.ah-color-white {
    color: var(--white);
}
.ah-color-white-80 {
    color: var(--white-80);
}
.ah-color-black {
    color: var(--black);
}
/* -------------------- COLORS ENDS -------------------- */
.ahCursorPointer {
    cursor: pointer;
}

/* -------------------- WIDTH AND HEIGHTS -------------------- */
.ahw-20 {
    width: 20px;
}
.ahh-20 {
    height: 20px;
}
.ahMinH50vh {
    min-height: 50vh;
}
/* -------------------- WIDTH AND HEIGHTS END -------------------- */

/* -------------------- TYPOGRAPHY -------------------- */
.ahCustomPage h1,
.ahCustomPage h2,
.ahCustomPage h3,
.ahCustomPage h4,
.ahCustomPage h5,
.ahCustomPage h6,
.ahCustomPage .h1,
.ahCustomPage .h2,
.ahCustomPage .h3,
.ahHeading1,
.ahHeading2,
.ahHeading3 {
    line-height: 1.3 !important;
}

.ahCustomPage .h4,
.ahCustomPage .h5,
.ahCustomPage .h6,
.ahHeading4,
.ahHeading5,
.ahHeading6,
.ahCustomPage p,
.ahPara,
.ahSmall {
    line-height: 1.5 !important;
}
.ahCustomPage .h1--xl,
.ahHeading1--xl {
    font-size: 7.2rem;
    line-height: 1.2 !important;
}
.ahCustomPage .h1--lg,
.ahHeading1--lg {
    font-size: 6.4rem;
    line-height: 1.2 !important;
}
.ahCustomPage h1,
.ahCustomPage .h1,
.ahHeading1 {
    font-size: 4.8rem;
}
.ahCustomPage h2,
.ahCustomPage .h2,
.ahHeading2 {
    font-size: 4rem;
}
.ahCustomPage h3,
.ahCustomPage .h3,
.ahHeading3 {
    font-size: 3.2rem;
}
.ahCustomPage h4,
.ahCustomPage .h4,
.ahHeading4 {
    font-size: 2.4rem;
}
.ahCustomPage h5,
.ahCustomPage .h5,
.ahHeading5 {
    font-size: 2rem;
}
.ahCustomPage h6,
.ahCustomPage .h6,
.ahHeading6 {
    font-size: 1.8rem;
}
.ahCustomPage p,
.ahCustomPage .para,
.ahCustomPage input,
.ahPara {
    font-size: 1.6rem;
}
.ahCustomPage .small,
.ahSmall {
    font-size: 1.4rem;
}

@media screen and (max-width: 1200px) {
    .ahCustomPage .h1--lg,
    .ahHeading1--lg {
        font-size: 5rem;
        line-height: 1.3 !important;
    }
}
@media screen and (max-width: 991px) {
    .ahCustomPage h1,
    .ahCustomPage .h1,
    .ahHeading1 {
        font-size: 3.2rem;
    }
    .ahCustomPage h2,
    .ahCustomPage .h2,
    .ahHeading2 {
        font-size: 2.8rem;
    }
    .ahCustomPage h3,
    .ahCustomPage .h3,
    .ahHeading3 {
        font-size: 2.4rem;
    }
    .ahCustomPage h4,
    .ahCustomPage .h4,
    .ahHeading4 {
        font-size: 2rem;
    }
}
@media screen and (max-width: 370px) {
    .ahCustomPage .h1--lg,
    .ahHeading1--lg {
        font-size: 3rem;
    }
}

.ahCustomPage a,
.ahNoUnderline {
    text-decoration: none !important;
}
.ahText-center {
    text-align: center;
}
.ahText-left {
    text-align: left;
}
/* font family */
.ahFont-primary,
.ahCustomPage input {
    font-family: var(--font-primary);
}

/* font weights */
.ahFont-light {
    font-weight: 300 !important;
}
.ahFont-regular {
    font-weight: 400;
}
.ahFont-medium {
    font-weight: 500;
}
.ahFont-semibold {
    font-weight: 600;
}
.ahFont-bold {
    font-weight: 700;
}
.ahForceFont-regular {
    font-weight: 400 !important;
}
.ahForceFont-medium {
    font-weight: 500 !important;
}
/* -------------------- TYPOGRAPHY ENDS -------------------- */

/* GRADIENTS   */

.ahGradientText {
    background: -webkit-linear-gradient(var(--primary), var(--primary-80));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    direction: ltr;
}
.agBgGradient {
    background-image: linear-gradient(135deg, #1240b814, #6691ed0d);
}
/* button styles */
.ahBtns {
    display: flex;
    align-items: center;
    gap: 16px;
    justify-content: center;
}
@media screen and (max-width: 767px) {
    .ahBtns {
        flex-flow: column;
    }
}
.ahBtn {
    padding: 9px 24px;
    font-size: 1.4rem;
    line-height: normal;
    font-weight: 600;
    background-color: var(--primary);
    color: var(--white) !important;
    border: 1px solid var(--primary);
    border-radius: 4px;
    cursor: pointer;
    transition: all 300ms ease;
    display: inline-block;
}
input.wpcf7-form-control.wpcf7-submit.has-spinner.ahBtn.ahFlex.w-full.ahJustifyCenter.ahItemsCenter.ahGap8.ahMt16 {
    padding: 9px 24px !important;
    font-size: 1.4rem !important;
    line-height: normal !important;
    font-weight: 600 !important;
    background-color: var(--primary) !important;
    color: var(--white) !important;
    border: 1px solid var(--primary) !important;
    border-radius: 4px !important;
    transition: all 300ms ease;
    margin-top: 12px;
}
.ahBtn--green {
    background-color: var(--green-fluorescent);
    border: 1px solid var(--green-fluorescent);
}
.ahBtn--green-2 {
    background-color: var(--green-2);
    border: 1px solid var(--green-2);
}
.ahBtn--green-outline {
    border: 1px solid var(--green-fluorescent);
    color: var(--green-fluorescent) !important;
    background-color: transparent;
}
.ahBtn--sm {
    padding: 8px;
}
.ahBtn--md {
    padding: 12px 24px;
    font-size: 16px;
}
.ahBtn--lg {
    padding: 16px 32px;
    font-size: 18px;
}
.ahBtn:hover,
.ahBtn:focus {
    /* background-color: var(--white);
    color: var(--primary);
    border-color: var(--primary); */
    transform: scale(1.05);
}
.ahBtn-transparent {
    cursor: pointer;
    background-color: transparent;
    background-image: none;
    border: none;
}
.ahBtn-transparent:hover,
.ahBtn-transparent:focus {
    color: var(--primary);
}

.ahBtn-WhiteOpacity {
    cursor: pointer;
    background-color: transparent;
    background-image: none;
    border: none;
}
.ahBtn-WhiteOpacity:hover,
.ahBtn-WhiteOpacity:focus {
    background-color: var(--white-30);
}
/* button styles */

/* link styles */
.ahLink {
    background-color: transparent;
    border: none;
    color: var(--primary-dark);
    font-size: inherit;
    font-weight: 600;
    cursor: pointer;
}
.ahLink:hover,
.ahLink:focus {
    text-decoration: underline;
    color: var(--primary);
}
/* link styles */

/* -------------------- Utilities -------------------- */

/* margins */
.ahMt10 {
    margin-block-start: 10px;
}
.ahMt16 {
    margin-block-start: 16px;
}
.ahMt24 {
    margin-block-start: 24px;
}
.ahMt32 {
    margin-block-start: 32px;
}
.ahMt40 {
    margin-block-start: 40px;
}
.ahMt48 {
    margin-block-start: 48px;
}
.ahMt60 {
    margin-block-start: 60px;
}
.ahMt64 {
    margin-block-start: 64px;
}
.ahMb48 {
    margin-block-end: 48px;
}
.ahMb40 {
    margin-block-end: 40px;
}
.ahMb32 {
    margin-block-end: 32px;
}
.ahMb24 {
    margin-block-end: 24px;
}
.ahMb20 {
    margin-block-end: 20px;
}
.ahMb16 {
    margin-block-end: 16px;
}
.ahMb15 {
    margin-block-end: 15px;
}
.ahMb12 {
    margin-block-end: 12px;
}
.ahMb8 {
    margin-block-end: 8px;
}
.ahMb0 {
    margin-block-end: 0px;
}
/* left margins */
.ahMs16 {
    margin-inline-start: 16px;
}

.ahMx-auto {
    margin-inline-start: auto;
    margin-inline-end: auto;
}

@media screen and (max-width: 991px) {
    .ahMt100-991 {
        margin-block-start: 100px;
    }
}
/* margins */
/* paddings */
.ahSection-padding {
    padding: 60px 20px;
}
.ahSection-padding-x {
    padding-inline-start: 15px;
    padding-inline-end: 15px;
}
.ahPy48 {
    padding-block-start: 48px;
    padding-block-end: 48px;
}
.ahPy32 {
    padding-block-start: 32px;
    padding-block-end: 32px;
}
.ahPy16 {
    padding-block-start: 16px;
    padding-block-end: 16px;
}
.ahPy20 {
    padding-block-start: 20px;
    padding-block-end: 20px;
}
.ahPt80 {
    padding-block-start: 80px;
}
.ahPx16 {
    padding-inline-start: 16px;
    padding-inline-end: 16px;
}

@media screen and (max-width: 991px) {
    .ahSection-padding {
        padding: 40px 20px;
    }
}
/* paddings */

/* container */
.ahBanner__container {
    max-width: 1400px;
    margin-left: auto;
    margin-right: auto;
}
.ahContainer-custom {
    margin-left: auto;
    margin-right: auto;
    max-width: 1240px;
}
@media (min-width: 1024px) {
    .ahContainer-custom {
        padding-left: 32px;
        padding-right: 32px;
    }
}
@media (max-width: 1023px) {
    .ahContainer-custom {
        padding-left: 12px;
        padding-right: 12px;
    }
}
/* container ends */
/* display props  */
.ahBlock {
    display: block;
}
.ahNone {
    display: none;
}
@media (max-width: 767px) {
    .ahNone-767 {
        display: none;
    }
    .ahBlock-767 {
        display: block;
    }
}
@media screen and (max-width: 350px) {
    .ahForceNone-350 {
        display: none !important;
    }
}

/* flex props */
.ahFlex {
    display: flex;
}
.ahFlexCol {
    flex-direction: column;
}
.ahInlineFlex {
    display: inline-flex;
}
.ahItemsCenter {
    align-items: center;
}
.ahJustifyBetween {
    justify-content: space-between;
}
.ahJustifyCenter {
    justify-content: center;
}
.ahFlexWrap {
    flex-wrap: wrap;
}
.ahFlexShrink0 {
    flex-shrink: 0;
}

@media screen and (max-width: 575px) {
    .ahFlexCol-575 {
        flex-direction: column;
    }
    .ahFlexColReverse-575 {
        flex-direction: column-reverse;
    }
    .ahFlexStart-575 {
        align-items: flex-start;
    }
}
@media screen and (max-width: 767px) {
    .ahFlexCol-767 {
        flex-direction: column;
    }
    .ahGap8-767 {
        gap: 8px !important;
    }
}
/* flex props */

/* grid props */
.ahGrid {
    display: grid;
}
.ahGridCols2 {
    grid-template-columns: repeat(2, 1fr);
}
.ahGridCols3 {
    grid-template-columns: repeat(3, 1fr);
}
.ahGridCols4 {
    grid-template-columns: repeat(4, 1fr);
}
.ahGridCols5 {
    grid-template-columns: repeat(5, 1fr);
}

@media screen and (max-width: 1200px) {
    .ahGridCols3-1200 {
        grid-template-columns: repeat(3, 1fr);
    }
    .ahGridCols2-1200 {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media screen and (max-width: 991px) {
    .ahGridCols2-991 {
        grid-template-columns: repeat(2, 1fr);
    }
    .ahGridCols1-991 {
        grid-template-columns: repeat(1, 1fr);
    }
}
@media screen and (max-width: 575px) {
    .ahGridCols1-575 {
        grid-template-columns: repeat(1, 1fr);
    }
}
/* grid props */

/* gaps */
.ahGap8 {
    gap: 8px;
}
.ahGap16 {
    gap: 16px;
}
.ahGap20 {
    gap: 20px;
}
.ahGap32 {
    gap: 32px;
}
.ahGap40 {
    gap: 40px;
}

@media screen and (max-width: 1200px) {
    .ahGap20-1200 {
        gap: 20px;
    }
}
/* gaps */

/* widths */
.max-w-full {
    max-width: 100%;
}
.fw-550 {
    width: 550px;
}
.fw-150 {
    width: 150px;
}
.w-full {
    width: 100%;
}
.max-w-550 {
    max-width: 550px;
}
.ahMax-w-650 {
    max-width: 650px;
}
.ahMax-w-750 {
    max-width: 750px;
}
.ahMax-w-1024 {
    max-width: 1024px;
}
.ahH18 {
    height: 18px;
}
.ahW18 {
    width: 18px;
}
@media screen and (max-width: 575px) {
    .ahW100-575 {
        width: 100%;
    }
}
/* widths */

/* Misc */
.ahFlipX {
    transform: scaleX(-1);
}
.object-cover {
    object-fit: cover;
}
/* Misc */

/* -------------------- Components -------------------- */
/* header  */

.ahHeader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: var(--white);
    z-index: 999;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}
.ahLogo {
    height: 50px;
}
@media screen and (max-width: 767px) {
    .ahLogo {
        height: 40px;
    }
}
@media screen and (max-width: 350px) {
    .ahLogo {
        height: 30px;
    }
}

/* cards  */
.ahCard {
    padding: 32px;
    border-radius: 12px;
    transition: all 0.3s ease-in;
    background-color: var(--white);
    position: relative;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}
.ahCard--opacity {
    background-color: var(--white-30);
}
.ahCard--opacity {
}
.ahCard--sm {
    padding: 24px;
}
.ahCard--md {
    padding: 32px;
}
.ahCard--lg {
    padding: 48px;
}
@media screen and (max-width: 767px) {
    .ahCard--sm,
    .ahCard--md,
    .ahCard--lg {
        padding: 32px;
    }
}
.ahCard-bordered {
    border: 1px solid var(--grey-light-2);
}
.ahCard-bordered-light {
    border: 1px solid var(--white-30);
}
.ahCardIcon {
    width: 64px;
    height: 64px;
    background-color: var(--primary-light-2);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
}
.ahCardIcon--xs {
    width: 40px;
    height: 40px;
}
.ahCardIcon--sm {
    width: 48px;
    height: 48px;
}
.ahCardIcon--green {
    width: 54px;
    height: 54px;
    background-color: var(--green-33);
}
.ahCardIcon--greenOpacity {
    background-color: var(--green-cc);
}
.ahCardIcon--whiteOpacity {
    background-color: var(--white-30);
}
.ahCard-number {
    position: absolute;
    width: 32px;
    height: 32px;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    background-color: var(--primary);
    color: var(--white);
    left: 36px;
    transform: translateX(-50%);
    top: -16px;
}

.ahCardHoverEffect:hover {
    transition: all 0.1s;
    transform: scale(1.02);
    box-shadow: var(--primary-40) 0px 2px 4px 0px;
}
.ahMiniCard {
    display: flex;
    align-items: start;
    gap: 12px;
    text-align: left;
}
.ahMiniCardIcon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background-color: var(--primary-20);
    display: flex;
    align-items: center;
    justify-content: center;
}
.ahMiniCardIcon.ahMiniCardIcon--lg {
    width: 64px;
    height: 64px;
}
.ahMiniCardIcon.ahMiniCardIcon--green {
    background-color: var(--green-33);
}
/* FORMS  */
.ahFormGroup {
    text-align: left;
    margin-top: 16px;
}
.ahFormGroup label {
    display: inline-block;
    font-size: 14px;
    margin-bottom: 0;
    font-weight: 400;
    width: 100%;
}
.ahFormGroup .ahFormControl,
.ahFormGroup .wpcf7-form-control-wrap input,
.ahFormGroup .wpcf7-form-control-wrap textarea {
    display: block;
    width: 100%;
    padding: 8px 12px;
    border-radius: 4px;
    border: 1px solid var(--grey-light-2);
    font-size: 14px;
    line-height: normal !important;
    min-height: 40px;
    margin: 4px 0 0 0;
    color: var(--black);
}
.ahFormGroup .ahFormControl::placeholder,
.ahFormGroup .wpcf7-form-control-wrap input::placeholder,
.ahFormGroup .wpcf7-form-control-wrap textarea::placeholder {
    color: var(--grey-3);
}
.ahFormGroup .ahTextArea {
    resize: vertical;
    min-height: 100px;
}
/* FORMS END  */

/* IFRAME  */
.ahIframe {
    border: none;
    border-radius: 12px;
}
/* IFRAME end */
/* Ruler horizontal */
.custom-ruler {
    border-top: 1px solid var(--white-30);
}
/* Ruler horizontal end */

/* ATF  */
.ahHeroBg {
    background-image: linear-gradient(135deg, #1152d4d9, #3ad22dbf),
        url("https://www.astrahearing.in/wp-content/uploads/2018/09/landing-page-hero-banner.webp");
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.ahHeroBg .ahMouseIcon {
    position: absolute;
    left: 50%;
    bottom: 20px;
    transform: translateX(-50%);
    animation: bouncingEffect 1s infinite;
}
@media screen and (max-width: 767px) {
    .ahHeroBg {
        min-height: 95vh;
    }
    .ahHeroBg .ahMouseIcon {
        display: none;
    }
}
/* -------------------- Components ENDS -------------------- */

/* ANIMATIONS */
@keyframes bouncingEffect {
    0%,
    100% {
        margin-bottom: 0; /* Starting and ending position */
        animation-timing-function: ease-out; /* Slow down at the top */
    }
    50% {
        margin-bottom: 10px; /* Lowest point of the bouncingEffect */
        animation-timing-function: ease-in; /* Speed up as it falls */
    }
}

/* styles after wp integration */
.wpcf7-form-control-wrap {
    margin: 0px !important;
}
.ahCard .ahFormGroup .wpcf7-form-control-wrap {
    margin: 0 !important;
}