@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');


:root {
    --lime: #C99847;
    --bluelight: #254e7b;
    --darkgold: #C99847;
    --lightgold: #FEDA86;
    --bg: #092A4D;
    --card: #121212;
    --border: #2a2a2a;
    --inter: "Inter", sans-serif;
}
body {
    background: var(--bg);
    color: #fff;
    font-family: var(--inter);
    font-size: 20px;
    line-height: 1.65;
    font-weight: 400;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
	line-height: 1.45;
}
img {
	max-width: 100%;
}
a {
    text-decoration: none;
    color: #fff;
}
.site-header {
    background: var(--bluelight);
    border-bottom: 1px solid #1c1c1c;
}
.section-pad {
    padding: 5rem 0;
}
.text-lime {
    color: var(--darkgold) !important;
}
.btn {
	font-weight: 600;
    font-size: 16px;
    padding: 16px 32px;
    border-radius: 5px;
    transition: .4s all;
}
.btn-lime {
    background: linear-gradient(to bottom, var(--lightgold), var(--darkgold));
    color: #000;
    border: none;
}
.btn-lime:hover {
	background: linear-gradient(to bottom, var(--lightgold), var(--darkgold));
    color: #000;
}
.btn-outline-light {
	background: transparent !important;
	color: #fff;
    border: 1px solid #fff;
}
.btn-outline-light:hover {
	border-color: var(--darkgold);
	color: var(--darkgold);
}
.btn-dark, .btn-dark:hover {
	background: var(--bg);
	color: #fff;
}
h3 {
    font-size: 24px;
}
span.badge {
    border-color: var(--darkgold) !important;
    color: var(--darkgold) !important;
}
.eyebrow {
    letter-spacing: 0.08em;
    color: var(--lime);
    font-weight: 700;
}
.section-title {
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 700;
    margin-bottom: 1rem;
}
.section-copy {
    color: #9ca3af;
    max-width: 720px;
}
.hero-globe {
    width: min(420px, 100%);
    aspect-ratio: 1;
    border-radius: 50%; 
    box-shadow: 0 0 80px rgb(242 203 119 / 23%);
    img {
    	mix-blend-mode: lighten;
    }
}
.glass-card {
	background: url(images/box-bg.png);
    border: 1px solid var(--border);
    border-radius: 1rem;
    padding: 2rem;
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: cover;
}
.icon-card, .compare-card {
    background: var(--bluelight);
    border: 1px solid var(--border);
    border-radius: 1rem;
    padding: 2rem;
    p {
		font-size: 1rem;
	}
}
.icon-card p {
    margin-bottom: 0;
}
.stats-box, .cta-band {
    background: var(--lime);
}
.stat {
    font-size: clamp(2.5rem, 5vw, 4rem);
    font-weight: 800;
    color: #000;
}
.compare-card.active {
    border-color: rgb(115 93 52);
    box-shadow: 0 0 0 1px rgba(185, 255, 56, 0.15) inset;
}
.footer {
    border-top: 1px solid #a1a1a1;
}


/* Modal Content */
.contact-modal .modal-content {
  padding: 12px;
  background: var(--bg);
}
.contact-tabs {
	background: var(--bluelight);
	border-radius: 10px;
	padding: 4px;
}
.contact-tabs .nav-link {
	color: #d0d0d0;
	border-radius: 8px;
	font-weight: 500;
	padding: 12px;
	background: transparent;
	border: none;
}
.contact-tabs .nav-link.active {
	background: var(--bg);
	color: #fff;
}
.contact-modal .form-label {
	color: #cfcfcf;
	font-size: 14px;
	margin-bottom: 8px;
}
.contact-modal .form-control,
.contact-modal .input-group-text {
	background: transparent;
	border: 1px solid #5e82aa;
	color: #fff;
	border-radius: 10px;
	font-size: 16px;
}
.contact-modal .form-control {
  	padding: 14px 16px;
}
.contact-modal .form-control::placeholder {
  	color: #6c757d;
}
.contact-modal .form-control:focus {
	background: transparent;
	color: #fff;
	border-color: #5e82aa;
	box-shadow: none;
}
.contact-modal .input-group .form-control {
	border-left: 0;
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}
.contact-modal .input-group-text {
	border-right: 0;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}
.contact-modal .form-check {
    font-size: 16px;
    input {
    	outline: none !important;
    	box-shadow: none !important;
    }
    a {
    	color: var(--darkgold);
    }
}
.contact-modal .btn-light {
	background: linear-gradient(to bottom, var(--lightgold), var(--darkgold));
	border: none;
	color: #000 !important;
	font-size: 18px;
}

.contact-modal {
	/* Wrapper */
	.contact-dropdown-group {
	  border: 1px solid #5e82aa;
	  border-radius: 10px;
	}

	/* Remove default input borders */
	.contact-dropdown-group .form-control {
	  background: transparent;
	  border: none;
	  color: #fff;
	  box-shadow: none;
	  padding: 14px 16px;
	}

	.contact-dropdown-group .form-control::placeholder {
	  color: #6c757d;
	}

	/* Dropdown button */
	.contact-dropdown-btn {
	  background: transparent;
	  color: #fff;
	  border: none;
	  border-right: 1px solid #2f3338;
	  border-radius: 0;
	  padding: 14px 16px;
	  min-width: 150px;
	  text-align: left;
	  display: flex;
	  align-items: center;
	  gap: 8px;
	  box-shadow: none !important;
	}

	.contact-dropdown-btn:hover,
	.contact-dropdown-btn:focus,
	.contact-dropdown-btn:active {
	  background: transparent !important;
	  color: #fff !important;
	}

	/* Dropdown arrow */
	.contact-dropdown-btn::after {
	  margin-left: auto;
	}

	/* Dropdown menu */
	.contact-dropdown-menu {
	  background: #111;
	  border: 1px solid #2f3338;
	  border-radius: 10px;
	  padding: 0;
	  margin-top: 8px;
	  min-width: 100%;
	  overflow: hidden;
	}

	/* Dropdown items */
	.contact-dropdown-menu .dropdown-item {
		color: #fff;
		padding: 10px 16px;
		display: flex;
		align-items: center;
		gap: 8px;
		font-size: 16px;
	}

	button.contact-dropdown-btn {
	    background: transparent;
	    color: #fff;
	    font-size: 16px;
	    height: 100%;
	    border: 0;
	}
	ul.contact-dropdown-menu {
	    background: #254e7b;
	    color: #fff;
	}
	ul.contact-dropdown-menu .dropdown-item:hover, ul.contact-dropdown-menu .dropdown-item.active {
		background: #3563af !important;
		color: #fff;
	}
}


@media (min-width: 992px) {
body > :not(header):not(footer) {
	.container {
		max-width: 950px;
	}
}


@media (max-width: 991.98px) {
    .section-pad {
        padding: 3.5rem 0;
    }
}

@media (max-width: 575px) {
.contact-modal .modal-dialog {
    margin: 10px;
  }

  .contact-modal .modal-title {
    font-size: 24px;
    line-height: 1.3;
  }
  .contact-modal .modal-content {
  	padding: 0;
  }
}