/* Minification failed. Returning unminified contents.
(490,22): run-time error CSS1039: Token not allowed after unary operator: '-main-bg-gradient'
(493,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-font-color'
(504,26): run-time error CSS1039: Token not allowed after unary operator: '-main-bg-gradient'
(513,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(514,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(515,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(516,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(517,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(518,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(520,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(521,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(522,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(526,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(528,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(530,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(531,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(533,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(535,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(536,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(537,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(538,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(540,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(541,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(542,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(543,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(544,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(545,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(546,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(547,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(548,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(549,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(551,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(552,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(553,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(554,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(555,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(556,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(558,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(559,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(560,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(561,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(562,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(563,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(564,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(565,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(566,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(568,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(569,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(570,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(572,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(573,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(574,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(575,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(576,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(577,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(579,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(580,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(581,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(582,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(583,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(584,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(585,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(586,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(587,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(588,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(589,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(590,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(591,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(592,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(594,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(595,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(596,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(597,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(598,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(599,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(600,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(601,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(602,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(603,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(604,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(605,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(606,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(607,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(608,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(609,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(610,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(611,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(612,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(613,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(614,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(615,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(616,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(617,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(618,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(619,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(620,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(621,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(623,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(625,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(626,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(627,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(628,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(629,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(630,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(631,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(632,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(634,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(635,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(636,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(637,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(638,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(639,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(640,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(641,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(642,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(646,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(647,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(649,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(652,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(654,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(655,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(657,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(658,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(659,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(660,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(661,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(663,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(664,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(665,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(666,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(667,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(668,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(670,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(671,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(672,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(673,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(674,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(675,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(677,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(678,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(679,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(680,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(681,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(683,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(685,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(686,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(687,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(688,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(689,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(690,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(691,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(692,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(694,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(695,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(696,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(697,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(698,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(699,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(700,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(701,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(702,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(713,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-font-color'
(721,21): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(732,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-font-color'
(733,22): run-time error CSS1039: Token not allowed after unary operator: '-main-bg-gradient'
(734,33): run-time error CSS1039: Token not allowed after unary operator: '-secondary-color'
(742,45): run-time error CSS1039: Token not allowed after unary operator: '-primary-color'
(744,35): run-time error CSS1039: Token not allowed after unary operator: '-primary-font-color'
(751,1): run-time error CSS1019: Unexpected token, found '@import'
(751,9): run-time error CSS1019: Unexpected token, found 'url("https://fonts.googleapis.com/css2?family=Cairo:wght@200;300;400;600;700;900&family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;0,800;1,300;1,400;1,600;1,700;1,800&display=swap")'
 */
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
main {
  display: block;
}
body {
  line-height: 1;
}
ol,
ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
a {
  text-decoration: none;
  color: inherit;
}

@charset "utf-8";
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

/* Sections
     ========================================================================== */

/**
   * Remove the margin in all browsers.
   */

body {
  margin: 0;
}

/**
   * Render the `main` element consistently in IE.
   */

main {
  display: block;
}

/**
   * Correct the font size and margin on `h1` elements within `section` and
   * `article` contexts in Chrome, Firefox, and Safari.
   */

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
     ========================================================================== */

/**
   * 1. Add the correct box sizing in Firefox.
   * 2. Show the overflow in Edge and IE.
   */

hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}

/**
   * 1. Correct the inheritance and scaling of font size in all browsers.
   * 2. Correct the odd `em` font sizing in all browsers.
   */

pre {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/* Text-level semantics
     ========================================================================== */

/**
   * Remove the gray background on active links in IE 10.
   */

a {
  background-color: transparent;
}

/**
   * 1. Remove the bottom border in Chrome 57-
   * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
   */

abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  text-decoration: underline dotted; /* 2 */
}

/**
   * Add the correct font weight in Chrome, Edge, and Safari.
   */

b,
strong {
  font-weight: bolder;
}

/**
   * 1. Correct the inheritance and scaling of font size in all browsers.
   * 2. Correct the odd `em` font sizing in all browsers.
   */

code,
kbd,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
   * Add the correct font size in all browsers.
   */

small {
  font-size: 80%;
}

