/* ================================ Global Styles for Infotenix ================================ */

/* Regular (Normal) */
@font-face {
    font-family: 'Helvetica';
    src: url('../fonts/helvetica/Helvetica.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

/* Bold (700) */
@font-face {
    font-family: 'Helvetica';
    src: url('../fonts/helvetica/Helvetica-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

/* ================================ Global Variables & Styles ================================ */
:root {
    /* **********COLORS********** */
    --black-color: #000000;
    --dark-color: #292929;
    --white-color: #ffffff;
    --light-color: #646464;
    --primary-color: #FDB940;
    --gradient-primary-color: #feb736;
    --secondary-color: #0D634C;
    /* **********COLORS********** */

    /* **********FONTS********** */
    --font-primary: 'Helvetica', sans-serif;
    /* **********FONTS********** */

    --transition-anim: all 0.3s ease-in-out;

    --header-height: 100px;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    color: var(--dark-color);
    font-family: var(--font-primary);
    font-size: 17px;
    line-height: 1.6;
    font-weight: 400;
    /* Default Normal */
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    font-family: var(--font-primary);
    font-weight: 700;
    margin-bottom: 0;
    /* Headings Bold */
}

strong,
b {
    font-weight: 700;
}

.fs-xxl {
    font-size: 3rem !important;
}

.transition__anim {
    transition: var(--transition-anim)
}

/* text color classes */
.text__black {
    color: var(--black-color)
}

.text__dark {
    color: var(--dark-color)
}

.text__white {
    color: var(--white-color)
}

.text__light {
    color: var(--light-color)
}

.text__primary {
    color: var(--primary-color);
}

.text__secondary {
    color: var(--secondary-color);
}

/* text color classes */

/* bg color */
.bg__primary {
    background-color: var(--primary-color);
}

.bg__white {
    background-color: var(--white-color);
}

.bg__light {
    background-color: var(--light-color);
}

/* bg color */

/* hover color */
.hover__text__white:hover>* {
    color: var(--white-color) !important;
}

.hover__secondary:hover {
    color: var(--secondary-color);
}

.hover__bg__secondary:hover {
    background-color: var(--secondary-color);
}

/* hover color */

/* Horizontal gradient (left to right) */
.bg-gradient-horizontal {
    background: linear-gradient(to right, var(--secondary-color), var(--gradient-primary-color));
}

.bg-gradient-horizontal__opposite {
    background: linear-gradient(to right, var(--gradient-primary-color), var(--secondary-color));
}

/* Vertical gradient (top to bottom) */
.bg-gradient-vertical {
    background: linear-gradient(to bottom, var(--secondary-color), var(--gradient-primary-color));
}

/* hover Horizontal gradient (left to right) */
.hover-bg-gradient-horizontal:hover {
    background: linear-gradient(to right, var(--secondary-color), var(--gradient-primary-color));
}

/* Vertical gradient (top to bottom) */
.hover-bg-gradient-vertical:hover {
    background: linear-gradient(to bottom, var(--secondary-color), var(--gradient-primary-color));
}

/* btn */
.btn__ {
    padding: 6px 28px;
    text-decoration: none;
    border: none;
    outline: none;
    border-radius: 0.25rem;
}

.btn__primary {
    background-color: var(--primary-color);
    color: var(--black-color);
}

.btn__outlined__primary {
    border: 1px solid var(--primary-color);
    background-color: var(--white-color);
    color: var(--primary-color);
}

.btn__outlined__primary:hover {
    background-color: var(--primary-color);
    color: var(--dark-color);
}

.btn__outlined__secondary {
    border: 1px solid var(--secondary-color);
    background-color: var(--white-color);
    color: var(--secondary-color);
}

.btn__outlined__secondary:hover {
    background-color: var(--secondary-color);
    color: var(--white-color);
}

.btn__secondary {
    background-color: var(--secondary-color);
    color: var(--white-color);
}

/* btn */

.form-control:focus {
    box-shadow: none;
    border-color: var(--primary-color);
}

.gradient-bg-curve-3 {
    background-image: url('../images/gradient-curve-bg.png');
    background-repeat: no-repeat;
    background-size: 50% auto;
    background-position: left center;
}

.gradient-bg-curve-2 {
    background-image: url('../images/it-asset-management/shape.png');
    background-repeat: no-repeat;
    background-size: 34% auto;
    background-position: left center;
}

.partners__img {
    max-width: 120px;
    width: auto;
    max-height: 34px;
    height: auto;
}


::placeholder {
    color: #BEBEBF !important;
    opacity: 1;
    /* Firefox */
}

::-ms-input-placeholder {
    /* Edge 12-18 */
    color: #BEBEBF !important;
}

#footer .small {
    font-size: 13px !important;
}

/* accordion */
.accordion-item {
    border: none;
    margin-bottom: 20px;
}

.accordion-button {
    border-radius: 0;
    border: none;
    background-color: #f4f4f4;
    color: var(--secondary-color);
    font-size: 1.2rem;
    font-weight: 500;
}

.accordion-button:not(.collapsed) {
    color: var(--secondary-color);
    background-color: #f4f4f4;

}

.accordion-button:focus {
    box-shadow: none;
}

/* Remove bootstrap's default chevron */
.accordion-button::after {
    background-image: none !important;
    content: "\002B";
    /* + */
    color: var(--secondary-color);
    font-size: 2rem;
    font-weight: 500;
    line-height: 1rem;
    /* vertical centering fix */
    vertical-align: middle;
    /* extra centering */
    margin-top: 2px;
    /* optional tweak */
    transition: transform 0.2s ease-in-out;
}

/* When accordion is open */
.accordion-button:not(.collapsed)::after {
    content: "\2212";
    /* − */
    transform: rotate(0);
}

/* accordion */

.hover__light__bg__card:hover {
    background-color: #daf6ff;
    color: #3344a6;
    transition: transform 0.2s ease-in-out;
}

.bg____light {
    background-color: #f0f0f0;
}

.hero__section {
    /* min-height: calc(100svh - var(--header-height)); */
    display: flex;
    align-items: center;
}

.border__primary {
    border: 1px solid var(--primary-color);
}

.expertise-icon {
    width: auto;
    height: auto;
    max-width: 40px;
    max-height: 40px;
    object-fit: contain;
    display: block;
}

.expertise-icon.max__icon {
    max-width: 80px;
}

.feature-card {
    height: 100%;
    transition: var(--transition-anim);
}

.feature-card:hover {
    box-shadow: 0 8px 10px rgba(0, 0, 0, 0.15);
    transform: translateY(-3px);
}

.feature-card .icon {
    width: auto;
    height: auto;
    max-width: 72px;
    max-height: 72px;
    object-fit: contain;
    display: block;
}

/* footer text light color */
.footer__light__text {
    color: #848484;
}

.mb-2__5 {
    margin-bottom: 0.6rem;
}

.secondary__divider {
    padding-bottom: 2rem;
}

.contact__us__lets__talk {
    position: relative;
}

@media (min-width: 768px) {
    .secondary__divider {
        border-bottom: none;
        padding-bottom: 0;
        border-right: 1px solid var(--secondary-color);
        padding-right: 1rem;
    }

    .contact__us__lets__talk::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 42%;
        height: 100%;
        background-color: var(--primary-color);
        z-index: -1;
    }
}

@media (max-width: 767px) {
    .left__yellow__small__screen {
        background-color: var(--primary-color);
    }
}