/* 
Pacific v.30 Custom Stylesheet
05-31-2018
*/

* {
    box-sizing: border-box;
    /* cursor: none; */
}

html {
    /* background: var(--primary-light); */
}

body {
    font-family: var(--font-main), Helvetica, Arial, sans-serif;
    font-weight: normal;
    line-height: 1.5;
    overflow-x: hidden;
}

ul {
    list-style: none;
}

/* custom selection */
::selection {
    color: rgba(0, 0, 0, 0.65);
    background: rgba(128, 165, 229, 0.5);
}

/* custom scrollbar */
::-webkit-scrollbar-track {
    /* -webkit-box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.3); */
    background-color: var(--primary-light);
}

::-webkit-scrollbar {
    width: 8px;
    background-color: rgba(245, 245, 245, 0);
}

::-webkit-scrollbar-thumb {
    background-color: var(--primary-red);
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    /* border-radius: 5px; */
}

/* custom cursor */
.cursor-dot,
.cursor-dot-outline {
    pointer-events: none;
    position: absolute;
    top: 50%;
    left: 50%;
    border-radius: 50%;
    opacity: 0;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    transition: opacity 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
}

.cursor-dot {
    width: 8px;
    height: 8px;
    background-color: #2f9de2;
    z-index: 999;
}

.cursor-dot-outline {
    width: 40px;
    height: 40px;
    background-color: rgba(128, 202, 229, 0.5);
    z-index: 999;
}

/* custom tooltip */
[tooltip] {
    position: relative;
    /* opinion 1 */
}

/* Applies to all tooltips */
[tooltip]::before,
[tooltip]::after {
    text-transform: none;
    /* opinion 2 */
    font-size: .9em;
    /* opinion 3 */
    line-height: 1;
    user-select: none;
    pointer-events: none;
    position: absolute;
    display: none;
    opacity: 0;
}

[tooltip]::before {
    content: '';
    border: 5px solid transparent;
    /* opinion 4 */
    z-index: 1001;
    /* absurdity 1 */
}

[tooltip]::after {
    content: attr(tooltip);
    /* magic! */

    /* most of the rest of this is opinion */
    font-family: var(--font-main), sans-serif;
    text-align: center;

    /* 
    Let the content set the size of the tooltips 
    but this will also keep them from being obnoxious
    */
    min-width: 3em;
    /* max-width: 21em; */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 1ch 1.5ch;
    border-radius: .3ch;
    box-shadow: 0 1em 2em -.5em rgba(0, 0, 0, 0.35);
    background: #333;
    color: #fff;
    z-index: 1000;
    /* absurdity 2 */
}

/* Make the tooltips respond to hover */
[tooltip]:hover::before,
[tooltip]:hover::after {
    display: block;
}

/* don't show empty tooltips */
[tooltip='']::before,
[tooltip='']::after {
    display: none !important;
}

/* FLOW: UP */
[tooltip]:not([flow])::before,
[tooltip][flow^="up"]::before {
    bottom: 100%;
    border-bottom-width: 0;
    border-top-color: #333;
}

[tooltip]:not([flow])::after,
[tooltip][flow^="up"]::after {
    bottom: calc(100% + 5px);
}

[tooltip]:not([flow])::before,
[tooltip]:not([flow])::after,
[tooltip][flow^="up"]::before,
[tooltip][flow^="up"]::after {
    left: 50%;
    transform: translate(-50%, -.5em);
}

/* FLOW: DOWN */
[tooltip][flow^="down"]::before {
    top: 100%;
    border-top-width: 0;
    border-bottom-color: #333;
}

[tooltip][flow^="down"]::after {
    top: calc(100% + 5px);
}

[tooltip][flow^="down"]::before,
[tooltip][flow^="down"]::after {
    left: 50%;
    transform: translate(-50%, .5em);
}

/* FLOW: LEFT */
[tooltip][flow^="left"]::before {
    top: 50%;
    border-right-width: 0;
    border-left-color: #333;
    left: calc(0em - 5px);
    transform: translate(-.5em, -50%);
}

[tooltip][flow^="left"]::after {
    top: 50%;
    right: calc(100% + 5px);
    transform: translate(-.5em, -50%);
}

/* FLOW: RIGHT */
[tooltip][flow^="right"]::before {
    top: 50%;
    border-left-width: 0;
    border-right-color: #333;
    right: calc(0em - 5px);
    transform: translate(.5em, -50%);
}

[tooltip][flow^="right"]::after {
    top: 50%;
    left: calc(100% + 5px);
    transform: translate(.5em, -50%);
}

/* KEYFRAMES */
@keyframes tooltips-vert {
    to {
        opacity: 1;
        transform: translate(-50%, 0);
    }
}

@keyframes tooltips-horz {
    to {
        opacity: 1;
        transform: translate(0, -50%);
    }
}

/* FX All The Things */
[tooltip]:not([flow]):hover::before,
[tooltip]:not([flow]):hover::after,
[tooltip][flow^="up"]:hover::before,
[tooltip][flow^="up"]:hover::after,
[tooltip][flow^="down"]:hover::before,
[tooltip][flow^="down"]:hover::after {
    animation: tooltips-vert 300ms ease-out forwards;
}

[tooltip][flow^="left"]:hover::before,
[tooltip][flow^="left"]:hover::after,
[tooltip][flow^="right"]:hover::before,
[tooltip][flow^="right"]:hover::after {
    animation: tooltips-horz 300ms ease-out forwards;
}


/* Tools */
.inet-red {
    background: var(--primary-red) !important;
}

.inet-dark {
    background: var(--primary-dark) !important;
}

.inet-light {
    background: var(--primary-light) !important;
}

.inet-grey {
    background: var(--primary-grey) !important;
}

.bg-danger {
    background-color: var(--color-danger);
}

.bg-warning {
    background-color: var(--color-warning);
}

.bg-info {
    background-color: var(--color-info);
}

.bg-success {
    background-color: var(--color-success);
}

.inet-red-text {
    color: var(--primary-red) !important;
}

.inet-dark-text {
    color: var(--primary-dark) !important;
}

.inet-light-text {
    color: var(--primary-light) !important;
}

.inet-grey-text {
    color: var(--primary-grey) !important;
}

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

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

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

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

.inet-font-main {
    font-family: var(--font-main);
}

.inet-font-sans {
    font-family: var(--font-sans);
}

.inet-font-sans {
    font-family: var(--font-sans);
}

[hidden] {
    display: none;
}

.hide,
.hidden {
    display: none !important;
}

.left-align {
    text-align: left;
}

.right-align {
    text-align: right;
}

.center,
.center-align {
    text-align: center;
}

.left {
    float: left !important;
}

.right {
    float: right !important;
}

.thin-text {
    font-weight: 100;
}

.light-text {
    font-weight: 300;
}

.medium-text {
    font-weight: 500;
}

.semibold-text {
    font-weight: 600;
}

.bold-text {
    font-weight: 700;
}

.extrabold-text {
    font-weight: 900;
}

.circle {
    border-radius: 50%;
}

.center-block {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.truncate {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.no-padding {
    padding: 0 !important;
}

.valign-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.clearfix {
    clear: both;
}

.z-depth-0 {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

/* 2dp elevation modified*/
.z-depth-1 {
    -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2);
}

.z-depth-1-half {
    -webkit-box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 7px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -1px rgba(0, 0, 0, 0.2);
    box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 7px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -1px rgba(0, 0, 0, 0.2);
}

/* 6dp elevation modified*/
.z-depth-2 {
    -webkit-box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.3);
    box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.3);
}

/* 12dp elevation modified*/
.z-depth-3 {
    -webkit-box-shadow: 0 8px 17px 2px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);
    box-shadow: 0 8px 17px 2px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);
}

/* 16dp elevation */
.z-depth-4 {
    -webkit-box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -7px rgba(0, 0, 0, 0.2);
    box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -7px rgba(0, 0, 0, 0.2);
}

/* 24dp elevation */
.z-depth-5 {
    -webkit-box-shadow: 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12), 0 11px 15px -7px rgba(0, 0, 0, 0.2);
    box-shadow: 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12), 0 11px 15px -7px rgba(0, 0, 0, 0.2);
}

.hoverable {
    -webkit-transition: -webkit-box-shadow .25s;
    transition: -webkit-box-shadow .25s;
    transition: box-shadow .25s;
    transition: box-shadow .25s, -webkit-box-shadow .25s;
}

.hoverable:hover {
    -webkit-box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.divider {
    height: 1px;
    overflow: hidden;
    background-color: #e0e0e0;
}

blockquote {
    /* margin: 20px 0;
    padding-left: 1.5rem;
    border-left: 5px solid var(--primary-red-light); */
}

i {
    line-height: inherit;
}

i.left {
    float: left;
    margin-right: 15px;
}

i.right {
    float: right;
    margin-left: 15px;
}

i.tiny {
    font-size: 1rem;
}

i.small {
    font-size: 2rem;
}

i.medium {
    font-size: 4rem;
}

i.large {
    font-size: 6rem;
}

img.responsive-img,
video.responsive-video {
    max-width: 100%;
    height: auto;
}

.inet-btn-fab {
    background: var(--primary-red);
    border: 0.2rem solid var(--primary-red);
    color: var(--primary-light);
    border-radius: 100px;
}

.inet-btn-fab:hover {
    background: var(--primary-red-light);
    border: 0.2rem solid var(--primary-red-light);
    color: var(--primary-light);
}

.inet-btn-main-red {
    background: var(--primary-red);
    border: 0.2rem solid var(--primary-red);
    color: var(--primary-light);
}

.inet-btn-main-red:hover {
    background: var(--primary-red-light);
    border: 0.2rem solid var(--primary-red-light);
    color: var(--primary-light);
}

.inet-btn-main-dark {
    background: var(--primary-dark);
    border: 0.2rem solid var(--primary-dark);
    color: var(--primary-light);
}

.inet-btn-main-dark:hover {
    background: var(--primary-grey-dark);
    border: 0.2rem solid var(--primary-grey-dark);
    color: var(--primary-light);
}

.inet-btn-main-light {
    background: var(--primary-light);
    border: 0.2rem solid var(--primary-light);
    color: var(--primary-dark);
}

.inet-btn-main-light:hover {
    background: var(--secondary-light);
    border: 0.2rem solid var(--secondary-light);
    color: var(--primary-dark);
}

.inet-btn-stroke-red {
    background: transparent;
    border: 0.2rem solid var(--primary-red);
    color: var(--primary-red);
}

.inet-btn-stroke-red:hover {
    background: var(--primary-red);
    border: 0.2rem solid var(--primary-red);
    color: var(--primary-light);
}

.inet-btn-stroke-dark {
    background: transparent;
    border: 0.2rem solid var(--primary-dark);
    color: var(--primary-dark);
}

.inet-btn-stroke-dark:hover {
    background: var(--primary-dark);
    border: 0.2rem solid var(--primary-dark);
    color: var(--primary-light);
}

.inet-btn-stroke-light {
    background: transparent;
    border: 0.2rem solid var(--primary-light);
    color: var(--primary-light);
}

.inet-btn-stroke-light:hover {
    background: var(--primary-light);
    border: 0.2rem solid var(--primary-light);
    color: var(--primary-dark);
}

.inet-btn-main-round-red {
    background: var(--primary-red);
    border: 0.2rem solid var(--primary-red);
    color: var(--primary-light);
    border-radius: 50px;
}

.inet-btn-main-round-red:hover {
    background: var(--primary-red-light);
    border: 0.2rem solid var(--primary-red-light);
    color: var(--primary-light);
}

.inet-btn-main-round-dark {
    background: var(--primary-dark);
    border: 0.2rem solid var(--primary-dark);
    color: var(--primary-light);
    border-radius: 50px;
}

.inet-btn-main-round-dark:hover {
    background: var(--primary-grey-dark);
    border: 0.2rem solid var(--primary-grey-dark);
    color: var(--primary-light);
}

.inet-btn-stroke-round-red {
    background: transparent;
    border: 0.2rem solid var(--primary-red);
    color: var(--primary-red);
    border-radius: 50px;
}

.inet-btn-stroke-round-red:hover {
    background: var(--primary-red);
    border: 0.2rem solid var(--primary-red);
    color: var(--primary-light);
}

.inet-btn-stroke-round-dark {
    background: transparent;
    border: 0.2rem solid var(--primary-dark);
    color: var(--primary-dark);
    border-radius: 50px;
}

.inet-btn-stroke-round-dark:hover {
    background: var(--primary-dark);
    border: 0.2rem solid var(--primary-dark);
    color: var(--primary-light);
}

.inet-btn-main-invert-red {
    background: var(--primary-red);
    border: 0.2rem solid var(--primary-red);
    color: var(--primary-light);
}

.inet-btn-main-invert-red:hover {
    background: transparent;
    border: 0.2rem solid var(--primary-red);
    color: var(--primary-red);
}

.inet-btn-main-invert-dark {
    background: var(--primary-dark);
    border: 0.2rem solid var(--primary-dark);
    color: var(--primary-light);
}

.inet-btn-main-invert-dark:hover {
    background: transparent;
    border: 0.2rem solid var(--primary-dark);
    color: var(--primary-dark);
}

.inet-btn-main-invert-light {
    background: var(--primary-light);
    border: 0.2rem solid var(--primary-light);
    color: var(--primary-dark);
}

.inet-btn-main-invert-light:hover {
    background: transparent;
    border: 0.2rem solid var(--primary-light);
    color: var(--primary-light);
}

.btn-round {
    border-radius: 50px;
}

.btn-raised {
    -webkit-box-shadow: 0px 11px 45px -10px rgb(128, 128, 128);
    box-shadow: 0px 11px 45px -10px rgb(128, 128, 128);
}

.inet-btn-main-round-invert-red {
    background: var(--primary-red);
    border: 0.2rem solid var(--primary-red);
    color: var(--primary-light);
    border-radius: 50px;
}

.inet-btn-main-round-invert-red:hover {
    background: transparent;
    border: 0.2rem solid var(--primary-red);
    color: var(--primary-red);
}

.inet-btn-main-round-invert-dark {
    background: var(--primary-dark);
    border: 0.2rem solid var(--primary-dark);
    color: var(--primary-light);
    border-radius: 50px;
}

.inet-btn-main-round-invert-dark:hover {
    background: transparent;
    border: 0.2rem solid var(--primary-dark);
    color: var(--primary-dark);
}

.image-size-16 {
    width: 16px;
}

.image-size-20 {
    width: 20px;
}

.image-size-32 {
    width: 32px;
}

.image-size-64 {
    width: 64px;
}

.image-size-128 {
    width: 128px;
}

.image-size-256 {
    width: 256px;
}

.image-size-512 {
    width: 512px;
}

.image-size-300 {
    width: 300px;
}

.m-1 {
    margin: 1rem !important;
}

.mt-1 {
    margin-top: 1rem !important;
}

.mr-1 {
    margin-right: 1rem !important;
}

.mb-1 {
    margin-bottom: 1rem !important;
}

.ml-1 {
    margin-left: 1rem !important;
}

.m-2 {
    margin: 2rem !important;
}

.mt-2 {
    margin-top: 2rem !important;
}

.mr-2 {
    margin-right: 2rem !important;
}

.mb-2 {
    margin-bottom: 2rem !important;
}

.ml-2 {
    margin-left: 2rem !important;
}

/* PAGES */

/* Global */
.inet-name {
    font-family: var(--font-main);
}

.txt-type {
    font-family: var(--font-sans);
}

.txt-type>.txt {
    border-right: 0.2rem solid #777;
}

.under-construction img {
    width: 300px;
}

.error-section img {
    width: 400px;
}

.s-hero {
    padding-top: 18rem;
    padding-bottom: 16rem;
    position: relative;
    overflow: hidden;
}

.s-hero.hero--red {
    background-color: var(--primary-red);
    color: var(--primary-light);
}

.s-hero.hero--dark {
    background-color: var(--primary-dark);
    color: var(--primary-light);
}

.s-hero.hero--grey-dark {
    background-color: var(--primary-grey-dark);
    color: var(--primary-light);
}

.s-hero.hero--grey {
    background-color: var(--primary-grey);
    color: var(--primary-dark);
}

.s-hero.hero--grey-light {
    background-color: var(--primary-grey-light);
    color: var(--primary-dark);
}

.s-hero.hero--light {
    background-color: var(--primary-light);
    color: var(--primary-dark);
}

.inet-case .s-hero::before {
    display: block;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .6;
    background-color: #000000;
}

.inet-case .s-hero .shadow-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .2;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 100%);
}

.s-section {
    padding-top: 12.5rem;
    padding-bottom: 12.5rem;
    position: relative;
    overflow: hidden;
}

.s-section.section--red {
    background-color: var(--primary-red);
    color: var(--primary-light);
}

.s-section.section--dark {
    background-color: var(--primary-dark);
    color: var(--primary-light);
}

.s-section.section--grey {
    background-color: var(--primary-grey);
    color: var(--primary-dark);
}

.s-section.section--grey-dark {
    background-color: var(--primary-grey-dark);
    color: var(--primary-light);
}

.s-section.section--grey-light {
    background-color: var(--primary-grey-light);
    color: var(--primary-dark);
}

.s-section.section--grey-lighter {
    background-color: var(--primary-grey-lighter);
    color: var(--primary-dark);
}

.s-section.section--grey-lightest {
    background-color: var(--primary-grey-lightest);
    color: var(--primary-dark);
}

.s-section.section--light {
    background-color: var(--primary-light);
    color: var(--primary-dark);
}

.s-section.section--soft-peach {
    background-color: var(--primary-soft-peach);
    color: var(--primary-dark);
}

.s-section.section--white-smoke {
    background-color: var(--primary-white-smoke);
    color: var(--primary-dark);
}