/**
   * Prevent `sub` and `sup` elements from affecting the line height in
   * all browsers.
   */

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
     ========================================================================== */

/**
   * Remove the border on images inside links in IE 10.
   */

img {
  border-style: none;
}

/* Forms
     ========================================================================== */

/**
   * 1. Change the font styles in all browsers.
   * 2. Remove the margin in Firefox and Safari.
   */

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 1 */
  line-height: 1.15; /* 1 */
  margin: 0; /* 2 */
}

/**
   * Show the overflow in IE.
   * 1. Show the overflow in Edge.
   */

button,
input {
  /* 1 */
  overflow: visible;
}

/**
   * Remove the inheritance of text transform in Edge, Firefox, and IE.
   * 1. Remove the inheritance of text transform in Firefox.
   */

button,
select {
  /* 1 */
  text-transform: none;
}

/**
   * Correct the inability to style clickable types in iOS and Safari.
   */

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

/**
   * Remove the inner border and padding in Firefox.
   */

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
   * Restore the focus styles unset by the previous rule.
   */

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
   * Correct the padding in Firefox.
   */

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
   * 1. Correct the text wrapping in Edge and IE.
   * 2. Correct the color inheritance from `fieldset` elements in IE.
   * 3. Remove the padding so developers are not caught out when they zero out
   *    `fieldset` elements in all browsers.
   */

