/*
    Theme Name: Air Business
    Author: OWB
    Description: Custom theme Air Business
    Version: 1.0.0
    Text Domain: airbusiness
*/

/* ROOT VARIABLES */
/* ANIMATION */
/* BASE */

/* Sectioning tags */

*,
*::after,
*::before {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    overflow-x: hidden;
}

.screen-reader-text,
.screen-reader-response {
    display: none;
}

/* Typographic tags */

address {
    font-style: normal;
}

/* Form tags */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="tel"],
select,
textarea {
    background-color: var(--wp--preset--color--light-base-2) !important;
    padding: var(--wp--preset--spacing--16) !important;
    border-radius: var(--wp--custom--border-radius-small) !important;
    font-family: var(--wp--preset--font-family--comfortaa) !important;
    border: none !important;
    outline: none !important;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="tel"]:focus,
select:focus,
textarea:focus {
    outline: 2px solid var(--wp--preset--color--accent-1) !important;
}

/* LAYOUT */

/* MODULES */

/* Full Screen Overlay */

.fs-overlay {
    position: fixed;
    top: 0;
    left: 0;
    overflow-y: auto;
    width: 100%;
    height: 100%;
    background-color: var(--wp--preset--color--dark-base-1);
}

/* Case Study Archive*/

.case-study-archive {
    container-type: inline-size;
    container-name: case-study-archive;
    padding-top: var(--wp--preset--spacing--64);
    padding-bottom: var(--wp--preset--spacing--64);
    background-image: url("assets/images/singapore-skyline.webp");
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.case-study-archive--wrapper {
    padding: clamp(2rem, 1.2432rem + 3.2291vw, 4rem);
    background-color: rgb(255 255 255 / 75%);
    border-radius: var(--wp--custom--border-radius-medium);
}

.case-study-archive--wrapper > * {
    max-width: 1000px;
    margin-left: auto !important;
    margin-right: auto !important;
}

.case-study-archive--wrapper > :first-child {
    margin-top: 0 !important;
}

.case-study-archive--list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    column-gap: var(--wp--preset--spacing--64);
    row-gap: var(--wp--preset--spacing--48);
    margin: 0;
    padding: 0;
    list-style: none;
}

@container case-study-archive (max-width: 800px) {
    .case-study-archive--list {
        grid-template-columns: repeat(3, 1fr);
    }
}

@container case-study-archive (max-width: 600px) {
    .case-study-archive--list {
        grid-template-columns: repeat(2, 1fr);
    }
}

@container case-study-archive (max-width: 400px) {
    .case-study-archive--list {
        grid-template-columns: 1fr;
        row-gap: var(--wp--preset--spacing--64);
    }
}

/* Site Footer */

.site-footer {
    background-color: var(--wp--preset--color--dark-base-1);
}

.site-footer--wrapper {
    padding: var(--wp--preset--spacing--96) 0;
}

.site-footer--top {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: var(--wp--preset--spacing--64);
    row-gap: var(--wp--preset--spacing--32);
}

.site-footer--heading {
    font-weight: 600;
    color: var(--wp--preset--color--white);
}

.site-footer--body {
    font-weight: 400;
    color: var(--wp--preset--color--white);
}

.site-footer--contact-info {
    display: flex;
    align-items: center;
    column-gap: var(--wp--preset--spacing--32);
    row-gap: var(--wp--preset--spacing--16);
    margin: var(--wp--preset--spacing--32) 0 0;
    padding: 0;
    list-style: none;
}

.site-footer--contact-method {
    display: flex;
    align-items: center;
    column-gap: var(--wp--preset--spacing--16);
}

.site-footer--contact-icon {
    width: 3rem;
    height: 3rem;
    background-color: var(--wp--preset--color--accent-1);
}

.site-footer--contact-method-text {
    font-size: var(--wp--preset--font-size--20);
    font-weight: 600;
    color: var(--wp--preset--color--white);
    text-decoration: none;
    white-space: nowrap;
}

.site-footer--signup {
    text-align: right;
}

.site-footer--signup-buttons {
    justify-content: flex-end;
}

.site-footer--logos {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: var(--wp--preset--spacing--64);
    row-gap: var(--wp--preset--spacing--48);
    margin-top: var(--wp--preset--spacing--48);
}

.site-footer--partner-logos {
    display: flex;
    align-items: center;
    justify-content: space-between;
    column-gap: var(--wp--preset--spacing--48);
    margin: 0;
    padding: 0;
    list-style: none;
}

.site-footer--partner-logo img {
    max-height: var(--wp--preset--spacing--48);
    max-width: var(--wp--preset--spacing--96);
}

.site-footer--accreditation-logos {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    column-gap: var(--wp--preset--spacing--48);
    margin: 0;
    padding: 0;
    list-style: none;
}

.site-footer--accreditation-logo img {
    height: clamp(3rem, 2.4324rem + 2.4218vw, 4.5rem);
}

.site-footer--legal {
    margin-top: var(--wp--preset--spacing--48);
}

.site-footer--legal .site-footer--body {
    margin: 0;
}

.site-footer--bottom {
    display: flex;
    column-gap: var(--wp--preset--spacing--32);
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: var(--wp--preset--spacing--16) var(--wp--preset--spacing--global);
    border-top: 1px solid rgba(255, 255, 255, 0.4);
}

.site-footer--bottom .site-footer--body {
    margin: 0;
}

@media (max-width: 1250px) {
    .site-footer--contact-info {
        flex-wrap: wrap;
    }
}