.s-cta {
    padding-top: 10rem;
    padding-bottom: 7.5rem;
    position: relative;
    overflow: hidden;
}

.s-cta.cta--red {
    background-color: var(--primary-red);
    color: var(--primary-light);
}

.s-cta.cta--dark {
    background-color: var(--primary-dark);
    color: var(--primary-light);
}

.s-cta.cta--light {
    background-color: var(--primary-light);
    color: var(--primary-dark);
}

.s-cta.cta--grey {
    background-color: var(--primary-grey);
    color: var(--primary-dark);
}

.s-cta.cta--grey-dark {
    background-color: var(--primary-grey-dark);
    color: var(--primary-light);
}

.s-cta.cta--grey-light {
    background-color: var(--primary-grey-light);
    color: var(--primary-dark);
}

.inet-parallax-dark {
    padding-top: 18rem;
    padding-bottom: 18rem;
    background-color: #0E314F;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url(../assets/img/workspace/buildings/CTV_4837.jpg);
    background-size: cover;
    position: relative;
    color: rgba(255, 255, 255, 0.5);
}

.inet-parallax-dark::before {
    display: block;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #0E314F;
    opacity: .65;
}

.inet-parallax-light {
    padding-top: 18rem;
    padding-bottom: 18rem;
    background-color: #0E314F;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url(../assets/img/workspace/buildings/CTV_4837.jpg);
    background-size: cover;
    position: relative;
    color: rgba(255, 255, 255, 0.5);
}

.inet-parallax-light::before {
    display: block;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #f5f5f5;
    opacity: .65;
}

/* Home Page */
.site-logo {
    font-family: var(--font-sans);
    font-weight: 600;
}

.s-header.sticky .header-nav li a {
    color: #333;
}

.s-header.sticky .header-nav-wrap.mobile .header-nav li a {
    color: #fff;
}

.s-header.s-header.sticky .header-menu-toggle span {
    background-color: var(--primary-dark);
}

.header-nav .active a {
    color: var(--primary-red) !important;
}

.header-nav-wrap.mobile {
    height: 100vh;
    background: var(--primary-dark);
}

.header-nav-wrap.mobile+.header-menu-toggle::before {
    display: inline-block;
    content: "Menu";
    height: 42px;
    left: auto;
    text-align: right;
    padding-left: 15px;
    padding-right: 10px;
    position: absolute;
    top: 0;
    right: 100%;
    /* color:var(--primary-dark); */
}

.header-nav-wrap.mobile ul.header-nav li>a {
    /* color: var(--primary-dark); */
    font-family: var(--font-sans);
    font-size: 3rem;
    font-weight: 500;
    text-align: center;
}

.header-nav-wrap.mobile ul.header-nav li:hover>a {
    color: var(--primary-red);
}

/* .inet-home .s-about-parallax  p.lead:first-letter {
    font-family: var(--font-serif);
    font-size: 5rem;
    line-height: 40px;
    color:var(--primary-red);
    float: left;
    padding-top: 10px;
    padding-right: 10px;
    padding-left: 10px;
} */

/* footer */
.contact-logo {}

.inet-logo-contact {
    width: 64px;
     filter:
        brightness(1.35)
        contrast(1.1)
        drop-shadow(0 2px 8px rgba(0, 0, 0, 0.5));
}

.contact-logo h1 {
    font-family: var(--font-main);
    font-size: 32px;
    color: var(--primary-light);
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.contact-logo p {
    font-family: var(--font-sans);
    font-size: 16px;
    color: var(--primary-light);
}

.contact-infos ul li>a {
    font-size: 20px;
}

.contact-infos ul li>a:hover {
    color: var(--primary-red);
}

.contact-social {
    margin-bottom: 3.5rem;
}

.contact-location {
    margin-bottom: 3.5rem;
}

ul.contact-social-list {
    display: flex;
    align-items: flex-end;
    flex: 2;
}

ul.contact-social-list>li {
    margin-right: 35px;
    opacity: .7;
    transition: opacity .85s var(--primary-ease);
}

.contact-location p {
    font-family: var(--font-sans);
    color: #999999;
}

.contact-location i {
    margin-right: 10px;
}

/* Work page */
.inet-works .header-nav-wrap .header-nav li>a {
    color: var(--primary-dark);
}

.inet-works .header-nav-wrap.mobile ul.header-nav li>a {
    color: var(--primary-light);
}

.inet-works .header-nav-wrap.mobile ul.header-nav li:hover>a {
    color: var(--primary-red);
}

.inet-works .header-nav-wrap .header-nav li:hover>a {
    color: var(--primary-red);
}

.inet-works .header-nav-wrap.mobile+.header-menu-toggle::before {
    display: inline-block;
    content: "Menu";
    height: 42px;
    left: auto;
    text-align: right;
    padding-left: 15px;
    padding-right: 10px;
    position: absolute;
    top: 0;
    right: 100%;
    color: var(--primary-dark);
}

.inet-works .header-menu-toggle span {
    display: block;
    width: 24px;
    height: 2px;
    margin-top: -1px;
    position: absolute;
    left: 9px;
    top: 50%;
    right: auto;
    bottom: auto;
    background-color: var(--primary-dark);
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    font: 0/0 a;
    text-shadow: none;
    color: transparent;
}

.more-cta-btn {
    margin-top: 4rem;
    margin-bottom: 4rem;
    text-align: center;
}

#home-works {
    padding-bottom: 1.5rem;
    background: var(--primary-light);
}

.work-showcase {
    /* background: var(--primary-light); */
    margin-top: 6rem;
    background-color: var(--primary-light);
    position: relative;
}

.work-showcase-logo {
    padding-bottom: 3rem;

}

.solution-logo-list {
    margin: 0;
}

.solution-logo-list li {
    display: inline-block;
    margin-right: 5rem;
}

.solution-logo-list li>img {
    width: 50px;
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
    margin-top: 3rem;
    transition: all .3s ease-in-out;
}

.solution-logo-list li>img:hover {
    -webkit-filter: grayscale(0);
    filter: grayscale(0);
}

.showcase-solution {
    padding: 3rem;
}

.showcase-solution .solution-image {
    width: 100%;
    border-radius: 5px;
    transition: transform .2s;
}

.solution-label {
    width: 100%;
    position: relative;
    /* right: -25px;
    bottom: 100px; */
    text-align: right;
    z-index: 99;
    transition: transform .2s;
}

[class="solution-logo"] {
    width: 50px;
    position: relative;
    float: left;
    margin-right: 10px;
}

.showcase-solution h2 {
    color: var(--primary-dark);
    margin-top: 1rem;
    margin-bottom: 0.5rem;
    text-align: right;
}

.showcase-solution p {
    color: var(--primary-dark);
    font-family: var(--font-sans);
    font-size: 1.8rem;
    font-weight: 400;
    line-height: 1;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

.showcase-solution .solution-image:hover {
    /* transform: translate(5px, -5px); */
    -webkit-box-shadow: 0 10px 20px rgba(92, 26, 35, 0.31);
    box-shadow: 0 10px 20px rgba(92, 26, 35, 0.31);
}

.showcase-solution .solution-image:hover+.solution-label {
    transform: translateY(-25px);
}

.showcase-solution .solution-image:hover+.solution-label * {
    color: var(--primary-red);
}

.solution-tile {
    float: left;
    display: block;
    width: 100%;
    height: 200px;
    /* background: linear-gradient(150deg, #ffa800, #af006e); */
    background-position: center center;
    background-image: url(../assets/img/solutions/solution-lanscape/lukslofts-02.jpg);
    background-size: cover;
    color: var(--primary-dark);
    text-decoration: none;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transform: perspective(500px);
    transform: perspective(500px);
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
    color: white;
}

.solution-tile:hover {
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.25);
    color: white;
}

.solution-tile:hover>span {
    -webkit-transform: translateZ(30px) scale(0.833);
    transform: translateZ(30px) scale(0.833);
}

.solution-tile span {
    display: block;
    -webkit-transform: translateZ(0px) scale(0.75);
    transform: translateZ(0px) scale(0.75);
    transition: -webkit-transform 150ms;
    transition: transform 150ms;
    transition: transform 150ms, -webkit-transform 150ms;
    font-size: 3rem;
    font-weight: 600;
    color: var(--primary-dark);
    /* width: 150px;
    height: 150px;
    line-height: 150px; */
    text-align: center;
    position: absolute;
    bottom: 5px;
    right: 0;
    text-shadow: 0 2px 7px rgba(0, 0, 0, 0.3);
    -webkit-transform: text-shadow 150ms;
    transform: text-shadow 150ms;
}

.work-showcase-slide {
    position: fixed;
    bottom: 0;
    left: 0;
}

.inet-menu-fab {
    position: fixed;
    top: 50px;
    right: 5px;
}

.inet-menu-fab a {
    text-decoration: none;
    border: 0 none;
    border-radius: 50px;
    display: block;
    height: 40px;
    width: 40px;
    line-height: 60px;
    text-align: center;
    background: var(--primary-red);
    color: white;
    text-align: center;
    text-transform: uppercase;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url(../images/icons/phone-20.svg);
}

.inet-menu-fab a:hover {
    -webkit-box-shadow: 0 10px 20px rgba(92, 26, 35, 0.31);
    box-shadow: 0 10px 20px rgba(92, 26, 35, 0.31);
}

.work-details {
    margin-top: 9rem;
}

.work-gallery {
    padding-top: 12rem;
    padding-bottom: 12rem;
    background-color: var(--primary-light);
    position: relative;
}

.work-features {
    padding-top: 12rem;
    padding-bottom: 12rem;
    background-color: var(--primary-light);
    position: relative;
}

.work-features-content {
    margin-top: 3rem;
    margin-bottom: 3rem;
}

.work-features .work-features-content p {
    font-family: var(--font-sans);
}

.more-work {
    padding-top: 12rem;
    padding-bottom: 12rem;
    background-color: var(--primary-grey);
    position: relative;
}

.more-work-content .showcase-solution:first-child {
    /* margin-top: 4rem; */
}


/* lukslofts work */
#lukslofts-parallax {
    height: 100vh;
    padding-top: 6.6rem;
    padding-bottom: 5.4rem;
    color: rgba(255, 255, 255, 0.5);
    background-color: #000000;
    background-image: url(../assets/img/workspace/lukslofts/CTV_7641.png);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    overflow: hidden;
    position: relative;
}

#lukslofts-parallax::before {
    content: "";
    display: block;
    background-color: #0E314F;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .6;
}

.work-hero .display-1 {
    margin: 0;
}

/* digibutler work */
#digibutler-parallax {
    height: 100vh;
    padding-top: 6.6rem;
    padding-bottom: 5.4rem;
    color: rgba(255, 255, 255, 0.5);
    background-color: #000000;
    background-image: url(../assets/img/workspace/digibutler/JLB_7034.jpg);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    overflow: hidden;
    position: relative;
}

#digibutler-parallax::before {
    content: "";
    display: block;
    background-color: #0E314F;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .6;
}

/* zumumu work */
#zumumu-parallax {
    height: 100vh;
    padding-top: 6.6rem;
    padding-bottom: 5.4rem;
    color: rgba(255, 255, 255, 0.5);
    background-color: #000000;
    background-image: url(../assets/img/workspace/zumumu/zumumu-workspace-04.jpg);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    overflow: hidden;
    position: relative;
}

#zumumu-parallax::before {
    content: "";
    display: block;
    background-color: #0E314F;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .6;
}

/* egrub work */
#egrub-parallax {
    height: 100vh;
    padding-top: 6.6rem;
    padding-bottom: 5.4rem;
    color: rgba(255, 255, 255, 0.5);
    background-color: #000000;
    background-image: url(../assets/img/workspace/egrub/new_vid.00_00_29_24.Still004.jpg);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    overflow: hidden;
    position: relative;
}

#egrub-parallax::before {
    content: "";
    display: block;
    background-color: #0E314F;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .6;
}

/* share work */
#share-parallax {
    height: 100vh;
    padding-top: 6.6rem;
    padding-bottom: 5.4rem;
    color: rgba(255, 255, 255, 0.5);
    background-color: #000000;
    background-image: url(../assets/img/workspace/share/share-workspace-01.jpg);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    overflow: hidden;
    position: relative;
}

#share-parallax::before {
    content: "";
    display: block;
    background-color: #0E314F;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .6;
}

/* share events work */
#events-parallax {
    height: 100vh;
    padding-top: 6.6rem;
    padding-bottom: 5.4rem;
    color: rgba(255, 255, 255, 0.5);
    background-color: #000000;
    background-image: url(../assets/img/workspace/share-events/CTV_4230.jpg);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    overflow: hidden;
    position: relative;
}

#events-parallax::before {
    content: "";
    display: block;
    background-color: #0E314F;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .6;
}

/* integranet work */
#integranet-parallax {
    height: 100vh;
    padding-top: 6.6rem;
    padding-bottom: 5.4rem;
    color: rgba(255, 255, 255, 0.5);
    background-color: #000000;
    background-image: url(../assets/img/workspace/integranet/JLB_2636.jpg);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    overflow: hidden;
    position: relative;
}

#integranet-parallax::before {
    content: "";
    display: block;
    background-color: #0E314F;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .1;
}

#integranet-features.work-features {
    padding-bottom: 1rem;
}

#integranet-features .work-features-content {
    text-align: center;
}

#integranet-features .work-features-content img {
    width: 128px;
    height: 128px;
}

/* bpo work */
#bpo-parallax {
    height: 100vh;
    padding-top: 6.6rem;
    padding-bottom: 5.4rem;
    color: rgba(255, 255, 255, 0.5);
    background-color: #000000;
    background-image: url(../assets/img/workspace/bpo/CTV_4571.jpg);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    overflow: hidden;
    position: relative;
}

#bpo-parallax::before {
    content: "";
    display: block;
    background-color: #0E314F;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .6;
}

#bpo-features.work-features {
    padding-bottom: 1rem;
}

#bpo-features .work-features-content {
    /* text-align: center; */
}

#bpo-features .work-features-content img {
    width: 90px;
    height: 90px;
}

#bpo-features .work-features-content h4 {
    margin-top: 2.5rem;
    margin-bottom: 1rem;
}

#bpo-features .work-features-content p {
    font-family: var(--font-sans);
    font-size: 2rem;
}

/* pbx work */
#pbx-parallax {
    height: 100vh;
    padding-top: 6.6rem;
    padding-bottom: 5.4rem;
    color: rgba(255, 255, 255, 0.5);
    background-color: #000000;
    background-image: url(../assets/img/workspace/pbx/pbx-workspace-03.jpg);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    overflow: hidden;
    position: relative;
}

#pbx-parallax::before {
    content: "";
    display: block;
    background-color: #0E314F;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .6;
}

.pbx-faq p {
    font-family: var(--font-sans);
    font-size: 2.4rem;
}

/* pci work */
#pci-parallax {
    height: 100vh;
    padding-top: 6.6rem;
    padding-bottom: 5.4rem;
    color: rgba(255, 255, 255, 0.5);
    background-color: #000000;
    background-image: url(../assets/img/workspace/pci/pci-workspace-03.jpg);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    overflow: hidden;
    position: relative;
}

#pci-parallax::before {
    content: "";
    display: block;
    background-color: #0E314F;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .6;
}

#pci-features.work-features {
    padding-bottom: 1rem;
}

#pci-features .work-features-content {
    /* text-align: center; */
}

#pci-features .work-features-content img {
    width: 90px;
    height: 90px;
}

#pci-features .work-features-content h4 {
    margin-top: 2.5rem;
    margin-bottom: 1rem;
}

#pci-features .work-features-content p {
    font-family: var(--font-sans);
    font-size: 2rem;
}

/* hrms work */

#hrms-parallax {
    height: 100vh;
    padding-top: 6.6rem;
    padding-bottom: 5.4rem;
    color: rgba(255, 255, 255, 0.5);
    background-color: #000000;
    background-image: url(../assets/img/workspace/hrms/hrms-workspace-01.jpg);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    overflow: hidden;
    position: relative;
}

#hrms-parallax::before {
    content: "";
    display: block;
    background-color: #0E314F;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .6;
}

#hrms-features.work-features {
    padding-bottom: 1rem;
}

#hrms-features .work-features-content {
    text-align: center;
}

#hrms-features .work-features-content img {
    width: 90px;
    height: 90px;
}

#hrms-features .work-features-content h4 {
    margin-top: 2.5rem;
    margin-bottom: 1rem;
}

#hrms-features .work-features-content p {
    font-family: var(--font-sans);
    font-size: 2rem;
}

.hrms-faq {
    margin-top: 5rem;
    margin-bottom: 5rem;
}

.hrms-faq p {
    font-family: var(--font-sans);
    font-size: 2.4rem;
}

/* altin work */
#altin-parallax {
    height: 100vh;
    padding-top: 6.6rem;
    padding-bottom: 5.4rem;
    color: rgba(255, 255, 255, 0.5);
    background-color: #000000;
    background-image: url(../assets/img/workspace/altin/altin-workspace-01.jpg);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    overflow: hidden;
    position: relative;
}

#altin-parallax::before {
    content: "";
    display: block;
    background-color: #0E314F;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .6;
}


/* Services Page */
#services-stats {
    /* height: 100vh; */
    padding-top: 6.6rem;
    padding-bottom: 5.4rem;
    color: rgba(255, 255, 255, 0.5);
    background-color: #000000;
    background-image: url(../assets/img/workspace/buildings/CTV_4787.jpg);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    overflow: hidden;
    position: relative;
}

#services-stats::before {
    content: "";
    display: block;
    background-color: #0E314F;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .6;
}

.item-service p {
    font-family: var(--font-sans);
}

.services-list-section {}

.services-list-card {
    text-align: center;
}

.services-list-card p {
    font-family: var(--font-sans);
    color: var(--primary-dark);
}