legend {
  box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/**
   * Add the correct vertical alignment in Chrome, Firefox, and Opera.
   */

progress {
  vertical-align: baseline;
}

/**
   * Remove the default vertical scrollbar in IE 10+.
   */

textarea {
  overflow: auto;
}

/**
   * 1. Add the correct box sizing in IE 10.
   * 2. Remove the padding in IE 10.
   */

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
   * Correct the cursor style of increment and decrement buttons in Chrome.
   */

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
   * 1. Correct the odd appearance in Chrome and Safari.
   * 2. Correct the outline style in Safari.
   */

[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
   * Remove the inner padding in Chrome and Safari on macOS.
   */

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
   * 1. Correct the inability to style clickable types in iOS and Safari.
   * 2. Change font properties to `inherit` in Safari.
   */

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/* Interactive
     ========================================================================== */

/*
   * Add the correct display in Edge, IE 10+, and Firefox.
   */

details {
  display: block;
}

/*
   * Add the correct display in all browsers.
   */

summary {
  display: list-item;
}

/* Misc
     ========================================================================== */

/**
   * Add the correct display in IE 10+.
   */

template {
  display: none;
}

/**
   * Add the correct display in IE 10.
   */

[hidden] {
  display: none;
}

body {
    background: var(--main-bg-gradient);
    background-attachment: fixed; /* Keeps the gradient stable while scrolling */
    background-size: cover;
    color: var(--primary-font-color);
    position: relative;
}

    body::before {
        content: "";
        position: fixed;
        top: 0;
        left: 0;
        width: 100vw;
        height: 100vh;
        background: var(--main-bg-gradient);
        background-size: cover;
        background-position: center;
        z-index: -9999; /* Keeps the background behind all content */
        pointer-events: none; /* Prevents it from blocking interactions */
    }

:root {
    /* --- CORE PALETTE --- */
    --black: #000000;
    --midnight-blue: #001421;
    --sand: #b27f59;
    --pearl: #ffffff;
    --gradient-accent: #8c684a;
    --light-blue: #8FBFFA;
    /* --- LIGHT MODE THEME (Pearl, Black, Sand) --- */
    --primary-color: var(--pearl);
    --secondary-color: var(--sand);
    --tertiary-color: var(--midnight-blue);
    /*  */
    /* Backgrounds: Nav Header and Global Website Gradient */
    /*--main-bg-gradient: linear-gradient(to top right, var(--pearl) 60%, var(--gradient-accent) 100%);*/
    --main-bg-gradient: var(--pearl);
    /*--main-header-bg-gradient: linear-gradient(to top right, var(--pearl) 35%, var(--gradient-accent) 100%);*/
    --main-header-bg-gradient: none;
    /*--main-header-services-panel-bg-gradient: linear-gradient(to left, var(--pearl) 0%, var(--gradient-accent) 50%);*/
    --services-panel-hover: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, #000 30%, #000 70%, rgba(0, 0, 0, 0) 100%);
    --services-panel-text-hover: 0 0 20px #000, 0 0 30px #000, 0 0 40px #000, 0 0 50px #000, 0 0 60px #000, 0 0 70px #000, 0 0 80px #000;
    /*--header-bg: var(--main-header-bg-gradient);*/
    --header-bg: rgba(255, 255, 255, 0.4); /* Change 0.8 to 0 for fully invisible, or 1 for solid white */
    /* UI Elements */
    --nav-text-glow: rgba(0, 0, 0, 0.5); /* Subtle sand-colored glow */
    --nav-submenu-hover-bg: rgba(255, 255, 255, 0.2);
    --dropbtn-stripe-color: var(--sand);
    --light-grey-bg: var(--pearl); /* Pearl replaces light grey for crisp contrast */
    /* CTA Buttons */
    --cta-font-color: var(--pearl);
    --cta-bg-color: var(--black);
    --cta-hover-font-color: var(--black);
    --cta-hover-bg-color: var(--sand);
    --cta-invertable-font-color: var(--pearl);
    --cta-invertable-bg-color: var(--black);
    --cta-invertable-hover-font-color: var(--black);
    --cta-invertable-hover-bg-color: var(--sand);
    --quick-links-panel-btns-bg: rgba(255, 255, 255, 0.9);
    --invertable-icons: invert(0);
    /* Section Backgrounds (Using Pearl and Transparent to let the gradient show) */
    --home-s1-bg: var(--pearl);
    --home-s2-bg: transparent;
    --home-s2-bg-img-opacity: 0.1;
    --inside-page-bg: transparent;
    --inside-page-side-bg: var(--pearl);
    --inside-enquiry-gradient: linear-gradient( 0deg, var(--pearl) 0%, rgba(255, 255, 255, 0) 100% );
    /* Fonts (Black on Pearl sections, Pearl on the dark gradient) */
    --english-font: "Open Sans", sans-serif;
    --arabic-font: "Cairo", sans-serif;
    --font-size: 14px;
    --font-color: var(--black);
    --primary-font-color: var(--black);
    --secondary-font-color: var(--sand);
    --primary-font-color-inside-pages: var(--pearl); /* Needs to be pearl to read over gradient */
    --secondary-font-color-inside-pages: var(--sand);
    --primary-font-color-new: var(--black);
    /* icons */
    --icons-lg: 2rem;
    --icons-md: 1.5rem;
    --icons-sm: 1rem;
    /* spacing */
    --spacing-unit-xsm: 5px;
    --spacing-unit-sm: 20px;
    --spacing-unit-md: 40px;
    --spacing-unit-lg: 60px;
    --spacing-unit-xlg: 120px;
    --spacing-unit-xxlg: 200px;
    /* Horizontal */
    --h-margin-ltr-xsm: 0 0 0 var(--spacing-unit-xsm);
    --h-margin-ltr-sm: 0 0 0 var(--spacing-unit-sm);
    --h-margin-ltr-md: 0 0 0 var(--spacing-unit-md);
    --h-margin-ltr-lg: 0 0 0 var(--spacing-unit-lg);
    --h-margin-rtl-xsm: 0 var(--spacing-unit-xsm) 0 0;
    --h-margin-rtl-sm: 0 var(--spacing-unit-sm) 0 0;
    --h-margin-rtl-md: 0 var(--spacing-unit-md) 0 0;
    --h-margin-rtl-lg: 0 var(--spacing-unit-lg) 0 0;
    --h-padding-ltr-sm: 0 0 0var (--spacing-unit-sm);
    --h-padding-ltr-md: 0 0 0var (--spacing-unit-md);
    --h-padding-ltr-lg: 0 0 0var (--spacing-unit-lg);
    --h-padding-rtl-sm: 0 var(--spacing-unit-sm) 0 0;
    --h-padding-rtl-md: 0 var(--spacing-unit-md) 0 0;
    --h-padding-rtl-lg: 0 var(--spacing-unit-lg) 0 0;
    /* Vertical */
    --v-margin-t-xsm: var(--spacing-unit-xsm) 0 0 0;
    --v-margin-t-sm: var(--spacing-unit-sm) 0 0 0;
    --v-margin-t-md: var(--spacing-unit-md) 0 0 0;
    --v-margin-t-lg: var(--spacing-unit-lg) 0 0 0;
    --v-margin-t-xlg: var(--spacing-unit-xlg) 0 0 0;
    --v-margin-t-xxlg: var(--spacing-unit-xxlg) 0 0 0;
    --v-margin-b-sm: 0 0 var(--spacing-unit-sm) 0;
    --v-margin-b-md: 0 0 var(--spacing-unit-md) 0;
    --v-margin-b-lg: 0 0 var(--spacing-unit-lg) 0;
    --v-margin-b-xlg: 0 0 var(--spacing-unit-xlg) 0;
    --v-margin-b-xxlg: 0 0 var(--spacing-unit-xxlg) 0;
    --v-margin-tb-sm: var(--spacing-unit-sm) 0 var(--spacing-unit-sm) 0;
    --v-margin-tb-md: var(--spacing-unit-md) 0 var(--spacing-unit-md) 0;
    --v-margin-tb-lg: var(--spacing-unit-lg) 0 var(--spacing-unit-lg) 0;
    --v-margin-tb-xlg: var(--spacing-unit-xlg) 0 var(--spacing-unit-xlg) 0;
    --v-margin-tb-xxlg: var(--spacing-unit-xxlg) 0 var(--spacing-unit-xxlg) 0;
    --v-padding-t-sm: var(--spacing-unit-sm) 0 0 0;
    --v-padding-t-md: var(--spacing-unit-md) 0 0 0;
    --v-padding-t-lg: var(--spacing-unit-lg) 0 0 0;
    --v-padding-t-xlg: var(--spacing-unit-xlg) 0 0 0;
    --v-padding-b-sm: 0 0 var(--spacing-unit-sm) 0;
    --v-padding-b-md: 0 0 var(--spacing-unit-md) 0;
    --v-padding-b-lg: 0 0 var(--spacing-unit-lg) 0;
    --v-padding-b-xlg: 0 0 var(--spacing-unit-xlg) 0;
    --v-padding-tb-sm: var(--spacing-unit-sm) 0 var(--spacing-unit-sm) 0;
    --v-padding-tb-md: var(--spacing-unit-md) 0 var(--spacing-unit-md) 0;
    --v-padding-tb-lg: var(--spacing-unit-lg) 0 var(--spacing-unit-lg) 0;
    --v-padding-tb-xlg: var(--spacing-unit-xlg) 0 var(--spacing-unit-xlg) 0;
    /* logo svg */
    --logo-url: url("../../Content/media/svg-icons/ajb-black-logo.svg");
    /* --- LIGHT MODE CAROUSEL IMAGES (ENGLISH) --- */
    --slide-tcs-en-desk: url("/Content/media/home/carousel/new-theme/TCS-En-Black.png");
    --slide-tcs-en-mob: url("/Content/media/home/carousel/new-theme/TCS-En-MOBILE-black.png");
    --slide-surplus-en-desk: url("/Content/media/home/carousel/new-theme/B1-Surplus-En-black.png");
    --slide-surplus-en-mob: url("/Content/media/home/carousel/new-theme/B1-Surplus-En-MOBILE-black.png");
    --slide-medical-en-desk: url("/Content/media/home/carousel/new-theme/MED-En-Black.png");
    --slide-medical-en-mob: url("/Content/media/home/carousel/new-theme/MED-En-MOBILE-black.png");
    --slide-motor-en-desk: url("/Content/media/home/carousel/new-theme/Motor-En-black.png");
    --slide-motor-en-mob: url("/Content/media/home/carousel/new-theme/Motor-En-MOBILE-black.png");
    /* --- LIGHT MODE SERVICES PANEL ICONS (ENGLISH) --- */
    --service-panel-pns-icon: url("../../Content/media/svg-icons/protection-icon-black.svg");
    --service-panel-medical-icon: url("../../Content/media/svg-icons/medical-icon-black.svg");
    --service-panel-motor-icon: url("../../Content/media/svg-icons/motor-icon-black.svg");
    --service-panel-marine-icon: url("../../Content/media/svg-icons/marine-icon-black.svg");
    --service-panel-travel-icon: url("../../Content/media/svg-icons/travel-icon-black.svg");
    --service-panel-mmp-icon: url("../../Content/media/svg-icons/medicalmalpractice-icon-black.svg");
    --service-panel-vv-icon: url("../../Content/media/svg-icons/visitvisa-icon-black.svg");
    --service-panel-craftsmen-icon: url("../../Content/media/svg-icons/craftsmen-icon-black.svg");
    --service-panel-mdh-icon: url("../../Content/media/svg-icons/mdh-icon-black.svg");
}

[data-theme="dark"] {
    --primary-color: var(--black);
    --secondary-color: var(--sand);
    /* Backgrounds: Nav Header and Global Website Gradient */
    --main-bg-gradient: linear-gradient(to top right, var(--black) 70%, var(--gradient-accent) 100%);
    /*--main-bg-gradient: var(--black);*/
    /*--main-header-bg-gradient: linear-gradient(to top right, var(--black) 35%, var(--gradient-accent) 100%);*/
    --main-header-bg-gradient: none;
    /*--main-header-services-panel-bg-gradient: linear-gradient(to right top, var(--black) 40%, var(--gradient-accent) 100%);*/
    --services-panel-hover: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #fff 30%, #fff 70%, rgba(255, 255, 255, 0) 100%);
    --services-panel-text-hover: 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #fff, 0 0 50px #fff, 0 0 60px #fff, 0 0 70px #fff, 0 0 80px #fff;
    /*--header-bg: var(--main-header-bg-gradient);*/
    --header-bg: rgba(0, 0, 0, 0.4); /* Change 0.8 to 0 for fully invisible, or 1 for solid black */
    --nav-text-glow: rgba(255, 255, 255, 0.7); /* Bright white glow */
    --dropbtn-stripe-color: var(--sand);
    --nav-submenu-hover-bg: #222222;
    --light-grey-bg: #1a1a1a;
    /* CTA Buttons */
    --cta-invertable-font-color: var(--pearl);
    --cta-invertable-bg-color: var(--sand);
    --cta-invertable-hover-font-color: var(--pearl);
    --cta-invertable-hover-bg-color: var(--black);
    --quick-links-panel-btns-bg: var(--black);
    --invertable-icons: invert(1);
    /* Section Backgrounds */
    --home-s1-bg: var(--black);
    --home-s2-bg: transparent;
    --home-s2-bg-img-opacity: 0.05;
    --inside-page-bg: transparent;
    --inside-page-side-bg: var(--black);
    --inside-enquiry-gradient: linear-gradient(0deg, var(--black) 0%, rgba(0, 0, 0, 0) 100%);
    /* Fonts (White/Pearl for everything) */
    --primary-font-color: var(--pearl);
    --secondary-font-color: var(--sand);
    --primary-font-color-inside-pages: var(--pearl);
    --secondary-font-color-inside-pages: var(--sand);
    --primary-font-color-new: var(--pearl);
    /* logo svg */
    --logo-url: url("../../Content/media/svg-icons/ajb-white-logo.svg");
    /* --- DARK MODE CAROUSEL IMAGES (ENGLISH) --- */
    --slide-tcs-en-desk: url("/Content/media/home/carousel/new-theme/TCS-En-White.png");
    --slide-tcs-en-mob: url("/Content/media/home/carousel/new-theme/TCS-En-MOBILE-White.png");
    --slide-surplus-en-desk: url("/Content/media/home/carousel/new-theme/B1-Surplus-En-white.png");
    --slide-surplus-en-mob: url("/Content/media/home/carousel/new-theme/B1-Surplus-En-MOBILE-White.png");
    --slide-medical-en-desk: url("/Content/media/home/carousel/new-theme/MED-En-White.png");
    --slide-medical-en-mob: url("/Content/media/home/carousel/new-theme/MED-En-MOBILE-White.png");
    --slide-motor-en-desk: url("/Content/media/home/carousel/new-theme/Motor-En-White.png");
    --slide-motor-en-mob: url("/Content/media/home/carousel/new-theme/Motor-En-MOBILE-White.png");
    /* --- DARK MODE SERVICES PANEL ICONS (ENGLISH) --- */
    --service-panel-pns-icon: url("../../Content/media/svg-icons/protection-icon.svg");
    --service-panel-medical-icon: url("../../Content/media/svg-icons/medical-icon.svg");
    --service-panel-motor-icon: url("../../Content/media/svg-icons/motor-icon.svg");
    --service-panel-marine-icon: url("../../Content/media/svg-icons/marine-icon.svg");
    --service-panel-travel-icon: url("../../Content/media/svg-icons/travel-icon.svg");
    --service-panel-mmp-icon: url("../../Content/media/svg-icons/medicalmalpractice-icon.svg");
    --service-panel-vv-icon: url("../../Content/media/svg-icons/visitvisa-icon.svg");
    --service-panel-craftsmen-icon: url("../../Content/media/svg-icons/craftsmen-icon.svg");
    --service-panel-mdh-icon: url("../../Content/media/svg-icons/mdh-icon.svg");
}

    /* Invert the hardcoded black loading logos to white in dark mode */
    [data-theme="dark"] .main-preloader img,
    [data-theme="dark"] .content-loader img,
    [data-theme="dark"] .content-loader2 img {
        filter: brightness(0) invert(1);
    }

.captcha-wrapper {
    color: var(--primary-font-color);
}

    .captcha-wrapper img {
        border-radius: 15px;
    }

    .captcha-wrapper a {
        color: var(--secondary-color);
        font-style: italic;
        text-decoration: underline;
        font-weight: bold;
    }

.captcha-wrapper .error-holder{
    color: red;
}

.jconfirm .jconfirm-box {
    color: var(--primary-font-color);
    background: var(--main-bg-gradient) !important;
    border-top: solid 10px var(--secondary-color);
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    /* Set your desired background color */
    -webkit-box-shadow: 0 0 0px 1000px var(--primary-color) inset;
    /* Set your text color */
    -webkit-text-fill-color: var(--primary-font-color) !important;
    /* Prevent the background color from changing instantly */
    transition: background-color 5000s ease-in-out 0s;
}


/*Fonts*/
@import url("https://fonts.googleapis.com/css2?family=Cairo:wght@200;300;400;600;700;900&family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;0,800;1,300;1,400;1,600;1,700;1,800&display=swap");

.transition-fast {
  /**/
  -webkit-transition: all 0.3s cubic-bezier(0.75, 0, 0.125, 1);
  -moz-transition: all 0.3s cubic-bezier(0.75, 0, 0.125, 1);
  -ms-transition: all 0.3s cubic-bezier(0.75, 0, 0.125, 1);
  -o-transition: all 0.3s cubic-bezier(0.75, 0, 0.125, 1);
  transition: all 0.3s cubic-bezier(0.75, 0, 0.125, 1);
}

.transition-medium {
  /**/
  -webkit-transition: all 1.5s cubic-bezier(0.75, 0, 0.125, 1);
  -moz-transition: all 1.5s cubic-bezier(0.75, 0, 0.125, 1);
  -ms-transition: all 1.5s cubic-bezier(0.75, 0, 0.125, 1);
  -o-transition: all 1.5s cubic-bezier(0.75, 0, 0.125, 1);
  transition: all 1.5s cubic-bezier(0.75, 0, 0.125, 1);
}

/*hidden*/
.hidden {
  opacity: 0;
  transform: translateY(40px);
}

.scroll-content {
  /**/
  -webkit-transition: background-color 0.3s cubic-bezier(0.75, 0, 0.125, 1);
  -moz-transition: background-color 0.3s cubic-bezier(0.75, 0, 0.125, 1);
  -ms-transition: background-color 0.3s cubic-bezier(0.75, 0, 0.125, 1);
  -o-transition: background-color 0.3s cubic-bezier(0.75, 0, 0.125, 1);
  transition: background-color 0.3s cubic-bezier(0.75, 0, 0.125, 1);
}