@media (max-width: 900px) {
    .site-footer--logos {
        grid-template-columns: 1fr;
    }

    .site-footer--partner-logos {
        justify-content: center;
    }

    .site-footer--accreditation-logos {
        justify-content: center;
    }

    .site-footer--legal .site-footer--body:not(:first-of-type) {
        margin-top: var(--wp--preset--spacing--16);
    }
}

@media (max-width: 700px) {
    .site-footer--top {
        grid-template-columns: 1fr;
    }

    .site-footer--signup {
        text-align: left;
    }

    .site-footer--signup-buttons {
        justify-content: flex-start;
    }

    .site-footer--logos {
        margin-top: var(--wp--preset--spacing--64);
    }

    .site-footer--partner-logos {
        justify-content: center;
        row-gap: var(--wp--preset--spacing--16);
        flex-wrap: wrap;
    }

    .site-footer--legal {
        margin-top: var(--wp--preset--spacing--64);
    }

    .site-footer--bottom {
        padding: var(--wp--preset--spacing--32)
            var(--wp--preset--spacing--global);
    }

    .site-footer--bottom,
    .site-footer--footer-nav .footer-nav--links {
        flex-direction: column;
        row-gap: var(--wp--preset--spacing--16);
    }
}

/* Contact Icon */

.contact-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1/1;
    overflow: hidden;
    border-radius: var(--wp--custom--border-radius-full);
}

.contact-icon--icon {
    width: var(--wp--preset--spacing--24);
    max-width: var(--wp--preset--spacing--24);
    max-height: var(--wp--preset--spacing--24);
}

/* Footer Navigation */

.footer-nav--links {
    display: flex;
    align-items: center;
    column-gap: var(--wp--preset--spacing--32);
    margin: 0;
    padding: 0;
    list-style: none;
}

.footer-nav--links a {
    color: var(--wp--preset--color--white);
    text-decoration: none;
}

/* Floating Tab */

.floating-tab {
    position: fixed;
    top: 25%;
    transform: translateY(-50%);
    z-index: 9999;
    right: max(0px, env(safe-area-inset-right));
}

.floating-tab--link {
    display: block;
    background-color: var(--wp--preset--color--accent-1);
    color: var(--wp--preset--color--white);
    padding: var(--wp--preset--spacing--16) 0.813rem;
    font-weight: 700;
    text-decoration: none;
    border-radius: var(--wp--custom--border-radius-small) 0 0
        var(--wp--custom--border-radius-small);
    writing-mode: sideways-lr;
    text-orientation: mixed;
}

@media (max-width: 900px) {
    .floating-tab {
        top: unset;
        bottom: 0;
        right: 10%;
        transform: unset;
        z-index: 799;
    }

    .floating-tab--link {
        padding: 0.813rem;
        border-radius: var(--wp--custom--border-radius-small)
            var(--wp--custom--border-radius-small) 0 0;
            font-size: 14px;
        writing-mode: unset;
        text-orientation: unset;
    }
}

/* MS Dynamics Form */

form.marketingForm {
    container-type: inline-size;
    container-name: marketing-form;
}

/* RESET */
form.marketingForm [data-layout="true"] {
    max-width: unset !important;
}

form.marketingForm .outer {
    width: 100% !important;
}

form.marketingForm th {
    padding: 0 !important;
}

form.marketingForm .columns-equal-class tbody {
    display: block !important;
    width: 100% !important;
}

form.marketingForm .columns-equal-class tr {
    display: block !important;
    width: 100% !important;
}

form.marketingForm .columns-equal-class th {
    display: block !important;
    width: 100% !important;
    height: auto !important;
}

form.marketingForm .textFormFieldBlock,
form.marketingForm .optionSetFormFieldBlock,
form.marketingForm .phoneFormFieldBlock,
form.marketingForm .consentBlock,
form.marketingForm .multiOptionSetFormFieldBlock,
form.marketingForm .submitButtonWrapper {
    margin-bottom: var(--wp--preset--spacing--32) !important;
    padding: 0 !important;
    gap: var(--wp--preset--spacing--8) !important;
}

form.marketingForm .phoneFormFieldBlock .phoneCountryCode {
    border: none !important;
    overflow: visible !important;
}

form.marketingForm .consentBlock * {
    font-family: var(--wp--preset--font-family--comfortaa) !important;
    color: rgb(50, 49, 48) !important;
    -webkit-text-fill-color: rgb(50, 49, 48) !important;
    background-color: transparent !important;
}

form.marketingForm .submitButtonWrapper {
    text-align: unset !important;
}

/* STYLE */
form.marketingForm
    .columns-equal-class
    table.outer
    table.containerWrapper
    tr:has(.columnContainer) {
    display: flex !important;
    column-gap: var(--wp--preset--spacing--24) !important;
}

form.marketingForm label,
form.marketingForm label span {
    font-family: var(--wp--preset--font-family--comfortaa) !important;
}

form.marketingForm .submitButton {
    background-color: var(--wp--preset--color--accent-1) !important;
    border-radius: var(--wp--custom--border-radius-small) !important;
    color: var(--wp--preset--color--white) !important;
    font-family: var(--wp--preset--font-family--comfortaa) !important;
    font-weight: 700 !important;
    line-height: inherit !important;
    padding-top: 0.813rem !important;
    padding-right: var(--wp--preset--spacing--16) !important;
    padding-bottom: 0.813rem !important;
    padding-left: var(--wp--preset--spacing--16) !important;
    text-decoration: none !important;
}

@container marketing-form (max-width: 500px) {
    form.marketingForm
        .columns-equal-class
        table.outer
        table.containerWrapper
        tr:has(.columnContainer) {
        flex-direction: column !important;
    }
}