.services-list-wrap h2 {
    font-family: var(--font-sans);
    font-weight: 400;
    color: var(--primary-dark);
}

[class="services-list-icon"] {
    width: 40px;
    position: relative;
    float: left;
    margin-right: 10px;
}

#company-approach.inet-parallax {
    padding-top: 18rem;
    padding-bottom: 18rem;
    background-color: #0E314F;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url(../assets/img/parallax/contact-01.jpg);
    background-size: cover;
    position: relative;
    color: rgba(255, 255, 255, 0.5);
}

#company-approach.inet-parallax::before {
    display: block;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #f5f5f5;
    opacity: .75;
}

#company-approach .item-service>p {
    font-family: var(--font-sans);
    color: var(--primary-dark);
}

/* About Page */
.inet-about .header-nav-wrap .header-nav li>a {
    color: var(--primary-dark);
}

.inet-about .header-nav-wrap.mobile ul.header-nav li>a {
    color: var(--primary-light);
}

.inet-about .header-nav-wrap .header-nav li:hover>a {
    color: var(--primary-red);
}

.inet-about .header-nav-wrap.mobile+.header-menu-toggle::before {
    display: inline-block;
    content: "Menu";
    height: 42px;
    left: auto;
    text-align: right;
    padding-left: 15px;
    padding-right: 10px;
    position: absolute;
    top: 0;
    right: 100%;
    color: var(--primary-dark);
}

.inet-about .header-menu-toggle span {
    display: block;
    width: 24px;
    height: 2px;
    margin-top: -1px;
    position: absolute;
    left: 9px;
    top: 50%;
    right: auto;
    bottom: auto;
    background-color: var(--primary-dark);
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    font: 0/0 a;
    text-shadow: none;
    color: transparent;
}

#about-hero.inet-parallax {
    padding-top: 18rem;
    padding-bottom: 18rem;
    background-color: #0E314F;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url(../assets/img/workspace/buildings/CTV_4794.jpg);
    background-size: cover;
    position: relative;
    color: rgba(255, 255, 255, 0.5);
}

#about-hero.inet-parallax::before {
    display: block;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #f5f5f5;
    opacity: .9;
}

#about-parallax {
    height: 100vh;
    padding-top: 6.6rem;
    padding-bottom: 5.4rem;
    color: rgba(255, 255, 255, 0.5);
    background-color: #000000;
    background-image: url(../assets/img/workspace/buildings/CTV_4767.png);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    overflow: hidden;
    position: relative;
}

#about-parallax::before {
    content: "";
    display: block;
    background-color: #0E314F;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .3;
}

.s-statement {
    padding-top: 12rem;
    padding-bottom: 12rem;
    background-color: var(--primary-grey);
    position: relative;
}

#company-history.inet-parallax {
    padding-top: 18rem;
    padding-bottom: 18rem;
    background-color: #0E314F;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url(../assets/img/parallax/contact-01.jpg);
    background-size: cover;
    position: relative;
    color: rgba(255, 255, 255, 0.5);
}

#company-history.inet-parallax::before {
    display: block;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #f5f5f5;
    opacity: .9;
}

#company-values.inet-parallax {
    padding-top: 18rem;
    padding-bottom: 18rem;
    background-color: #0E314F;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url(../assets/img/parallax/core.png);
    background-size: cover;
    position: relative;
    color: rgba(255, 255, 255, 0.5);
}

#company-values.inet-parallax::before {
    display: block;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #f5f5f5;
    opacity: .9;
}

#company-values .item-service>p {
    color: var(--primary-grey-dark);
}

#company-awards.inet-parallax {
    padding-top: 18rem;
    padding-bottom: 18rem;
    background-color: #0E314F;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url(../assets/img/workspace/buildings/CTV_4742.png);
    background-size: cover;
    position: relative;
    color: rgba(255, 255, 255, 0.5);
}

#company-awards.inet-parallax::before {
    display: block;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #0E314F;
    opacity: .9;
}

.inet-services-list {
    font-family: var(--font-sans);
    font-size: 2rem;
    color: var(--primary-grey-dark);
}

.inet-services-list li>i {
    font-size: .8rem;
    color: var(--primary-red);
}

.about-text-carousel div {
    display: inline;
    font-family: var(--font-sans);
    font-size: 16px;
    color: var(--primary-dark);
    margin: 12px;
}

.about-text-carousel a {
    font-family: var(--font-sans);
    font-weight: 500;
}

#company-history span.timeline-year {
    display: block;
    font-family: var(--font-sans);
    font-size: 32px;
    font-weight: 500;
    background: var(--primary-red);
    color: var(--primary-light);
    padding: 10px;
    width: 120px;
    text-align: center;
    margin-bottom: 2rem;
}

a.timeline-next {
    font-family: var(--font-sans);
    font-size: 16px;
    font-weight: 400;
    background: var(--primary-dark);
    color: var(--primary-light);
    padding: 5px;
    text-align: center;
    text-transform: uppercase;
}

a.timeline-next:hover {
    background: var(--primary-grey-dark);
}

.iso-cert-img:hover {
    -webkit-box-shadow: 0px 13px 10px -10px rgba(233, 228, 230, 0.75);
    -moz-box-shadow: 0px 13px 10px -10px rgba(233, 228, 230, 0.75);
    box-shadow: 0px 13px 10px -10px rgba(233, 228, 230, 0.75);
}

/* Contact Page */
.inet-contact .header-nav-wrap .header-nav li>a {
    color: var(--primary-dark);
}

.inet-contact .header-nav-wrap.mobile ul.header-nav li>a {
    color: var(--primary-light);
}

.inet-contact .header-nav-wrap .header-nav li:hover>a {
    color: var(--primary-red);
}

.inet-contact .header-nav-wrap.mobile+.header-menu-toggle::before {
    display: inline-block;
    content: "Menu";
    height: 42px;
    left: auto;
    text-align: right;
    padding-left: 15px;
    padding-right: 10px;
    position: absolute;
    top: 0;
    right: 100%;
    color: var(--primary-dark);
}

.inet-contact .header-menu-toggle span {
    display: block;
    width: 24px;
    height: 2px;
    margin-top: -1px;
    position: absolute;
    left: 9px;
    top: 50%;
    right: auto;
    bottom: auto;
    background-color: var(--primary-dark);
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    font: 0/0 a;
    text-shadow: none;
    color: transparent;
}

.s-contact-form {
    padding-top: 18rem;
    padding-bottom: 6rem;
    background-color: #FFFFFF;
    position: relative;
}

.inet-contact-form input,
.inet-contact-form textarea {
    width: 100%;
}

.inet-contact-message {
    display: none;
    text-align: center;
}

.inet-contact-message img {
    margin-top: 2.5rem;
}

.contact-add-info {
    padding-top: 12rem;
    padding-bottom: 12rem;
    background-color: var(--primary-grey);
    position: relative;
}

.contact-add-info p {
    font-weight: 400;
}

.contact-add-info a {
    color: var(--primary-dark);
    font-weight: 500;
}

.contact-add-info a:hover {
    color: var(--primary-red);
}

.contact-add-social a {
    display: block;
}

.inet-contact .s-contact {
    padding-top: 0;
}

.contact-alert {
    font-family: var(--font-sans), sans-serif;
    font-size: 2rem;
    font-weight: 500;
    color: var(--primary-light) !important;
    background: orange;
    padding: 1.5rem 2.4rem;
    margin-bottom: 3rem;
}

/* Career Page */
.inet-careers .header-nav-wrap .header-nav li>a {
    color: var(--primary-dark);
}

.inet-careers .header-nav-wrap.mobile ul.header-nav li>a {
    color: var(--primary-light);
}

.inet-careers .header-nav-wrap.mobile ul.header-nav li:hover>a {
    color: var(--primary-red);
}

.inet-careers .header-nav-wrap .header-nav li:hover>a {
    color: var(--primary-red);
}

.inet-careers .header-nav-wrap.mobile+.header-menu-toggle::before {
    display: inline-block;
    content: "Menu";
    height: 42px;
    left: auto;
    text-align: right;
    padding-left: 15px;
    padding-right: 10px;
    position: absolute;
    top: 0;
    right: 100%;
    color: var(--primary-dark);
}

.inet-careers .header-menu-toggle span {
    display: block;
    width: 24px;
    height: 2px;
    margin-top: -1px;
    position: absolute;
    left: 9px;
    top: 50%;
    right: auto;
    bottom: auto;
    background-color: var(--primary-dark);
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    font: 0/0 a;
    text-shadow: none;
    color: transparent;
}

#careers-parallax {
    height: 100vh;
    padding-top: 6.6rem;
    padding-bottom: 5.4rem;
    color: rgba(255, 255, 255, 0.5);
    background-color: #000000;
    background-image: url(../assets/img/workspace/careers/careers-bg-01.jpg);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    overflow: hidden;
    position: relative;
}

#careers-parallax::before {
    content: "";
    display: block;
    background-color: #0E314F;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .6;
}

.career-showcase {
    /* background: var(--primary-light);
    margin-top: 6rem;
    padding: 4rem; */
    padding-left: 5rem;
    padding-right: 5rem;
    padding-top: 12rem;
    padding-bottom: 12rem;
    background-color: var(--primary-light);
    position: relative;
}

.career-card {
    padding: 3rem;
}

.career-card img {
    width: 100%;
    border-radius: 5px;
    transition: transform .2s;
}

.career-statement {
    padding-top: 12rem;
    padding-bottom: 12rem;
    background-color: var(--primary-dark);
    position: relative;
}

.career-card img:hover {
    /* transform: scale(1.05); */
    transform: translate(5px, -5px);
    -webkit-box-shadow: 0 10px 20px rgba(92, 26, 35, 0.31);
    box-shadow: 0 10px 20px rgba(182, 182, 182, 0.31);
}

/* Application Page */
.inet-application .header-nav-wrap .header-nav li>a {
    color: var(--primary-dark);
}

.inet-application .header-nav-wrap.mobile ul.header-nav li>a {
    color: var(--primary-light);
}

.inet-application .header-nav-wrap.mobile ul.header-nav li:hover>a {
    color: var(--primary-red);
}

.inet-application .header-nav-wrap .header-nav li:hover>a {
    color: var(--primary-red);
}

.inet-application .header-nav-wrap.mobile+.header-menu-toggle::before {
    display: inline-block;
    content: "Menu";
    height: 42px;
    left: auto;
    text-align: right;
    padding-left: 15px;
    padding-right: 10px;
    position: absolute;
    top: 0;
    right: 100%;
    color: var(--primary-dark);
}

.inet-application .header-menu-toggle span {
    display: block;
    width: 24px;
    height: 2px;
    margin-top: -1px;
    position: absolute;
    left: 9px;
    top: 50%;
    right: auto;
    bottom: auto;
    background-color: var(--primary-dark);
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    font: 0/0 a;
    text-shadow: none;
    color: transparent;
}

.s-apply {
    padding-top: 12rem;
    padding-bottom: 12rem;
    background-color: var(--primary-grey);
}

.inet-application-form input,
.inet-application-form textarea {
    width: 100%;
}

.inet-application-form textarea {
    height: 2rem;
}

.inet-application .s-contact {
    padding-top: 0;
}

/* Insights Page */
.inet-insights .header-nav-wrap .header-nav li>a {
    color: var(--primary-dark);
}

.inet-insights .header-nav-wrap.mobile ul.header-nav li>a {
    color: var(--primary-light);
}

.inet-insights .header-nav-wrap.mobile ul.header-nav li:hover>a {
    color: var(--primary-red);
}

.inet-insights .header-nav-wrap .header-nav li:hover>a {
    color: var(--primary-red);
}

.inet-insights .header-nav-wrap.mobile+.header-menu-toggle::before {
    display: inline-block;
    content: "Menu";
    height: 42px;
    left: auto;
    text-align: right;
    padding-left: 15px;
    padding-right: 10px;
    position: absolute;
    top: 0;
    right: 100%;
    color: var(--primary-dark);
}

.inet-insights .header-menu-toggle span {
    display: block;
    width: 24px;
    height: 2px;
    margin-top: -1px;
    position: absolute;
    left: 9px;
    top: 50%;
    right: auto;
    bottom: auto;
    background-color: var(--primary-dark);
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    font: 0/0 a;
    text-shadow: none;
    color: transparent;
}

.insights-list {
    margin-top: 7.8rem;
    counter-reset: ctr;
    position: relative;
}

.insights-list-soon p {
    font-family: var(--font-sans);
    font-size: 2rem;
    font-weight: 300;
    color: var(--primary-dark);
}

.insights-list-soon img {
    width: 300px;
    margin-top: 3rem;
}

.insights-list .insights-item {
    padding: 3rem;
}

.insights-image img {
    border-radius: 3px;
}

.insights-tags {
    margin-top: 1.5rem;
}

.insights-tags span {
    font-family: var(--font-main);
    font-size: 1.3rem;
    font-weight: 400;
    color: var(--primary-red);
    background: rgba(240, 81, 81, 0.35);
    border-radius: 3px;
    padding: 0.55rem 1.05rem;
}

.insights-text .insights-title {
    font-family: var(--font-main);
    font-weight: 600;
}

.insights-text .insights-description {
    font-family: var(--font-sans);
    color: var(--primary-dark);
}

.insights-item span {
    font-family: var(--font-sans);
}

/* Articles Page */
.inet-article .header-nav-wrap .header-nav li>a {
    color: var(--primary-dark);
}

.inet-article .header-nav-wrap.mobile ul.header-nav li>a {
    color: var(--primary-light);
}

.inet-article .header-nav-wrap.mobile ul.header-nav li:hover>a {
    color: var(--primary-red);
}

.inet-article .header-nav-wrap .header-nav li:hover>a {
    color: var(--primary-red);
}

.inet-article .header-nav-wrap.mobile+.header-menu-toggle::before {
    display: inline-block;
    content: "Menu";
    height: 42px;
    left: auto;
    text-align: right;
    padding-left: 15px;
    padding-right: 10px;
    position: absolute;
    top: 0;
    right: 100%;
    color: var(--primary-dark);
}

.inet-article .header-menu-toggle span {
    display: block;
    width: 24px;
    height: 2px;
    margin-top: -1px;
    position: absolute;
    left: 9px;
    top: 50%;
    right: auto;
    bottom: auto;
    background-color: var(--primary-dark);
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    font: 0/0 a;
    text-shadow: none;
    color: transparent;
}

.s-article-parallax {
    padding-top: 18rem;
    padding-bottom: 18rem;
    background-color: #f5f5f5;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url(../assets/img/insights/insight-01.jpg);
    background-size: cover;
    position: relative;
    color: rgba(255, 255, 255, 0.8);
}

.s-article-parallax::before {
    display: block;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #f5f5f5;
    opacity: .8;
}

#article-section.s-works {
    padding-top: 5rem;
}

span.article-tags {
    font-family: var(--font-main);
    font-size: 1.3rem;
    font-weight: 400;
    color: var(--primary-red);
    background: rgba(240, 81, 81, 0.35);
    border-radius: 3px;
    padding: 0.55rem 1.05rem;
}

.article-content {
    margin-top: 9rem;
}

.more-article {
    padding-top: 12rem;
    padding-bottom: 12rem;
    background-color: var(--primary-grey);
    position: relative;
}


/* Gallery Page */
.inet-gallery .header-nav-wrap .header-nav li>a {
    color: var(--primary-dark);
}

.inet-gallery .header-nav-wrap.mobile ul.header-nav li>a {
    color: var(--primary-light);
}

.inet-gallery .header-nav-wrap.mobile ul.header-nav li:hover>a {
    color: var(--primary-red);
}

.inet-gallery .header-nav-wrap .header-nav li:hover>a {
    color: var(--primary-red);
}

.inet-gallery .header-nav-wrap.mobile+.header-menu-toggle::before {
    display: inline-block;
    content: "Menu";
    height: 42px;
    left: auto;
    text-align: right;
    padding-left: 15px;
    padding-right: 10px;
    position: absolute;
    top: 0;
    right: 100%;
    color: var(--primary-dark);
}

.inet-gallery .header-menu-toggle span {
    display: block;
    width: 24px;
    height: 2px;
    margin-top: -1px;
    position: absolute;
    left: 9px;
    top: 50%;
    right: auto;
    bottom: auto;
    background-color: var(--primary-dark);
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    font: 0/0 a;
    text-shadow: none;
    color: transparent;
}

.gallery-list {
    margin-top: 4rem;
    counter-reset: ctr;
    position: relative;
}

.gallery-item {
    padding: 3rem;
}

.gallery-image img {
    border-radius: 5px;
}

.gallery-text {
    font-family: var(--font-main);
    font-size: 2rem;
    font-weight: 600;
    color: var(--primary-dark);
    transition: transform .2s;
}

.gallery-image:hover+.gallery-text {
    transform: translate(8px, -36px);
    color: var(--primary-red);
}

.gallery-image:hover>img {
    /* transform: translate(5px, -5px); */
    -webkit-box-shadow: 0 10px 20px rgba(92, 26, 35, 0.31);
    box-shadow: 0 10px 20px rgba(92, 26, 35, 0.31);
}

/* Error Page */
.inet-error .header-nav-wrap .header-nav li>a {
    color: var(--primary-dark);
}

.inet-error .header-nav-wrap.mobile ul.header-nav li>a {
    color: var(--primary-light);
}

.inet-error .header-nav-wrap.mobile ul.header-nav li:hover>a {
    color: var(--primary-red);
}

.inet-error .header-nav-wrap .header-nav li:hover>a {
    color: var(--primary-red);
}

.inet-error .header-nav-wrap.mobile+.header-menu-toggle::before {
    display: inline-block;
    content: "Menu";
    height: 42px;
    left: auto;
    text-align: right;
    padding-left: 15px;
    padding-right: 10px;
    position: absolute;
    top: 0;
    right: 100%;
    color: var(--primary-dark);
}

.inet-error .header-menu-toggle span {
    display: block;
    width: 24px;
    height: 2px;
    margin-top: -1px;
    position: absolute;
    left: 9px;
    top: 50%;
    right: auto;
    bottom: auto;
    background-color: var(--primary-dark);
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    font: 0/0 a;
    text-shadow: none;
    color: transparent;
}

/* Active Projects */
.project-wrapper {
    background-color: #FFFFFF;
    border-radius: 5px;
    padding: 3rem;
}

.project-ordered-list {
    margin: 0;
    padding: 0;
    list-style-type: none;
    counter-reset: li;
}

.project-ordered-list li {
    /* counter-increment: step-counter; */
    color: var(--primary-dark);
    font-family: var(--font-sans);
    font-size: 3rem;
    font-weight: 500;
    margin-bottom: 4rem;
    display: table-row;
}

.project-ordered-list li::before {
    counter-increment: li;
    content: counter(li, decimal-leading-zero);
    color: var(--primary-red-light);
    font-family: var(--font-sans);
    font-size: 2rem;
    font-weight: 500;
    margin-right: 4rem;
    padding: 1rem 3rem 1rem 1rem;
    display: table-cell;
}

.project-ordered-list a {
    color: var(--primary-dark);
}

.project-ordered-list a:hover {
    color: var(--primary-red);
}

/* Case Studies */

/* Pages Parallax */

/* SEO */
.seo-section {
    opacity: 0;
    max-height: 1px;
    overflow: hidden;
}

.seo-section h1 {
    font-size: 8px;
}

/* Dev Guide */
.dev-guide-box {
    background-color: var(--primary-grey-light);
    margin-bottom: 4rem;
    padding: 7rem 5rem;
    transition: all 0.3s ease-in-out;
}

.dev-guide-box:hover {
    background-color: #E50914;
    color: var(--primary-light);
    transform: translateY(-5px);
    -webkit-box-shadow: var(--shadow-main);
    -moz-box-shadow: var(--shadow-main);
    box-shadow: var(--shadow-main);
}

.dev-guide-box:hover * {
    color: var(--primary-light);
}

.inet-directory .header-nav-wrap h5 {
    margin-top: 2.5rem;
}

.directory-list .col-block a {
    color: #1F1E1D;
}

.directory-list--block {
    min-height: 280px;
    margin: 0 0 4rem;
    padding: 2rem;
    border: 1px solid rgba(0, 0, 0, .05);
    border-radius: 8px;
    background-color: #fff;
    box-shadow: 0 10px 40px -10px rgb(0 0 0 / 10%);
    cursor: pointer;
    transition: all .2s ease-in-out;
}

.directory-list--block:hover {
    box-shadow: 0 10px 40px -10px rgb(0 0 0 / 18%);
    transform: translateY(-5px);
}

.directory-list--block img {
    width: 64px;
}

.directory-list--block h2 {
    font-weight: 400;
}

span.external-link {
    display: none;
    font-size: 1.75rem;
    transition: all .2s ease-in-out;
}

.directory-list--block:hover span.external-link {
    display: inline-block;
}

.guides-category {
    list-style: none;
}

.guides-category li {
    font-family: 'Cera Pro', sans-serif;
    font-size: 3rem;
    background-color: #e0e0e0;
    display: inline-block;
    border-radius: 50px;
    margin-right: 2rem;
    margin-bottom: 2rem;
    padding: 1rem 2.5rem;
}

.guides-category li a {
    color: #fff;
}

.tr-list .col-block a {
    color: #000;
}

.tr-list--block {
    color: #000;
    min-height: 260px;
    margin: 0 0 4rem;
    padding: 2rem;
    border: 1px solid rgba(0, 0, 0, .05);
    border-radius: 8px;
    background-color: #fff;
    box-shadow: 0 10px 40px -10px rgb(0 0 0 / 10%);
    cursor: pointer;
    transition: all .2s ease-in-out;
}

.tr-list--block:hover {
    box-shadow: 0 10px 40px -10px rgb(0 0 0 / 18%);
    transform: translateY(-5px);
}

.tr-list--block:hover span.external-link {
    display: inline-block;
}

.tr-list--category {
    display: inline-block;
    font-size: 1.25rem;
    font-weight: 500;
    text-transform: uppercase;
    color: #fff;
    background-color: #999999;
    border-radius: 50px;
    padding: .5rem 1rem;
}

#logo .tr-list .tr-list--block .tr-list--category {
    color: #F44336;
    background-color: #eecfcc;
}

#colors .tr-list .tr-list--block .tr-list--category {
    color: #E27216;
    background-color: #f8efe8;
}

#typography .tr-list .tr-list--block .tr-list--category {
    color: #E91E63;
    background-color: #e4ced5;
}

#iconography .tr-list .tr-list--block .tr-list--category {
    color: #9C27B0;
    background-color: #e8d1ec;
}

#illustrations .tr-list .tr-list--block .tr-list--category {
    color: #3F51B5;
    background-color: #c1c5dd;
}

#photos .tr-list .tr-list--block .tr-list--category {
    color: #2196F3;
    background-color: #b3d4f0;
}

#videos .tr-list .tr-list--block .tr-list--category {
    color: #00BCD4;
    background-color: #cde4e7;
}

#backgrounds .tr-list .tr-list--block .tr-list--category {
    color: #4CAF50;
    background-color: #cdf0ce;
}

/* strikeout */
s,
strike {
    text-decoration: none;
    position: relative;
}

s::before,
strike::before {
    top: 50%;
    /*tweak this to adjust the vertical position if it's off a bit due to your font family */
    background: #E50914;
    /*this is the color of the line*/
    opacity: .7;
    content: '';
    width: 110%;
    position: absolute;
    height: .1em;
    border-radius: .1em;
    left: -5%;
    white-space: nowrap;
    display: block;
    transform: rotate(-15deg);
}

s.straight::before,
strike.straight::before {
    transform: rotate(0deg);
    left: -1%;
    width: 102%;
}


.dropdown-content {
    display: none;
    position: absolute;
    background-color: var(--primary-red);
    color: var(--primary-light);
    min-width: 175px;
    border-radius: 5px;
    -webkit-box-shadow: var(--shadow-dark);
    -moz-box-shadow: var(--shadow-dark);
    box-shadow: var(--shadow-dark);
    z-index: 1;
}

.dropdown-content a {
    display: block;
    color: var(--primary-light) !important;
    padding: 12px 16px;
    text-decoration: none;
    text-align: left;
    line-height: 2rem !important;
}

.dropdown-content a:first-child {
    border-radius: 4px 4px 0 0;
}

.dropdown-content a:last-child {
    border-radius: 0 0 4px 4px;
}

.dropdown-content a:hover {
    background-color: var(--primary-grey-light);
    color: var(--primary-dark) !important;
    border-color: var(--primary-main);
}

.dropdown:hover .dropdown-content {
    display: block;
}

@media only screen and (max-width:400px) {
    .dropdown-content.long-content {
        height: 240px;
        overflow: auto;
    }

    .dropdown-content a {
        line-height: 2rem !important;
    }
}

.dropdown-content.dropdown-with-icon img {
    width: 16px;
}

/* form */

.inet-contact-form {
    width: 100%;
    max-width: 760px;
}

.contactForm {
    width: 100%;
}

/* Section */

.form-section {
    margin-bottom: 28px;
}

.form-section-title {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 16px;
}

.form-section-title > span {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 30px;
    height: 30px;

    flex-shrink: 0;

    border-radius: 50%;
    background: #eaf8fc;
    color: #45aeca;

    font-size: 11px;
    font-weight: 600;
}

.form-section-title h4 {
    margin: 0 0 3px;
    font-size: 17px;
    font-weight: 600;
    color: #111;
}

.form-section-title p {
    margin: 0;
    font-size: 12px;
    color: #888;
}


/* Two-column grid */

.form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 16px;
}


/* Fields */

.form-field {
    width: 100%;
}

.form-field.full-width {
    grid-column: 1 / -1;
}

.form-field label {
    display: block;

    margin-bottom: 6px;

    font-size: 11px;
    font-weight: 600;
    color: #555;
}

.form-field input,
.form-field select,
.form-field textarea {
    width: 100%;
    box-sizing: border-box;

    border: 1px solid #e1e1e1;
    border-radius: 3px;

    background: #fafafa;

    color: #333;

    font-family: inherit;
    font-size: 13px;

    transition:
        border-color .2s ease,
        background .2s ease,
        box-shadow .2s ease;
}

.form-field input,
.form-field select {
    height: 43px;
    padding: 0 13px;
}

.form-field textarea {
    min-height: 100px;
    padding: 12px 13px;
    resize: vertical;
}

.form-field input::placeholder,
.form-field textarea::placeholder {
    color: #aaa;
}

.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus {
    outline: none;

    border-color: #55b5d2;
    background: #fff;

    box-shadow: 0 0 0 3px rgba(85,181,210,.10);
}


/* Submit */

.form-submit {
    display: flex;
    align-items: center;
    gap: 15px;

    margin-top: 5px;
}

.form-submit button {
    border: 0;
    cursor: pointer;
}

.form-submit small {
    font-size: 11px;
    color: #999;
}


/* =========================================
   MOBILE
========================================= */

@media only screen and (max-width: 767px) {

    .inet-contact-form {
        max-width: 100%;
    }

    .form-grid {
        grid-template-columns: 1fr;
        gap: 13px;
    }

    .form-field.full-width {
        grid-column: auto;
    }

    .form-section {
        margin-bottom: 25px;
    }

    .form-submit {
        flex-direction: column;
        align-items: flex-start;
    }

}


/* =========================================================
   INDUSTRIES
========================================================= */

.s-industries {
    position: relative;
    padding: 140px 0 130px;
    background: #f4f7f9;
    overflow: hidden;
}


/* Header
--------------------------------------------------------- */

.industries-header {
    margin-bottom: 70px;
}

.industries-number {
    margin: 0 0 20px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 3px;
    color: #1769aa;
}

.industries-eyebrow {
    display: block;
    margin-bottom: 18px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2.5px;
    text-transform: uppercase;
    color: #1769aa;
}

.industries-heading {
    max-width: 850px;
    margin: 0 0 25px;
    font-size: clamp(38px, 5vw, 64px);
    line-height: 1.08;
    font-weight: 600;
    letter-spacing: -1.5px;
    color: #102a43;
}

.industries-heading span {
    display: block;
    color: #1769aa;
}

.industries-intro {
    max-width: 720px;
    margin: 0;
    font-size: 18px;
    line-height: 1.8;
    color: #526777;
}

.industries-intro strong {
    color: #102a43;
}


/* Industry Grid
--------------------------------------------------------- */

.industries-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1px;
    padding: 1px;
    background: #d9e2e8;
}


/* Industry Card
--------------------------------------------------------- */

.industries-card {
    display: flex;
    align-items: flex-start;
    gap: 25px;
    min-height: 180px;
    padding: 38px 35px;
    background: #ffffff;
    transition:
        transform 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease;
}

.industries-card:hover {
    position: relative;
    z-index: 2;
    background: #fafdff;
    transform: translateY(-3px);
    box-shadow: 0 15px 35px rgba(16, 42, 67, 0.08);
}


/* Icon
--------------------------------------------------------- */

.industries-icon {
    flex: 0 0 52px;
    width: 52px;
    height: 52px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid #d5e1e8;
    background: #f4f8fa;

    color: #1769aa;
    font-size: 20px;

    transition:
        background 0.3s ease,
        color 0.3s ease;
}

.industries-card:hover .industries-icon {
    background: #1769aa;
    color: #ffffff;
}


/* Card Content
--------------------------------------------------------- */

.industries-card-content h3 {
    margin: 2px 0 10px;

    font-size: 20px;
    line-height: 1.3;
    font-weight: 600;

    color: #102a43;
}

.industries-card-content p {
    max-width: 390px;
    margin: 0;

    font-size: 14px;
    line-height: 1.7;

    color: #687b89;
}


/* CTA
--------------------------------------------------------- */

.industries-cta {
    margin-top: 65px;
}

.industries-cta .col-full {
    text-align: center;
}

.industries-btn {
    display: inline-flex;
    align-items: center;
    gap: 18px;

    padding: 17px 30px;

    border: 1px solid #1769aa;
    background: #1769aa;

    color: #ffffff;

    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;

    text-decoration: none;

    transition:
        background 0.3s ease,
        border-color 0.3s ease,
        transform 0.3s ease;
}

.industries-btn i {
    font-size: 11px;
}

.industries-btn:hover {
    background: #102a43;
    border-color: #102a43;
    color: #ffffff;
    transform: translateY(-2px);
}


/* Responsive
--------------------------------------------------------- */

@media screen and (max-width: 900px) {

    .s-industries {
        padding: 100px 0;
    }

    .industries-header {
        margin-bottom: 50px;
    }

    .industries-grid {
        grid-template-columns: 1fr;
    }

    .industries-card {
        min-height: auto;
    }

}


@media screen and (max-width: 600px) {

    .s-industries {
        padding: 80px 0;
    }

    .industries-heading {
        font-size: 38px;
        letter-spacing: -0.8px;
    }

    .industries-intro {
        font-size: 16px;
        line-height: 1.7;
    }

    .industries-card {
        gap: 18px;
        padding: 28px 22px;
    }

    .industries-icon {
        flex-basis: 45px;
        width: 45px;
        height: 45px;
        font-size: 17px;
    }

    .industries-card-content h3 {
        font-size: 18px;
    }

    .industries-card-content p {
        font-size: 13px;
    }

    .industries-cta {
        margin-top: 45px;
    }

    .industries-btn {
        width: 100%;
        justify-content: center;
        padding: 16px 20px;
    }

}


/* =========================================================
   WHY V3 PACIFIC GLOBAL TRADING
   ========================================================= */

.s-why-v3 {
    padding-top: 16rem;
    padding-bottom: 14rem;
    position: relative;
}


/* ---------------------------------------------------------
   Main Heading
   --------------------------------------------------------- */

.why-v3-heading {
    max-width: 950px;
    margin-bottom: 0;
    line-height: 1.08;
}

.why-v3-heading span {
    display: block;
}


/* ---------------------------------------------------------
   Introduction
   --------------------------------------------------------- */

.why-v3-intro {
    margin-top: 7rem;
    padding-top: 5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.18);
}

.why-v3-title {
    margin: 0;
    font-size: 2.8rem;
    line-height: 1.25;
    font-weight: 500;
    letter-spacing: -0.02em;
    color: var(--primary-light)
}

.why-v3-text {
    max-width: 650px;
    margin: 0;
    font-size: 1.8rem;
    line-height: 1.7;
    color: rgba(255, 255, 255, 0.72);
}

.why-v3-text strong {
    color: #ffffff;
    font-weight: 600;
}


/* ---------------------------------------------------------
   What Sets V3 Apart
   --------------------------------------------------------- */

.why-v3-apart {
    margin-top: 9rem;
}

.why-v3-subtitle {
    margin: 0 0 3.5rem;
    font-size: 1.5rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #ffffff;
}


.why-v3-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.why-v3-list li {
    display: flex;
    align-items: center;
    gap: 2rem;

    min-height: 7rem;
    padding: 1.8rem 0;

    border-top: 1px solid rgba(255, 255, 255, 0.15);

    font-size: 1.7rem;
    line-height: 1.4;
    color: rgba(255, 255, 255, 0.85);

    transition: all 0.3s ease;
}

.why-v3-list li:last-child {
    border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}

.why-v3-list li:hover {
    padding-left: 1rem;
    color: #ffffff;
}


.why-v3-number {
    flex: 0 0 35px;

    font-size: 1.2rem;
    font-weight: 600;
    letter-spacing: 0.08em;

    color: rgba(255, 255, 255, 0.4);
}


/* ---------------------------------------------------------
   CTA
   --------------------------------------------------------- */

.why-v3-cta {
    margin-top: 6rem;
}

.why-v3-cta p {
    margin: 0;
}


/* ---------------------------------------------------------
   Tablet
   --------------------------------------------------------- */

@media only screen and (max-width: 1000px) {

    .s-why-v3 {
        padding-top: 12rem;
        padding-bottom: 10rem;
    }

    .why-v3-intro {
        margin-top: 5rem;
        padding-top: 4rem;
    }

    .why-v3-title {
        font-size: 2.4rem;
    }

    .why-v3-text {
        font-size: 1.6rem;
    }

    .why-v3-apart {
        margin-top: 7rem;
    }

}


/* ---------------------------------------------------------
   Mobile
   --------------------------------------------------------- */

@media only screen and (max-width: 700px) {

    .s-why-v3 {
        padding-top: 9rem;
        padding-bottom: 8rem;
    }

    .why-v3-heading {
        font-size: 4rem;
        line-height: 1.12;
    }

    .why-v3-heading span {
        display: inline;
    }


    .why-v3-intro {
        margin-top: 4rem;
        padding-top: 3rem;
    }

    .why-v3-title {
        margin-bottom: 2.5rem;
        font-size: 2.2rem;
    }

    .why-v3-text {
        font-size: 1.5rem;
        line-height: 1.7;
    }


    .why-v3-apart {
        margin-top: 6rem;
    }

    .why-v3-subtitle {
        margin-bottom: 2rem;
        font-size: 1.3rem;
    }


    .why-v3-list {
        margin-bottom: 0;
    }

    .why-v3-list li {
        min-height: auto;
        padding: 1.6rem 0;
        font-size: 1.5rem;
    }

    .why-v3-number {
        flex: 0 0 30px;
        font-size: 1.1rem;
    }


    .why-v3-cta {
        margin-top: 4rem;
    }

    .why-v3-cta .btn {
        width: 100%;
        text-align: center;
    }

}


/* ---------------------------------------------------------
   Small Mobile
   --------------------------------------------------------- */

@media only screen and (max-width: 400px) {

    .why-v3-heading {
        font-size: 3.5rem;
    }

    .why-v3-title {
        font-size: 2rem;
    }

    .why-v3-list li {
        font-size: 1.4rem;
    }

}



/* =========================================================
   CONTAINER SOLUTIONS
   ========================================================= */

.s-container-solutions {
    position: relative;
    background: #ffffff;
}


/* =========================================================
   HERO
   ========================================================= */

.container-solutions-hero {
    position: relative;
    min-height: 520px;

    display: flex;
    align-items: center;

    background-image: url("../assets/img/section/container-banner.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    overflow: hidden;
}


/* Blue overlay */

.container-solutions-overlay {
    position: absolute;
    inset: 0;
    
    background:
        linear-gradient(
            90deg,
            rgba(0, 58, 105, 0.98) 0%,
            rgba(0, 69, 120, 0.92) 32%,
            rgba(0, 79, 135, 0.65) 55%,
            rgba(0, 80, 135, 0.15) 100%
        );
}


/* Hero content */

.container-solutions-hero-content {
    position: relative;
    z-index: 2;
    padding-top: 4rem;
    padding-bottom: 4rem;
}


/* Section number */

.container-solutions-number {
    display: flex;
    align-items: center;
    gap: 1.5rem;

    margin-bottom: 2rem;

    font-size: 1.6rem;
    font-weight: 600;
    letter-spacing: 0.15em;

    color: #55b9f2;
}

.container-solutions-number::after {
    content: "";

    width: 40px;
    height: 1px;

    background: #55b9f2;
}


/* Main heading */

.container-solutions-heading {
    max-width: 850px;

    margin: 0 0 1.5rem;

    font-size: 6.5rem;
    line-height: 1;
    font-weight: 500;

    letter-spacing: -0.03em;

    color: #ffffff;
}

.container-solutions-heading span {
    color: #55b9f2;
}


/* Subheading */

.container-solutions-subheading {
    max-width: 750px;

    margin: 0 0 2.5rem;

    font-size: 1.8rem;
    line-height: 1.4;

    font-weight: 600;

    letter-spacing: 0.08em;
    text-transform: uppercase;

    color: #ffffff;
}


/* Description */

.container-solutions-description {
    max-width: 600px;

    margin: 0;

    font-size: 1.7rem;
    line-height: 1.7;

    color: rgba(255, 255, 255, 0.9);
}


/* =========================================================
   APPLICATIONS
   ========================================================= */

.container-solutions-applications {
    padding-top: 8rem;
    padding-bottom: 8rem;

    background: #ffffff;
}


/* Application title */

.container-solutions-section-title {
    display: flex;
    align-items: center;
    gap: 2rem;

    margin: 0 0 4rem;

    font-size: 1.7rem;
    font-weight: 600;

    letter-spacing: 0.15em;
    text-transform: uppercase;

    color: #064b7d;
}

.container-solutions-section-title span {
    display: block;

    width: 40px;
    height: 2px;

    background: #1688c9;
}


/* =========================================================
   APPLICATION LIST
   ========================================================= */

.container-solutions-list {
    display: grid;

    grid-template-columns: repeat(3, 1fr);

    column-gap: 3.5rem;
    row-gap: 3.5rem;
}


/* Individual application */

.container-solutions-item {
    display: flex;
    align-items: center;

    gap: 1.5rem;

    min-height: 55px;

    color: #064b7d;

    transition:
        transform 0.3s ease,
        color 0.3s ease;
}


/* Icon */

.container-solutions-item i {
    width: 35px;

    flex: 0 0 35px;

    font-size: 2.4rem;

    text-align: center;

    color: #064b7d;
}


/* Text */

.container-solutions-item span {
    font-size: 1.45rem;
    line-height: 1.5;

    color: #064b7d;
}


/* Hover */

.container-solutions-item:hover {
    transform: translateX(5px);
}

.container-solutions-item:hover i {
    color: #1688c9;
}

.container-solutions-item:hover span {
    color: #1688c9;
}


/* =========================================================
   IMAGE GALLERY
   ========================================================= */

.container-solutions-gallery {
    padding-left: 3rem;
}


.container-solutions-gallery-grid {
    display: grid;

    grid-template-columns: repeat(2, 1fr);

    gap: 1rem;
}


.container-solutions-image {
    position: relative;

    overflow: hidden;

    aspect-ratio: 1.45 / 1;

    background: #e8eef2;
}


.container-solutions-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition: transform 0.5s ease;
}


.container-solutions-image:hover img {
    transform: scale(1.05);
}


/* =========================================================
   CTA
   ========================================================= */

.container-solutions-cta {
    position: relative;

    min-height: 220px;

    display: flex;
    align-items: center;

    background-image: url("../assets/img/section/ocean.png");

    background-size: cover;
    background-position: center;

    overflow: hidden;
}


/* Dark blue overlay */

.container-solutions-cta-overlay {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(0, 58, 105, 0.9),
            rgba(0, 58, 105, 0.35)
        );
}


.container-solutions-cta .row {
    position: relative;
    z-index: 2;
}


/* CTA button */

.container-solutions-btn {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 2rem;

    min-width: 340px;

    padding: 1.5rem 2.5rem;

    border: 1px solid #ffffff;
    border-radius: 50px;

    background: transparent;

    color: #ffffff;

    font-size: 1.3rem;
    font-weight: 600;

    letter-spacing: 0.1em;
    text-transform: uppercase;

    transition:
        background 0.3s ease,
        color 0.3s ease;
}


.container-solutions-btn i {
    font-size: 1.5rem;

    transition: transform 0.3s ease;
}


.container-solutions-btn:hover {
    background: #ffffff;

    color: #064b7d;
}


.container-solutions-btn:hover i {
    transform: translateX(5px);
}


/* =========================================================
   TABLET
   ========================================================= */

@media only screen and (max-width: 1000px) {

    .container-solutions-hero {
        min-height: 480px;
    }

    .container-solutions-heading {
        font-size: 5.5rem;
    }

    .container-solutions-list {
        grid-template-columns: repeat(2, 1fr);
    }

    .container-solutions-gallery {
        padding-left: 2rem;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media only screen and (max-width: 700px) {

    .container-solutions-hero {
        min-height: 500px;

        background-position: 65% center;
    }


    .container-solutions-overlay {
        background:
            linear-gradient(
                90deg,
                rgba(0, 58, 105, 0.98),
                rgba(0, 65, 115, 0.85)
            );
    }


    .container-solutions-hero-content {
        padding-top: 3rem;
        padding-bottom: 3rem;
    }


    .container-solutions-number {
        font-size: 1.3rem;
    }


    .container-solutions-heading {
        font-size: 4rem;
        line-height: 1.05;
    }


    .container-solutions-heading span {
        display: block;
    }


    .container-solutions-subheading {
        font-size: 1.4rem;
        line-height: 1.5;

        margin-bottom: 2rem;
    }


    .container-solutions-description {
        font-size: 1.5rem;
        line-height: 1.65;
    }


    /* Applications */

    .container-solutions-applications {
        padding-top: 6rem;
        padding-bottom: 6rem;
    }


    .container-solutions-section-title {
        margin-bottom: 3rem;

        font-size: 1.4rem;
    }


    .container-solutions-list {
        grid-template-columns: 1fr;

        row-gap: 0;
    }


    .container-solutions-item {
        min-height: 65px;

        padding: 1.2rem 0;

        border-bottom: 1px solid #e5ebef;
    }


    .container-solutions-item span {
        font-size: 1.45rem;
    }


    /* Gallery */

    .container-solutions-gallery {
        padding-left: 0;

        margin-top: 4rem;
    }


    .container-solutions-gallery-grid {
        gap: 0.7rem;
    }


    /* CTA */

    .container-solutions-cta {
        min-height: 200px;
    }


    .container-solutions-btn {
        width: 100%;
        min-width: 0;

        padding: 1.4rem 1.5rem;

        font-size: 1.15rem;
    }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media only screen and (max-width: 400px) {

    .container-solutions-heading {
        font-size: 3.5rem;
    }


    .container-solutions-subheading {
        font-size: 1.25rem;
    }


    .container-solutions-description {
        font-size: 1.4rem;
    }


    .container-solutions-item span {
        font-size: 1.35rem;
    }

}


/* =========================================================
   GLOBAL REACH
   ========================================================= */

.s-global-reach {
    position: relative;
    overflow: hidden;

    background: #032f52;
}


/* =========================================================
   MAIN SECTION
   ========================================================= */

.global-reach-main {
    position: relative;

    min-height: 750px;

    display: flex;
    align-items: center;

    overflow: hidden;
}


/* =========================================================
   WORLD MAP
   ========================================================= */

.global-reach-map {
    position: absolute;
    inset: 0;

    background-image: url("../images/world-map.png");

    background-repeat: no-repeat;
    background-size: 75% auto;
    background-position: 75% center;

    opacity: 0.28;

    filter: brightness(1.2);

    pointer-events: none;
}


/* =========================================================
   OVERLAY
   ========================================================= */

.global-reach-overlay {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(3, 47, 82, 1) 0%,
            rgba(3, 47, 82, 0.98) 30%,
            rgba(3, 47, 82, 0.82) 52%,
            rgba(3, 47, 82, 0.45) 75%,
            rgba(3, 47, 82, 0.75) 100%
        );

    pointer-events: none;
}


/* =========================================================
   CONTENT
   ========================================================= */

.global-reach-content {
    position: relative;

    z-index: 2;

    padding-top: 11rem;
    padding-bottom: 10rem;
}


/* Section number */

.global-reach-number {
    display: flex;
    align-items: center;

    gap: 1.5rem;

    margin: 0 0 2.5rem;

    font-size: 1.5rem;
    font-weight: 600;

    letter-spacing: 0.15em;

    color: #55b9f2;
}


.global-reach-number::after {
    content: "";

    width: 40px;
    height: 1px;

    background: #55b9f2;
}


/* Heading */

.global-reach-heading {
    max-width: 750px;

    margin: 0 0 4rem;

    font-size: 6.2rem;

    line-height: 1.05;

    font-weight: 500;

    letter-spacing: -0.03em;

    color: #ffffff;
}


.global-reach-heading span {
    display: block;

    color: #55b9f2;
}


/* Description */

.global-reach-text {
    max-width: 680px;

    margin: 0 0 2.5rem;

    font-size: 1.65rem;

    line-height: 1.75;

    color: rgba(255, 255, 255, 0.75);
}


.global-reach-text strong {
    color: #ffffff;

    font-weight: 600;
}


/* =========================================================
   MARKETS
   ========================================================= */

.global-reach-markets {
    position: absolute;

    z-index: 3;

    left: 0;
    right: 0;
    bottom: 0;

    padding-bottom: 4rem;
}


/* Markets heading */

.global-reach-markets-header {
    display: flex;
    align-items: center;

    gap: 1.5rem;

    margin-bottom: 2rem;
}


.global-reach-markets-header span {
    width: 35px;
    height: 2px;

    background: #55b9f2;
}


.global-reach-markets-header h3 {
    margin: 0;

    font-size: 1.3rem;

    font-weight: 600;

    letter-spacing: 0.15em;

    text-transform: uppercase;

    color: #ffffff;
}


/* Market list */

.global-reach-market-list {
    display: grid;

    grid-template-columns: repeat(3, 1fr);

    border-top: 1px solid rgba(255, 255, 255, 0.2);
}


.global-reach-market {
    display: flex;

    align-items: center;

    gap: 2rem;

    min-height: 75px;

    padding: 1.5rem 2rem;

    border-right: 1px solid rgba(255, 255, 255, 0.2);

    color: #ffffff;

    font-size: 1.45rem;

    text-transform: uppercase;

    letter-spacing: 0.08em;
}


.global-reach-market:first-child {
    border-left: 1px solid rgba(255, 255, 255, 0.2);
}


.global-reach-market-number {
    font-size: 1.1rem;

    color: #55b9f2;

    font-weight: 600;
}


/* =========================================================
   HOVER
   ========================================================= */

.global-reach-market {
    transition:
        background 0.3s ease,
        color 0.3s ease;
}


.global-reach-market:hover {
    background: rgba(255, 255, 255, 0.06);
}


/* =========================================================
   TABLET
   ========================================================= */

@media only screen and (max-width: 1000px) {

    .global-reach-main {
        min-height: 700px;
    }


    .global-reach-map {
        background-size: 85% auto;

        background-position: 80% center;
    }


    .global-reach-heading {
        font-size: 5.2rem;
    }


    .global-reach-text {
        font-size: 1.55rem;
    }


    .global-reach-market {
        padding-left: 1.5rem;
        padding-right: 1.5rem;

        font-size: 1.25rem;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media only screen and (max-width: 700px) {

    .global-reach-main {
        min-height: auto;

        display: block;
    }


    /* Map */

    .global-reach-map {
        background-size: 140% auto;

        background-position: 60% 20%;

        opacity: 0.22;
    }


    /* Overlay */

    .global-reach-overlay {
        background:
            linear-gradient(
                180deg,
                rgba(3, 47, 82, 0.94) 0%,
                rgba(3, 47, 82, 0.97) 65%,
                rgba(3, 47, 82, 1) 100%
            );
    }


    /* Content */

    .global-reach-content {
        padding-top: 9rem;

        padding-bottom: 5rem;
    }


    .global-reach-number {
        margin-bottom: 2rem;

        font-size: 1.3rem;
    }


    .global-reach-heading {
        font-size: 4rem;

        line-height: 1.08;

        margin-bottom: 3rem;
    }


    .global-reach-heading span {
        display: inline;
    }


    .global-reach-text {
        font-size: 1.45rem;

        line-height: 1.7;

        margin-bottom: 2rem;
    }


    /* Markets */

    .global-reach-markets {
        position: relative;

        padding-bottom: 0;
    }


    .global-reach-markets-header {
        margin-bottom: 0;

        padding: 2rem 0;
    }


    .global-reach-market-list {
        display: block;

        border-top: 1px solid rgba(255, 255, 255, 0.2);
    }


    .global-reach-market {
        min-height: 65px;

        padding: 1.5rem 0;

        border-right: none;

        border-bottom: 1px solid rgba(255, 255, 255, 0.2);

        font-size: 1.25rem;
    }


    .global-reach-market:first-child {
        border-left: none;
    }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media only screen and (max-width: 400px) {

    .global-reach-heading {
        font-size: 3.5rem;
    }


    .global-reach-text {
        font-size: 1.35rem;
    }


    .global-reach-market {
        font-size: 1.15rem;
    }

}



/* =========================================================
   REQUEST QUOTE CTA
   ========================================================= */

.s-request-quote {
    position: relative;
    overflow: hidden;

    padding-top: 12rem;
    padding-bottom: 12rem;

    background: #063c65;
}


/* =========================================================
   BACKGROUND
   ========================================================= */

.request-quote-background {
    position: absolute;
    inset: 0;

    background-image: url("../images/container-ocean.jpg");
    background-size: cover;
    background-position: center;

    opacity: 0.35;
}


.request-quote-overlay {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(3, 45, 78, 0.98) 0%,
            rgba(3, 53, 88, 0.94) 45%,
            rgba(3, 53, 88, 0.72) 100%
        );
}


/* =========================================================
   WRAPPER
   ========================================================= */

.request-quote-wrapper {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: center;
}


/* =========================================================
   LEFT CONTENT
   ========================================================= */

.request-quote-content {
    padding-right: 6rem;
}


.request-quote-number {
    display: flex;
    align-items: center;
    gap: 1.5rem;

    margin: 0 0 2.5rem;

    font-size: 1.5rem;
    font-weight: 600;

    letter-spacing: 0.15em;

    color: #55b9f2;
}


.request-quote-number::after {
    content: "";

    width: 40px;
    height: 1px;

    background: #55b9f2;
}


.request-quote-heading {
    max-width: 650px;

    margin: 0 0 3rem;

    font-size: 5.5rem;
    line-height: 1.08;

    font-weight: 500;

    letter-spacing: -0.03em;

    color: #ffffff;
}


.request-quote-heading span {
    display: block;

    color: #55b9f2;
}


.request-quote-description {
    max-width: 600px;

    margin: 0;

    font-size: 1.6rem;
    line-height: 1.75;

    color: rgba(255, 255, 255, 0.75);
}


/* =========================================================
   ACTIONS
   ========================================================= */

.request-quote-actions {
    display: flex;
    align-items: center;

    gap: 3rem;

    margin-top: 4rem;
}


.request-quote-primary {
    display: inline-flex;
    align-items: center;

    gap: 1.5rem;

    padding: 1.5rem 2.5rem;

    border-radius: 50px;

    background: #ffffff;

    color: #064b7d;

    font-size: 1.25rem;
    font-weight: 600;

    letter-spacing: 0.08em;
    text-transform: uppercase;

    transition: all 0.3s ease;
}


.request-quote-primary i {
    transition: transform 0.3s ease;
}


.request-quote-primary:hover {
    background: #55b9f2;
    color: #ffffff;
}


.request-quote-primary:hover i {
    transform: translateX(5px);
}


.request-quote-secondary {
    position: relative;

    padding-bottom: 0.5rem;

    color: #ffffff;

    font-size: 1.3rem;
    font-weight: 600;

    letter-spacing: 0.1em;
    text-transform: uppercase;
}


.request-quote-secondary::after {
    content: "";

    position: absolute;

    left: 0;
    bottom: 0;

    width: 100%;
    height: 1px;

    background: rgba(255, 255, 255, 0.5);
}


.request-quote-secondary:hover {
    color: #55b9f2;
}


/* =========================================================
   INFORMATION BOX
   ========================================================= */

.request-quote-info {
    padding-left: 3rem;
}


.request-quote-info-box {
    padding: 4rem;

    background: rgba(255, 255, 255, 0.97);

    box-shadow:
        0 25px 70px rgba(0, 0, 0, 0.2);
}


.request-quote-info-title {
    margin: 0 0 1.5rem;

    font-size: 2.3rem;
    font-weight: 500;

    color: #064b7d;
}


.request-quote-info-text {
    margin: 0 0 2.5rem;

    font-size: 1.4rem;
    line-height: 1.65;

    color: #5b7180;
}


/* =========================================================
   INFORMATION LIST
   ========================================================= */

.request-quote-info-list {
    margin: 0;
    padding: 0;

    list-style: none;
}


.request-quote-info-list li {
    display: flex;
    align-items: center;

    gap: 1.5rem;

    padding: 1.35rem 0;

    border-bottom: 1px solid #e3e9ed;

    font-size: 1.4rem;

    color: #164c70;

    transition:
        padding-left 0.3s ease,
        color 0.3s ease;
}


.request-quote-info-list li:hover {
    padding-left: 0.5rem;

    color: #1688c9;
}


/* Icon */

.request-info-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 35px;
    height: 35px;

    flex: 0 0 35px;

    color: #1688c9;

    font-size: 1.6rem;
}


/* =========================================================
   INFO FOOTER
   ========================================================= */

.request-quote-info-footer {
    display: flex;

    align-items: center;
    justify-content: space-between;

    gap: 2rem;

    margin-top: 3rem;
    padding-top: 2.5rem;

    border-top: 1px solid #dce5ea;
}


.request-quote-info-footer span {
    font-size: 1.25rem;

    color: #5b7180;
}


.request-quote-info-footer a {
    display: inline-flex;

    align-items: center;

    gap: 1rem;

    white-space: nowrap;

    color: #064b7d;

    font-size: 1.2rem;

    font-weight: 600;

    letter-spacing: 0.05em;

    text-transform: uppercase;
}


.request-quote-info-footer a i {
    transition: transform 0.3s ease;
}


.request-quote-info-footer a:hover {
    color: #1688c9;
}


.request-quote-info-footer a:hover i {
    transform: translateX(5px);
}


/* =========================================================
   TABLET
   ========================================================= */

@media only screen and (max-width: 1000px) {

    .s-request-quote {
        padding-top: 10rem;
        padding-bottom: 10rem;
    }

    .request-quote-content {
        padding-right: 3rem;
    }

    .request-quote-heading {
        font-size: 4.5rem;
    }

    .request-quote-description {
        font-size: 1.5rem;
    }

    .request-quote-info {
        padding-left: 1rem;
    }

    .request-quote-info-box {
        padding: 3rem;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media only screen and (max-width: 700px) {

    .s-request-quote {
        padding-top: 8rem;
        padding-bottom: 8rem;
    }


    .request-quote-overlay {
        background:
            linear-gradient(
                180deg,
                rgba(3, 45, 78, 0.97),
                rgba(3, 53, 88, 0.94)
            );
    }


    .request-quote-wrapper {
        display: block;
    }


    /* Content */

    .request-quote-content {
        padding-right: 0;
    }


    .request-quote-number {
        font-size: 1.3rem;
    }


    .request-quote-heading {
        font-size: 4rem;
        line-height: 1.08;

        margin-bottom: 2.5rem;
    }


    .request-quote-heading span {
        display: inline;
    }


    .request-quote-description {
        font-size: 1.45rem;
        line-height: 1.7;
    }


    /* Buttons */

    .request-quote-actions {
        flex-direction: column;

        align-items: flex-start;

        gap: 2rem;

        margin-top: 3rem;
    }


    .request-quote-primary {
        width: 100%;

        justify-content: center;
    }


    /* Information */

    .request-quote-info {
        padding-left: 0;

        margin-top: 5rem;
    }


    .request-quote-info-box {
        padding: 2.5rem 2rem;
    }


    .request-quote-info-title {
        font-size: 2rem;
    }


    .request-quote-info-text {
        font-size: 1.35rem;
    }


    .request-quote-info-list li {
        font-size: 1.35rem;
    }


    /* Footer */

    .request-quote-info-footer {
        display: block;
    }


    .request-quote-info-footer span {
        display: block;

        margin-bottom: 1.5rem;
    }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media only screen and (max-width: 400px) {

    .request-quote-heading {
        font-size: 3.5rem;
    }


    .request-quote-description {
        font-size: 1.35rem;
    }


    .request-quote-info-box {
        padding: 2rem 1.5rem;
    }

}

/* =========================================================
   PARTNER SECTION
   ========================================================= */

.s-partner {
    position: relative;

    overflow: hidden;

    padding-top: 11rem;
    padding-bottom: 11rem;

    background: #f4f7f9;
}


/* =========================================================
   BACKGROUND
   ========================================================= */

.partner-background {
    position: absolute;

    inset: 0;

    background-image: url("../assets/img/section/container-partnership.jpg");

    background-size: cover;
    background-position: center;

    opacity: 0.12;
}


.partner-overlay {
    position: absolute;

    inset: 0;

    background:
       linear-gradient(151deg, rgb(227 227 227 / 13%), rgb(122 190 236 / 77%))
}


/* =========================================================
   CONTENT
   ========================================================= */

.partner-wrapper {
    position: relative;

    z-index: 2;
}


.partner-content {
    margin: 0 auto;
    text-align: center;
}


/* =========================================================
   NUMBER
   ========================================================= */

.partner-number {
    display: flex;

    align-items: center;
    justify-content: center;

    gap: 1.5rem;

    margin: 0 0 2.5rem;

    font-size: 1.5rem;

    font-weight: 600;

    letter-spacing: 0.15em;

    color: #1688c9;
}


.partner-number::before,
.partner-number::after {
    content: "";

    width: 40px;
    height: 1px;

    background: #1688c9;
}


/* =========================================================
   HEADING
   ========================================================= */

.partner-heading {
    max-width: 900px;

    margin: 0 auto 2.5rem;

    font-size: 5.8rem;

    line-height: 1.05;

    font-weight: 500;

    letter-spacing: -0.03em;

    color: #073d64;
}


.partner-heading span {
    display: block;

    color: #1688c9;
}


/* =========================================================
   SUBHEADING
   ========================================================= */

.partner-subheading {
    margin: 0;

    font-size: 1.8rem;

    line-height: 1.5;

    font-weight: 600;

    letter-spacing: 0.12em;

    text-transform: uppercase;

    color: #164c70;
}


/* =========================================================
   DIVIDER
   ========================================================= */

.partner-divider {
    width: 60px;

    height: 2px;

    margin: 3rem auto;

    background: #1688c9;
}


/* =========================================================
   TEXT
   ========================================================= */

.partner-text {
    max-width: 780px;

    margin: 0 auto 2rem;

    font-size: 1.55rem;

    line-height: 1.8;

    color: #536b7b;
}


.partner-text:last-of-type {
    margin-bottom: 0;
}


/* =========================================================
   CTA
   ========================================================= */

.partner-actions {
    display: flex;

    justify-content: center;
    align-items: center;

    gap: 1.5rem;

    margin-top: 4rem;
}


.partner-btn {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 1.5rem;

    min-width: 230px;

    padding: 1.5rem 2.5rem;

    font-size: 1.2rem;

    font-weight: 600;

    letter-spacing: 0.08em;

    text-transform: uppercase;

    transition:
        background 0.3s ease,
        color 0.3s ease,
        border-color 0.3s ease;
}


.partner-btn i {
    transition: transform 0.3s ease;
}


/* Primary */

.partner-btn-primary {
    border: 1px solid #064b7d;

    background: #064b7d;

    color: #ffffff;
}


.partner-btn-primary:hover {
    border-color: #1688c9;

    background: #1688c9;

    color: #ffffff;
}


.partner-btn-primary:hover i {
    transform: translateX(5px);
}


/* Secondary */

.partner-btn-secondary {
    border: 1px solid #064b7d;

    background: transparent;

    color: #064b7d;
}


.partner-btn-secondary:hover {
    background: #064b7d;

    color: #ffffff;
}


.partner-btn-secondary:hover i {
    transform: translateX(5px);
}


/* =========================================================
   TABLET
   ========================================================= */

@media only screen and (max-width: 1000px) {

    .s-partner {
        padding-top: 9rem;

        padding-bottom: 9rem;
    }


    .partner-heading {
        font-size: 5rem;
    }


    .partner-text {
        font-size: 1.45rem;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media only screen and (max-width: 700px) {

    .s-partner {
        padding-top: 7rem;

        padding-bottom: 7rem;
    }


    .partner-number {
        font-size: 1.3rem;
    }


    .partner-number::before,
    .partner-number::after {
        width: 25px;
    }


    .partner-heading {
        font-size: 3.8rem;

        line-height: 1.08;

        margin-bottom: 2rem;
    }


    .partner-heading span {
        display: inline;
    }


    .partner-subheading {
        font-size: 1.35rem;

        line-height: 1.6;

        letter-spacing: 0.08em;
    }


    .partner-divider {
        margin: 2.5rem auto;
    }


    .partner-text {
        font-size: 1.4rem;

        line-height: 1.7;
    }


    /* Buttons */

    .partner-actions {
        flex-direction: column;

        width: 100%;

        gap: 1rem;

        margin-top: 3rem;
    }


    .partner-btn {
        width: 100%;

        min-width: 0;
    }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media only screen and (max-width: 400px) {

    .partner-heading {
        font-size: 3.4rem;
    }


    .partner-subheading {
        font-size: 1.2rem;
    }


    .partner-text {
        font-size: 1.3rem;
    }

}

/* =========================================================
   PARTNERSHIPS
========================================================= */

.s-partnerships {
    position: relative;
    padding: 140px 0 130px;
    background: #f4f7f9;
    overflow: hidden;
}


/* Header
--------------------------------------------------------- */

.partnerships-header {
    margin-bottom: 75px;
}

.partnerships-heading {
    max-width: 900px;
    margin-top: 15px;
    color: #102a43;
}

.partnerships-heading span {
    display: block;
    color: #1769aa;
}

.partnerships-intro {
    max-width: 720px;
    margin-top: 25px;
    color: #607482;
}


/* Main Content
--------------------------------------------------------- */

.partnerships-content {
    display: flex;
    flex-wrap: wrap;
}


/* Navigation
--------------------------------------------------------- */

.partnerships-navigation {
    border-top: 1px solid #d6e0e6;
}

.partnership-item {
    position: relative;

    display: flex;
    align-items: center;

    width: 100%;
    min-height: 78px;

    padding: 0 20px;

    border: 0;
    border-bottom: 1px solid #d6e0e6;

    background: transparent;

    color: #657784;

    text-align: left;

    cursor: pointer;

    transition:
        background 0.3s ease,
        color 0.3s ease;
}

.partnership-item:hover {
    background: #ffffff;
    color: #102a43;
}

.partnership-item.active {
    background: #ffffff;
    color: #102a43;
}


/* Number */

.partnership-number {
    width: 40px;

    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1px;

    color: #1769aa;
}


/* Item Text */

.partnership-item-text {
    flex: 1;

    font-size: 14px;
    line-height: 1.4;
    font-weight: 500;
}


/* Arrow */

.partnership-item i {
    font-size: 10px;

    opacity: 0;

    transform: translateX(-8px);

    transition:
        opacity 0.3s ease,
        transform 0.3s ease;
}

.partnership-item.active i,
.partnership-item:hover i {
    opacity: 1;
    transform: translateX(0);
}


/* Information Panel
--------------------------------------------------------- */

.partnership-panel {
    position: relative;

    min-height: 390px;

    margin-left: 45px;
    padding: 55px 60px;

    display: flex;
    align-items: flex-start;
    gap: 35px;

    background: #102a43;
    border: 1px solid #102a43;

    color: #ffffff;
}


/* Large Number */

.partnership-panel-number {
    flex-shrink: 0;

    font-size: 64px;
    line-height: 1;

    font-weight: 300;

    color: rgba(102, 182, 232, 0.25);
}


/* Panel Content */

.partnership-panel-content {
    max-width: 560px;
}

.partnership-panel-label {
    display: block;

    margin-bottom: 18px;

    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;

    color: #66b6e8;
}

.partnership-panel h2 {
    margin: 0;

    font-size: 36px;
    line-height: 1.2;
    font-weight: 500;

    color: #ffffff;
}

.partnership-panel-line {
    width: 55px;
    height: 1px;

    margin: 30px 0;

    background: #66b6e8;
}

.partnership-panel p {
    margin: 0;

    font-size: 17px;
    line-height: 1.85;

    color: rgba(255, 255, 255, 0.68);
}


/* Core Principle
--------------------------------------------------------- */

.partnerships-principle {
    margin-top: 75px;
}

.partnership-principle-box {
    padding: 45px 55px;

    border-top: 1px solid #cbd8e0;
    border-bottom: 1px solid #cbd8e0;
}

.partnership-principle-label {
    display: block;

    margin-bottom: 20px;

    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;

    color: #1769aa;
}

.partnership-principle-content {
    display: flex;
    align-items: flex-start;
    gap: 25px;
}

.partnership-principle-mark {
    margin-top: -15px;

    font-family: Georgia, serif;
    font-size: 70px;
    line-height: 1;

    color: #1769aa;
}

.partnership-principle-content h2 {
    max-width: 700px;

    margin: 0;

    font-size: 30px;
    line-height: 1.35;
    font-weight: 400;

    color: #102a43;
}

.partnership-principle-content h2 span {
    color: #1769aa;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media screen and (max-width: 1000px) {

    .s-partnerships {
        padding: 100px 0;
    }

    .partnerships-panel {
        margin-left: 25px;
    }

    .partnership-panel {
        margin-left: 25px;
        padding: 45px;
    }

}


@media screen and (max-width: 800px) {

    .partnerships-content {
        display: block;
    }

    .partnership-panel {
        margin: 30px 0 0;
        min-height: 0;
    }

}


@media screen and (max-width: 600px) {

    .s-partnerships {
        padding: 80px 0;
    }

    .partnerships-header {
        margin-bottom: 50px;
    }

    .partnerships-heading {
        font-size: 36px;
    }

    .partnerships-intro {
        font-size: 16px;
    }

    .partnership-item {
        min-height: 65px;
        padding: 0 15px;
    }

    .partnership-item-text {
        font-size: 13px;
    }

    .partnership-panel {
        display: block;
        padding: 35px 25px;
    }

    .partnership-panel-number {
        margin-bottom: 25px;
        font-size: 48px;
    }

    .partnership-panel h2 {
        font-size: 28px;
    }

    .partnership-panel p {
        font-size: 15px;
        line-height: 1.75;
    }

    .partnership-principle-box {
        padding: 35px 20px;
    }

    .partnership-principle-content {
        gap: 15px;
    }

    .partnership-principle-mark {
        font-size: 50px;
    }

    .partnership-principle-content h2 {
        font-size: 23px;
    }

}


/* =========================================================
   DELIVERY & LOGISTICS
========================================================= */

.s-delivery-logistics {
    position: relative;
    padding: 140px 0 130px;
    background: #ffffff;
    overflow: hidden;
}


/* Header
--------------------------------------------------------- */

.delivery-header {
    margin-bottom: 70px;
}

.delivery-heading {
    max-width: 900px;
    margin-top: 15px;
    color: #102a43;
}

.delivery-heading span {
    display: block;
    color: #1769aa;
}

.delivery-intro {
    max-width: 780px;
    margin-top: 25px;
    color: #607482;
}


/* Main Section
--------------------------------------------------------- */

.delivery-main {
    display: flex;
    align-items: stretch;
}


/* Image
--------------------------------------------------------- */

.delivery-image {
    position: relative;

    height: 100%;
    min-height: 560px;

    overflow: hidden;

    background: #173b58;
}

.delivery-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: fill;

    transition: transform 0.8s ease;
}

.delivery-image:hover img {
    transform: scale(1.03);
}


/* Image Overlay */

.delivery-image-overlay {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            to top,
            rgba(8, 28, 45, 0.9),
            rgba(8, 28, 45, 0.05) 65%
        );
}


/* Image Caption */

.delivery-image-caption {
    position: absolute;

    left: 40px;
    bottom: 40px;

    display: flex;
    flex-direction: column;
}

.delivery-image-caption span {
    margin-bottom: 8px;

    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;

    color: #66b6e8;
}

.delivery-image-caption strong {
    font-size: 24px;
    line-height: 1.3;
    font-weight: 500;

    color: #ffffff;
}


/* Delivery Content
--------------------------------------------------------- */

.delivery-content {
    height: 100%;
    min-height: 560px;

    padding: 50px 55px;

    background: #f4f7f9;
}


/* Label */

.delivery-label {
    display: block;

    margin-bottom: 30px;

    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;

    color: #1769aa;
}


/* Delivery List
--------------------------------------------------------- */

.delivery-list {
    border-top: 1px solid #d5e0e6;
}

.delivery-item {
    display: flex;
    align-items: center;

    min-height: 60px;

    border-bottom: 1px solid #d5e0e6;

    color: #102a43;

    font-size: 14px;
    font-weight: 500;
}

.delivery-item-number {
    width: 40px;

    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;

    color: #1769aa;
}


/* Coordination
--------------------------------------------------------- */

.delivery-coordination {
    display: flex;
    align-items: center;

    margin-top: 90px;
    padding: 55px 0;

    border-top: 1px solid #d5e0e6;
    border-bottom: 1px solid #d5e0e6;
}

.delivery-coordination-label {
    display: block;

    margin-bottom: 18px;

    font-size: 11px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;

    color: #1769aa;
}

.delivery-coordination h2 {
    margin: 0;

    font-size: 34px;
    line-height: 1.25;
    font-weight: 500;

    color: #102a43;
}

.delivery-coordination h2 span {
    color: #1769aa;
}

.delivery-coordination-text {
    max-width: 600px;

    margin: 0;

    font-size: 17px;
    line-height: 1.85;

    color: #657784;
}


/* CTA
--------------------------------------------------------- */

.delivery-cta {
    margin-top: 60px;
    text-align: center;
}

.delivery-btn {
    display: inline-flex;
    align-items: center;
    gap: 18px;

    padding: 17px 30px;

    border: 1px solid #1769aa;
    background: #1769aa;

    color: #ffffff;

    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;

    transition:
        background 0.3s ease,
        border-color 0.3s ease,
        transform 0.3s ease;
}

.delivery-btn i {
    font-size: 10px;
}

.delivery-btn:hover {
    border-color: #102a43;
    background: #102a43;
    color: #ffffff;

    transform: translateY(-2px);
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media screen and (max-width: 1000px) {

    .s-delivery-logistics {
        padding: 100px 0;
    }

    .delivery-main {
        display: block;
    }

    .delivery-image {
        min-height: 450px;
    }

    .delivery-content {
        min-height: auto;
    }

}


@media screen and (max-width: 700px) {

    .s-delivery-logistics {
        padding: 80px 0;
    }

    .delivery-heading {
        font-size: 36px;
    }

    .delivery-intro {
        font-size: 16px;
    }

    .delivery-image {
        min-height: 350px;
    }

    .delivery-image-caption {
        left: 25px;
        bottom: 25px;
    }

    .delivery-image-caption strong {
        font-size: 20px;
    }

    .delivery-content {
        padding: 35px 25px;
    }

    .delivery-item {
        min-height: 55px;
        font-size: 13px;
    }

    .delivery-coordination {
        display: block;
        margin-top: 60px;
        padding: 40px 0;
    }

    .delivery-coordination h2 {
        margin-bottom: 25px;
        font-size: 28px;
    }

    .delivery-coordination-text {
        font-size: 15px;
    }

    .delivery-btn {
        width: 100%;
        justify-content: center;
        text-align: center;
        padding: 16px 20px;
    }

}

/* =========================================================
   OUR MARKETS
========================================================= */

.markets-section {
    position: relative;
    background: #ffffff;
    overflow: hidden;
}

.markets-container {
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
}


/* ---------------------------------------------------------
   HEADER
--------------------------------------------------------- */

.markets-header {
    padding: 100px 7% 65px;
}

.markets-label {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 25px;

    color: #1769aa;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2px;
}

.markets-label i {
    display: block;
    width: 36px;
    height: 2px;
    background: #1769aa;
}

.markets-header h2 {
    margin: 0 0 25px;

    color: #102f50;
    font-size: clamp(42px, 5vw, 72px);
    line-height: 1.02;
    font-weight: 600;
    letter-spacing: -1.5px;
}

.markets-header h2 span {
    color: #1769aa;
}

.markets-header p {
    max-width: 720px;
    margin: 0;

    color: #52708e;
    font-size: 17px;
    line-height: 1.7;
}


/* ---------------------------------------------------------
   MAIN AREA
--------------------------------------------------------- */

.markets-main {
    display: grid;
    grid-template-columns: 2fr 1fr;
    min-height: 550px;
}


/* ---------------------------------------------------------
   MAP
--------------------------------------------------------- */

.markets-map {
    position: relative;
    min-height: 550px;
    overflow: hidden;
    background: #dcecf7;
}

.markets-map img {
    width: 100%;
    height: 100%;
    min-height: 550px;

    display: block;
    object-fit: cover;
    object-position: center;
}

.markets-map-overlay {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(9, 49, 83, 0.05),
            rgba(23, 105, 170, 0.03)
        );
}


/* ---------------------------------------------------------
   KEY MARKETS
--------------------------------------------------------- */

.markets-list {
    padding: 55px 7%;
    background: #ffffff;
}

.markets-list-title {
    margin-bottom: 30px;

    color: #1769aa;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 2px;
}

.market-item {
    display: flex;
    align-items: flex-start;
    gap: 22px;

    padding: 28px 0;
    border-bottom: 1px solid #dce4ea;
}

.market-item:first-of-type {
    padding-top: 0;
}

.market-item:last-child {
    border-bottom: none;
}


.market-icon {
    flex: 0 0 58px;
    width: 58px;
    height: 58px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 2px solid #1769aa;
    border-radius: 50%;

    color: #1769aa;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1px;
}

.market-icon-global {
    font-size: 24px;
}

.market-content h3 {
    margin: 0 0 10px;

    color: #102f50;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 0.5px;
}

.market-content p {
    margin: 0;

    color: #52708e;
    font-size: 15px;
    line-height: 1.7;
}


/* ---------------------------------------------------------
   MARKET FOCUS
--------------------------------------------------------- */

.markets-focus {
    padding: 32px 7%;

    background: #0b365c;
    color: #ffffff;
}

.markets-focus-title {
    display: flex;
    align-items: center;
    gap: 15px;

    margin-bottom: 25px;

    color: #39a8e8;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2px;
}

.markets-focus-title i {
    width: 35px;
    height: 2px;
    background: #39a8e8;
}

.markets-focus-items {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
}

.markets-focus-item {
    display: flex;
    align-items: center;
    gap: 15px;

    color: #ffffff;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 1.2px;
    white-space: nowrap;
}

.markets-focus-item i {
    color: #39a8e8;
    font-size: 28px;
}

.markets-focus-divider {
    width: 5px;
    height: 5px;

    flex: 0 0 5px;

    border-radius: 50%;
    background: #55b7e9;
}


/* =========================================================
   RESPONSIVE
========================================================= */


/* ---------------------------------------------------------
   TABLET
--------------------------------------------------------- */

@media screen and (max-width: 1100px) {

    .markets-header {
        padding: 80px 6% 55px;
    }

    .markets-main {
        grid-template-columns: 1.4fr 1fr;
    }

    .markets-map,
    .markets-map img {
        min-height: 500px;
    }

    .markets-list {
        padding: 45px 6%;
    }

    .market-item {
        gap: 15px;
    }

    .market-icon {
        flex-basis: 50px;
        width: 50px;
        height: 50px;
    }

    .markets-focus-items {
        flex-wrap: wrap;
        justify-content: flex-start;
        gap: 20px 30px;
    }

    .markets-focus-divider {
        display: none;
    }

}


/* ---------------------------------------------------------
   MOBILE
--------------------------------------------------------- */

@media screen and (max-width: 767px) {

    .markets-header {
        padding: 65px 25px 45px;
    }

    .markets-label {
        margin-bottom: 20px;
        font-size: 11px;
        letter-spacing: 1.7px;
    }

    .markets-header h2 {
        font-size: 38px;
        line-height: 1.08;
        letter-spacing: -0.8px;
    }

    .markets-header p {
        font-size: 15px;
        line-height: 1.65;
    }


    /* Main becomes stacked */

    .markets-main {
        display: flex;
        flex-direction: column;
    }


    /* Map */

    .markets-map {
        min-height: 330px;
        height: 330px;
    }

    .markets-map img {
        min-height: 330px;
        height: 330px;
        object-position: center;
    }


    /* Key markets */

    .markets-list {
        padding: 45px 25px;
    }

    .markets-list-title {
        margin-bottom: 20px;
        font-size: 12px;
    }

    .market-item {
        gap: 16px;
        padding: 24px 0;
    }

    .market-icon {
        flex: 0 0 48px;
        width: 48px;
        height: 48px;
        font-size: 11px;
    }

    .market-icon-global {
        font-size: 20px;
    }

    .market-content h3 {
        font-size: 16px;
        line-height: 1.3;
    }

    .market-content p {
        font-size: 14px;
        line-height: 1.6;
    }


    /* Market focus */

    .markets-focus {
        padding: 35px 25px;
    }

    .markets-focus-title {
        margin-bottom: 22px;
        font-size: 11px;
    }

    .markets-focus-items {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 18px;
    }

    .markets-focus-item {
        font-size: 12px;
        letter-spacing: 1px;
    }

    .markets-focus-item i {
        font-size: 23px;
    }

    .markets-focus-divider {
        display: none;
    }

}


/* ---------------------------------------------------------
   SMALL MOBILE
--------------------------------------------------------- */

@media screen and (max-width: 400px) {

    .markets-header {
        padding: 55px 20px 40px;
    }

    .markets-header h2 {
        font-size: 33px;
    }

    .markets-header p {
        font-size: 14px;
    }

    .markets-list {
        padding: 40px 20px;
    }

    .markets-focus {
        padding: 30px 20px;
    }

}

/* =========================================================
   OUR BUSINESS STANDARD
========================================================= */

.business-standard-section {
    position: relative;
    background: #ffffff;
    overflow: hidden;
}

.business-standard-container {
    width: 100%;
    max-width: 1500px;
    margin: 0 auto;
}


/* =========================================================
   TOP CONTENT
========================================================= */

.business-standard-top {
    display: grid;
    grid-template-columns: 0.95fr 1.35fr;
    gap: 70px;

    padding: 100px 7% 90px;
}


/* =========================================================
   INTRODUCTION
========================================================= */

.business-standard-intro {
    padding-top: 5px;
}

.business-standard-label {
    display: flex;
    align-items: center;
    gap: 16px;

    margin-bottom: 28px;

    color: #1769aa;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2px;
}

.business-standard-label i {
    display: block;
    width: 38px;
    height: 2px;

    background: #1769aa;
}


.business-standard-intro h2 {
    margin: 0 0 30px;

    color: #102f50;

    font-size: clamp(42px, 4.5vw, 66px);
    line-height: 1.04;
    font-weight: 600;
    letter-spacing: -1.5px;
}

.business-standard-intro h2 span {
    display: block;
    color: #1769aa;
}


.business-standard-intro > p {
    max-width: 580px;
    margin: 0;

    color: #52708e;

    font-size: 17px;
    line-height: 1.75;
}


/* =========================================================
   VALUES GRID
========================================================= */

.business-standard-values {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.standard-value {
    display: flex;
    align-items: flex-start;
    gap: 22px;

    padding: 20px 25px 30px 0;

    border-bottom: 1px solid #dce4ea;
}

.standard-value:nth-child(even) {
    padding-left: 30px;
    padding-right: 0;

    border-left: 1px solid #dce4ea;
}

.standard-value:nth-child(5) {
    border-bottom: none;
}


/* =========================================================
   VALUE ICON
========================================================= */

.standard-value-icon {
    flex: 0 0 70px;

    width: 70px;
    height: 70px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 2px solid #1769aa;
    border-radius: 50%;

    color: #1769aa;
    font-size: 25px;
}

.standard-value-content {
    padding-top: 5px;
}

.standard-value-content h3 {
    margin: 0 0 10px;

    color: #102f50;

    font-size: 17px;
    line-height: 1.3;
    font-weight: 700;
    letter-spacing: 1px;
}

.standard-value-content p {
    margin: 0;

    color: #52708e;

    font-size: 15px;
    line-height: 1.65;
}


/* =========================================================
   IMAGE BANNER
========================================================= */

.business-standard-banner {
    position: relative;

    height: 430px;

    overflow: hidden;
}

.business-standard-banner img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;
}


.business-standard-banner-overlay {
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(6, 39, 67, 0.02) 25%,
            rgba(6, 39, 67, 0.18) 55%,
            rgba(6, 39, 67, 0.82) 100%
        );
}


/* =========================================================
   BANNER MESSAGE
========================================================= */

.business-standard-banner-content {
    position: absolute;

    right: 7%;
    top: 50%;

    transform: translateY(-50%);

    display: flex;
    align-items: stretch;
    gap: 28px;

    max-width: 430px;
}

.business-standard-banner-line {
    width: 2px;
    min-height: 115px;

    background: rgba(255, 255, 255, 0.85);
}


.business-standard-banner-content p {
    margin: 0;

    color: #ffffff;

    font-size: 17px;
    line-height: 2.05;
    font-weight: 600;
    letter-spacing: 1.5px;
}

.business-standard-banner-content span {
    position: absolute;

    left: 30px;
    bottom: -25px;

    width: 45px;
    height: 2px;

    background: #ffffff;
}


/* =========================================================
   TABLET
========================================================= */

@media screen and (max-width: 1100px) {

    .business-standard-top {
        grid-template-columns: 1fr;
        gap: 60px;

        padding: 80px 6% 70px;
    }

    .business-standard-intro > p {
        max-width: 700px;
    }

    .business-standard-banner {
        height: 400px;
    }

    .business-standard-banner-content {
        right: 6%;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media screen and (max-width: 767px) {

    .business-standard-top {
        display: block;

        padding: 65px 25px 55px;
    }


    /* Intro */

    .business-standard-label {
        margin-bottom: 20px;

        font-size: 11px;
        letter-spacing: 1.7px;
    }

    .business-standard-label i {
        width: 30px;
    }

    .business-standard-intro h2 {
        margin-bottom: 22px;

        font-size: 38px;
        line-height: 1.08;
        letter-spacing: -0.8px;
    }

    .business-standard-intro > p {
        font-size: 15px;
        line-height: 1.7;
    }


    /* Values */

    .business-standard-values {
        display: block;

        margin-top: 50px;
    }

    .standard-value,
    .standard-value:nth-child(even) {
        gap: 18px;

        padding: 25px 0;

        border-left: none;
        border-bottom: 1px solid #dce4ea;
    }

    .standard-value:first-child {
        padding-top: 0;
    }

    .standard-value:last-child {
        border-bottom: none;
    }


    /* Icons */

    .standard-value-icon {
        flex: 0 0 55px;

        width: 55px;
        height: 55px;

        font-size: 20px;
    }

    .standard-value-content {
        padding-top: 2px;
    }

    .standard-value-content h3 {
        font-size: 15px;
        letter-spacing: 0.7px;
    }

    .standard-value-content p {
        font-size: 14px;
        line-height: 1.6;
    }


    /* Banner */

    .business-standard-banner {
        height: 360px;
    }

    .business-standard-banner img {
        object-position: 35% center;
    }

    .business-standard-banner-overlay {
        background:
            linear-gradient(
                90deg,
                rgba(6, 39, 67, 0.08),
                rgba(6, 39, 67, 0.78)
            );
    }

    .business-standard-banner-content {
        right: 25px;
        left: 25px;

        max-width: none;

        gap: 18px;
    }

    .business-standard-banner-line {
        min-height: 100px;
    }

    .business-standard-banner-content p {
        font-size: 13px;
        line-height: 1.9;
        letter-spacing: 1.2px;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media screen and (max-width: 400px) {

    .business-standard-top {
        padding-left: 20px;
        padding-right: 20px;
    }

    .business-standard-intro h2 {
        font-size: 33px;
    }

    .business-standard-banner {
        height: 330px;
    }

    .business-standard-banner-content {
        right: 20px;
        left: 20px;
    }

    .business-standard-banner-content p {
        font-size: 12px;
        letter-spacing: 1px;
    }

}

/* =========================================================
   V3 CONTACT SECTION
========================================================= */

.v3-contact-section {
    padding: 110px 0;
    background: #f5f8fb;
    overflow: hidden;
}

.v3-contact-section *,
.v3-contact-section *::before,
.v3-contact-section *::after {
    box-sizing: border-box;
}

.v3-contact-container {
    width: 88%;
    max-width: 1300px;
    margin: 0 auto;
}


/* ---------------------------------------------------------
   SECTION HEADER
--------------------------------------------------------- */

.v3-contact-header {
    max-width: 800px;
    margin-bottom: 65px;
}

.v3-contact-label {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 24px;

    color: #1769aa;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2px;
}

.v3-contact-label i {
    width: 40px;
    height: 2px;
    background: #1769aa;
}

.v3-contact-header h2 {
    margin: 0 0 25px;

    color: #102f50;
    font-size: clamp(36px, 4.5vw, 62px);
    font-weight: 600;
    line-height: 1.12;
    letter-spacing: -1px;
}

.v3-contact-header h2 span {
    color: #1769aa;
}

.v3-contact-header > p {
    max-width: 670px;
    margin: 0;

    color: #58708a;
    font-size: 17px;
    line-height: 1.8;
}


/* ---------------------------------------------------------
   TWO-COLUMN LAYOUT
--------------------------------------------------------- */

.v3-contact-grid {
    display: grid;
    grid-template-columns: 1fr 0.95fr;
    gap: 35px;
    align-items: stretch;
}


/* ---------------------------------------------------------
   LEFT: CONTACT INFORMATION
--------------------------------------------------------- */

.v3-contact-info {
    padding: 55px;
    background: #ffffff;
    border: 1px solid #e0e8f0;
}

.v3-contact-block-heading {
    margin-bottom: 40px;
    padding-bottom: 28px;
    border-bottom: 1px solid #e0e8f0;
}

.v3-contact-block-heading > span {
    display: block;
    margin-bottom: 16px;

    color: #1769aa;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.v3-contact-block-heading h3 {
    margin: 0;

    color: #102f50;
    font-size: 26px;
    font-weight: 600;
    line-height: 1.3;
}


/* Contact Details */

.v3-contact-detail {
    display: flex;
    align-items: flex-start;
    gap: 22px;
    margin-bottom: 32px;
}

.v3-contact-detail:last-child {
    margin-bottom: 0;
}

.v3-contact-detail-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 48px;
    width: 48px;
    height: 48px;

    color: #1769aa;
    background: #edf5fb;
    font-size: 19px;
}

.v3-contact-detail-content {
    min-width: 0;
    padding-top: 2px;
}

.v3-contact-detail-content h4 {
    margin: 0 0 8px;

    color: #102f50;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.v3-contact-detail-content p {
    margin: 0;

    color: #58708a;
    font-size: 15px;
    line-height: 1.7;
    overflow-wrap: anywhere;
}

.v3-contact-detail-content a {
    color: #1769aa;
    text-decoration: none;
    transition: color 0.2s ease;
}

.v3-contact-detail-content a:hover {
    color: #102f50;
}

.v3-contact-dot {
    color: #39a8e8;
    margin: 0 3px;
}


/* ---------------------------------------------------------
   RIGHT: ONLINE INQUIRIES
--------------------------------------------------------- */

.v3-contact-inquiry {
    display: flex;
    flex-direction: column;
    justify-content: space-between;

    padding: 55px;
    color: #ffffff;

    background:
        linear-gradient(
            135deg,
            #123e66 0%,
            #0b2945 100%
        );
}

.v3-contact-inquiry-number {
    display: block;
    margin-bottom: 35px;

    color: #75c4f1;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.v3-contact-inquiry-icon {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 68px;
    height: 68px;
    margin-bottom: 28px;

    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 50%;

    color: #ffffff;
    font-size: 26px;
}

.v3-contact-inquiry h3 {
    margin: 0 0 22px;

    color: #ffffff;
    font-size: clamp(28px, 3vw, 42px);
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: -0.5px;
}

.v3-contact-inquiry-top > p {
    max-width: 410px;
    margin: 0 0 40px;

    color: #c6d9e9;
    font-size: 16px;
    line-height: 1.8;
}


/* Quote Button */

.v3-contact-quote-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;

    width: 100%;
    padding: 20px 24px;

    color: #102f50;
    background: #ffffff;

    font-size: 13px;
    font-weight: 700;
    letter-spacing: 1.2px;
    text-decoration: none;

    transition:
        background 0.25s ease,
        color 0.25s ease;
}

.v3-contact-quote-btn:hover,
.v3-contact-quote-btn:focus-visible {
    color: #ffffff;
    background: #1769aa;
}

.v3-contact-quote-btn i {
    font-size: 16px;
    transition: transform 0.25s ease;
}

.v3-contact-quote-btn:hover i {
    transform: translateX(4px);
}


/* Bottom Labels */

.v3-contact-inquiry-bottom {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;

    margin-top: 30px;

    color: #a8c4db;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 1px;
}


/* =========================================================
   TABLET
========================================================= */

@media screen and (max-width: 1024px) {

    .v3-contact-section {
        padding: 85px 0;
    }

    .v3-contact-container {
        width: 90%;
    }

    .v3-contact-grid {
        gap: 22px;
    }

    .v3-contact-info,
    .v3-contact-inquiry {
        padding: 35px;
    }

    .v3-contact-header {
        margin-bottom: 50px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media screen and (max-width: 767px) {

    .v3-contact-section {
        padding: 65px 0;
    }

    .v3-contact-container {
        width: auto;
        margin: 0 22px;
    }

    .v3-contact-header {
        margin-bottom: 40px;
    }

    .v3-contact-label {
        margin-bottom: 20px;
        font-size: 11px;
        letter-spacing: 1.5px;
    }

    .v3-contact-header h2 {
        font-size: 36px;
        line-height: 1.15;
    }

    .v3-contact-header > p {
        font-size: 15px;
        line-height: 1.7;
    }

    .v3-contact-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .v3-contact-info,
    .v3-contact-inquiry {
        padding: 32px 25px;
    }

    .v3-contact-block-heading {
        margin-bottom: 30px;
        padding-bottom: 22px;
    }

    .v3-contact-block-heading h3 {
        font-size: 23px;
    }

    .v3-contact-detail {
        gap: 16px;
        margin-bottom: 26px;
    }

    .v3-contact-detail-icon {
        flex-basis: 42px;
        width: 42px;
        height: 42px;
        font-size: 17px;
    }

    .v3-contact-detail-content p {
        font-size: 14px;
    }

    .v3-contact-inquiry-number {
        margin-bottom: 28px;
    }

    .v3-contact-inquiry h3 {
        font-size: 32px;
    }

    .v3-contact-inquiry-top > p {
        margin-bottom: 32px;
        font-size: 15px;
    }

    .v3-contact-quote-btn {
        padding: 18px 20px;
        font-size: 12px;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

@media screen and (max-width: 400px) {

    .v3-contact-container {
        margin: 0 16px;
    }

    .v3-contact-header h2 {
        font-size: 31px;
    }

    .v3-contact-info,
    .v3-contact-inquiry {
        padding: 28px 20px;
    }

    .v3-contact-inquiry h3 {
        font-size: 28px;
    }

}







/* =========================================================
   V3 PACIFIC GLOBAL TRADING — FAQ SECTION
========================================================= */

.v3-faq-section {
    --v3-faq-navy: #083c70;
    --v3-faq-dark: #062c53;
    --v3-faq-blue: #126db0;
    --v3-faq-sky: #a5dcff;
    --v3-faq-text: #12375f;
    --v3-faq-muted: #58718d;
    --v3-faq-border: #dce8f5;
    --v3-faq-background: #f4f9ff;

    width: 100%;
    color: var(--v3-faq-text);
    background: var(--v3-faq-background);
}

.v3-faq-section *,
.v3-faq-section *::before,
.v3-faq-section *::after {
    box-sizing: border-box;
}


.v3-faq-section .row {
    width: min(1200px, calc(100% - 48px));
    max-width: 1200px;
    margin: 0 auto;
}

.v3-faq-section button,
.v3-faq-section input {
    font-family: inherit;
}


/* =========================================================
   HERO
========================================================= */

.v3-faq-hero {
    position: relative;
    padding: 76px 0 72px;
    overflow: hidden;

    background:
        linear-gradient(
            90deg,
            rgba(5, 39, 75, 0.98) 0%,
            rgba(6, 52, 99, 0.93) 50%,
            rgba(5, 45, 87, 0.76) 100%
        ),
        url("../assets/img/section/container-banner.jpg")
        center center / cover no-repeat;
}

.v3-faq-hero-inner {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 40px;

    margin-top: 10rem !important;
}

.v3-faq-hero-copy {
    max-width: 720px;
}

.v3-faq-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 20px;

    color: #c6e7ff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3px;
}

.v3-faq-eyebrow-line {
    width: 44px;
    height: 2px;
    background: #d2eaff;
}

.v3-faq-hero h1 {
    margin: 0 0 17px;

    color: #fff;
    font-size: clamp(38px, 4.7vw, 62px);
    font-weight: 700;
    line-height: 1.12;
    letter-spacing: -1.5px;
}

.v3-faq-hero h1 span {
    display: block;
    color: var(--v3-faq-sky);
}

.v3-faq-hero p {
    max-width: 570px;
    margin: 0;

    color: #e1edfa;
    font-size: 15px;
    line-height: 1.8;
}

.v3-faq-hero-detail {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-top: 12px;

    color: #b9dcf6;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 3px;
    line-height: 1.5;
}

.v3-faq-hero-detail-line {
    width: 75px;
    height: 2px;
    margin-top: 8px;
    background: #b9dcf6;
}


/* =========================================================
   MAIN LAYOUT
========================================================= */

.v3-faq-content {
    padding: 50px 0 56px;
    background: var(--v3-faq-background);
}

.v3-faq-layout {
    display: grid;
    grid-template-columns: 305px minmax(0, 1fr);
    align-items: start;
    gap: 30px;
}

.v3-faq-sidebar,
.v3-faq-main {
    min-width: 0;
}


/* =========================================================
   LEFT SIDEBAR
========================================================= */

.v3-faq-sidebar h2 {
    margin: 17px 0 22px;

    color: var(--v3-faq-text);
    font-size: 22px;
    font-weight: 700;
    line-height: 1.3;
}

.v3-faq-categories {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.v3-faq-category {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;

    width: 100%;
    min-height: 58px;
    margin: 0;
    padding: 13px 20px;

    border: 1px solid var(--v3-faq-border);
    border-radius: 5px;

    background: #fff;
    color: var(--v3-faq-text);

    font-size: 13px;
    font-weight: 700;
    line-height: 1.4;
    text-align: left;
    text-transform: none;
    letter-spacing: 0;

    cursor: pointer;

    box-shadow: 0 3px 10px rgba(12, 57, 103, 0.035);

    transition:
        background 0.2s ease,
        color 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease;
}

.v3-faq-category-main {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.v3-faq-category-main > i {
    width: 22px;
    flex-shrink: 0;
    color: var(--v3-faq-navy);
    font-size: 18px;
    text-align: center;
}

.v3-faq-category > i {
    flex-shrink: 0;
    color: var(--v3-faq-blue);
    font-size: 13px;
}

.v3-faq-category:hover {
    border-color: #a6c5e5;
    transform: translateX(2px);
}

.v3-faq-category.active {
    background: var(--v3-faq-navy);
    border-color: var(--v3-faq-navy);
    color: #fff;
}

.v3-faq-category.active i {
    color: #fff;
}


/* =========================================================
   CONTACT CARD
========================================================= */

.v3-faq-contact-card {
    margin-top: 28px;
    padding: 28px 24px 24px;

    border-radius: 7px;
    background: #e7f1fd;
}

.v3-faq-contact-card > i {
    display: block;
    margin-bottom: 16px;
    color: var(--v3-faq-navy);
    font-size: 31px;
}

.v3-faq-contact-card h3 {
    margin: 0 0 7px;

    color: var(--v3-faq-text);
    font-size: 19px;
    font-weight: 700;
    line-height: 1.35;
}

.v3-faq-contact-card p {
    margin: 0 0 20px;
    color: var(--v3-faq-text);
    font-size: 13px;
    line-height: 1.6;
}

.v3-faq-contact-button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;

    width: 100%;
    min-height: 47px;
    padding: 12px 18px;

    border-radius: 4px;
    background: var(--v3-faq-navy);
    color: #fff;

    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
    text-decoration: none;

    transition: background 0.2s ease;
}

.v3-faq-contact-button:hover {
    background: var(--v3-faq-blue);
    color: #fff;
}


/* =========================================================
   SEARCH
========================================================= */

.v3-faq-search {
    display: flex;
    align-items: center;
    gap: 16px;

    height: 55px;
    margin-bottom: 16px;
    padding: 0 21px;

    border: 1px solid #b7d1ec;
    border-radius: 7px;

    background: #fff;
    box-shadow: 0 2px 9px rgba(10, 58, 106, 0.025);
}

.v3-faq-search > i {
    flex-shrink: 0;
    color: var(--v3-faq-blue);
    font-size: 19px;
}

.v3-faq-search input {
    width: 100%;
    height: 100%;
    min-height: 0;
    margin: 0;
    padding: 0;

    border: 0;
    outline: 0;
    border-radius: 0;

    background: transparent;
    color: var(--v3-faq-text);

    font-size: 14px;
    font-weight: 400;
    line-height: normal;

    box-shadow: none;
}

.v3-faq-search input:focus {
    border: 0;
    outline: 0;
    box-shadow: none;
}

.v3-faq-search input::placeholder {
    color: #8295ab;
    opacity: 1;
}


/* =========================================================
   FAQ ACCORDION
========================================================= */

.v3-faq-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.v3-faq-item {
    overflow: hidden;

    border: 1px solid #e1eaf4;
    border-radius: 5px;

    background: #fff;
    box-shadow: 0 3px 10px rgba(8, 51, 94, 0.045);
}

.v3-faq-item[hidden],
.v3-faq-answer[hidden],
.v3-faq-no-results[hidden] {
    display: none !important;
}

.v3-faq-question {
    display: flex;
    align-items: center;
    gap: 18px;

    width: 100%;
    min-height: 48px;
    margin: 0;
    padding: 11px 20px;

    border: 0;
    border-radius: 0;

    background: #fff;
    color: var(--v3-faq-text);

    font-size: 13px;
    font-weight: 700;
    line-height: 1.5;
    text-align: left;
    text-transform: none;
    letter-spacing: 0;

    cursor: pointer;

    transition:
        background 0.2s ease,
        color 0.2s ease;
}

.v3-faq-number {
    display: flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 43px;
    min-height: 25px;

    border-right: 1px solid #8ab0d7;

    color: var(--v3-faq-navy);
    font-size: 13px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.v3-faq-question-text {
    flex: 1;
    min-width: 0;
}

.v3-faq-question > i {
    flex-shrink: 0;
    margin-left: auto;

    color: var(--v3-faq-blue);
    font-size: 14px;
}

.v3-faq-item.active .v3-faq-question {
    background: var(--v3-faq-navy);
    color: #fff;
}

.v3-faq-item.active .v3-faq-number {
    color: #fff;
    border-right-color: rgba(255, 255, 255, 0.65);
}

.v3-faq-item.active .v3-faq-question > i {
    color: #fff;
}


/* =========================================================
   FAQ ANSWERS
========================================================= */

.v3-faq-answer {
    padding: 15px 25px 19px 88px;
    border-top: 1px solid #e2edf8;
    background: #fff;
}

.v3-faq-answer p {
    margin: 0 0 12px;

    color: var(--v3-faq-muted);
    font-size: 13px;
    font-weight: 400;
    line-height: 1.8;
}

.v3-faq-answer p:last-child {
    margin-bottom: 0;
}

.v3-faq-answer strong {
    color: var(--v3-faq-text);
}

.v3-faq-answer-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;

    margin-top: 6px;

    color: var(--v3-faq-blue);
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
}

.v3-faq-answer-link:hover {
    color: var(--v3-faq-dark);
}


/* =========================================================
   NO RESULTS
========================================================= */

.v3-faq-no-results {
    padding: 55px 20px;
    text-align: center;
}

.v3-faq-no-results > i {
    color: var(--v3-faq-blue);
    font-size: 28px;
}

.v3-faq-no-results h3 {
    margin: 16px 0 8px;
    color: var(--v3-faq-text);
    font-size: 20px;
}

.v3-faq-no-results p {
    margin: 0;
    color: var(--v3-faq-muted);
    font-size: 13px;
}


/* =========================================================
   BOTTOM BRAND STRIP
========================================================= */

.v3-faq-bottom {
    padding: 29px 0;

    background:
        linear-gradient(
            90deg,
            rgba(5, 42, 79, 0.98),
            rgba(7, 57, 104, 0.9)
        ),
        url("../assets/img/section/containers/container-yard.jpg")
        center / cover no-repeat;
}

.v3-faq-bottom-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.v3-faq-bottom-inner > span {
    display: inline-flex;
    align-items: center;
    gap: 14px;

    color: #b9d9f2;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2.3px;
    line-height: 1.6;
}

.v3-faq-bottom-line {
    width: 45px;
    height: 2px;
    flex-shrink: 0;
    background: #d2eaff;
}


/* =========================================================
   FOCUS STATES
========================================================= */

.v3-faq-category:focus-visible,
.v3-faq-question:focus-visible,
.v3-faq-contact-button:focus-visible,
.v3-faq-answer-link:focus-visible {
    outline: 3px solid #82c9ff;
    outline-offset: 3px;
}


/* =========================================================
   RESPONSIVE — TABLET
========================================================= */

@media screen and (max-width: 991px) {

    .v3-faq-layout {
        grid-template-columns: 255px minmax(0, 1fr);
        gap: 22px;
    }

    .v3-faq-category {
        padding: 12px 15px;
        font-size: 12px;
    }

    .v3-faq-question {
        gap: 12px;
        padding: 11px 14px;
        font-size: 12px;
    }

    .v3-faq-answer {
        padding-left: 67px;
    }

}


/* =========================================================
   RESPONSIVE — MOBILE
========================================================= */

@media screen and (max-width: 767px) {

    .v3-faq-section .row {
        width: calc(100% - 32px);
    }

    .v3-faq-hero {
        padding: 58px 0;
    }

    .v3-faq-hero-detail {
        display: none;
    }

    .v3-faq-hero h1 {
        font-size: clamp(35px, 8vw, 48px);
        letter-spacing: -1px;
    }

    .v3-faq-hero p {
        font-size: 14px;
    }

    .v3-faq-content {
        padding: 35px 0 45px;
    }

    .v3-faq-layout {
        grid-template-columns: minmax(0, 1fr);
        gap: 30px;
    }

    .v3-faq-sidebar h2 {
        margin: 0 0 16px;
        font-size: 20px;
    }

    .v3-faq-categories {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .v3-faq-category {
        min-height: 53px;
        padding: 10px 12px;
        font-size: 11px;
    }

    .v3-faq-category-main {
        gap: 9px;
    }

    .v3-faq-category-main > i {
        width: 17px;
        font-size: 15px;
    }

    .v3-faq-category > i {
        font-size: 10px;
    }

    .v3-faq-contact-card {
        margin-top: 16px;
        padding: 20px;
    }

    .v3-faq-contact-card > i {
        margin-bottom: 10px;
        font-size: 24px;
    }

    .v3-faq-contact-card h3 {
        font-size: 17px;
    }

    .v3-faq-contact-button {
        max-width: 260px;
    }

    .v3-faq-bottom-inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

}


/* =========================================================
   RESPONSIVE — SMALL MOBILE
========================================================= */

@media screen and (max-width: 480px) {

    .v3-faq-eyebrow {
        gap: 10px;
        font-size: 9px;
        letter-spacing: 1.7px;
    }

    .v3-faq-eyebrow-line {
        width: 27px;
    }

    .v3-faq-categories {
        grid-template-columns: 1fr;
    }

    .v3-faq-category {
        min-height: 49px;
        font-size: 12px;
    }

    .v3-faq-contact-button {
        max-width: none;
    }

    .v3-faq-search {
        height: 51px;
        padding: 0 15px;
    }

    .v3-faq-search input {
        font-size: 12px;
    }

    .v3-faq-question {
        gap: 9px;
        padding: 12px 10px;
        font-size: 12px;
    }

    .v3-faq-number {
        flex-basis: 32px;
        font-size: 11px;
    }

    .v3-faq-answer {
        padding: 15px 16px;
    }

    .v3-faq-answer p {
        font-size: 12px;
    }

    .v3-faq-bottom-inner > span {
        font-size: 9px;
        letter-spacing: 1.3px;
    }

}