/* =====================================================================
   DATA 7 Solutions — brand overrides for the Dimension template.
   Loaded AFTER main.css so equal-specificity rules win by source order.
   Brand palette:  #229DEF (primary)  #0e7fb9 (hover)  #006599 (deep)
   ===================================================================== */

:root { --data7: #229DEF; --data7-hover: #0e7fb9; --data7-deep: #006599; }

/* --- Links --- */
#wrapper a {
	color: #6cc3ff;
	border-bottom-color: rgba(108, 195, 255, 0.5);
}
#wrapper a:hover {
	color: #9ed7ff;
	border-bottom-color: transparent;
}

/* --- Logo: DATA7 wordmark shown as a banner (not the default circle) --- */
#header .logo {
	width: auto;
	height: auto;
	line-height: normal;
	border: 0;
	border-radius: 0;
	margin-bottom: 1.75rem;
}
#header .logo img {
	display: block;
	width: 15rem;
	max-width: 62vw;
	height: auto;
	margin: 0 auto;
}

/* --- Section sub-heading icons (Services) --- */
#main article h3 .icon {
	color: var(--data7);
	margin-right: 0.5rem;
}

/* --- Primary buttons / submit --- */
#wrapper input[type="submit"].primary,
#wrapper input[type="reset"].primary,
#wrapper input[type="button"].primary,
#wrapper button.primary,
#wrapper .button.primary {
	background-color: var(--data7);
	color: #ffffff !important;
	box-shadow: none;
}
#wrapper input[type="submit"].primary:hover,
#wrapper input[type="reset"].primary:hover,
#wrapper input[type="button"].primary:hover,
#wrapper button.primary:hover,
#wrapper .button.primary:hover {
	background-color: var(--data7-hover);
}
#wrapper input[type="submit"].primary:active,
#wrapper button.primary:active,
#wrapper .button.primary:active {
	background-color: var(--data7-deep);
}

/* --- Form fields: focus in brand blue --- */
#wrapper input[type="text"]:focus,
#wrapper input[type="password"]:focus,
#wrapper input[type="email"]:focus,
#wrapper input[type="tel"]:focus,
#wrapper select:focus,
#wrapper textarea:focus {
	border-color: var(--data7);
	box-shadow: 0 0 0 1px var(--data7);
}

/* --- Social / contact icons hover --- */
#wrapper ul.icons a:hover {
	color: var(--data7);
}

/* --- Header content divider lines tinted to brand --- */
#header .content {
	border-color: rgba(34, 157, 239, 0.55);
}

/* --- Nav underline accent on hover --- */
#header nav ul li a:hover {
	color: #9ed7ff;
}

/* --- Popups (modal article panels): 25% smaller --- */
#main article {
	width: 30rem;                                   /* 40rem − 25% */
	padding: 3.375rem 1.875rem 1.125rem 1.875rem;   /* each − 25% */
}

/* --- Content pages built inside the home hero frame --- */
#header .content .inner.page-inner {
	max-width: 42rem;
	max-height: 80rem;              /* room for full-page content */
	padding: 2.75rem 2.75rem;
	text-align: left;
}
#header .content .inner.page-inner h2.major {
	text-align: center;
}
#header .content .inner.page-inner p {
	text-transform: none;
	letter-spacing: normal;
	font-size: 0.95rem;
	line-height: 1.7;
}
#header .content .inner.page-inner h3 {
	margin: 1.4rem 0 0.5rem 0;
	letter-spacing: normal;
	text-transform: none;
}
#header .content .inner.page-inner h3 .icon { color: var(--data7); margin-right: 0.5rem; }
#header .content .inner.page-inner .image.main { margin: 0 0 1.5rem 0; }
#header .content .inner.page-inner form { margin-top: 1.25rem; }
#header .content .inner.page-inner ul.icons { text-align: center; }
#header .content .inner.page-inner .contact-email { text-align: center; margin-top: 1.25rem; }
#header .content .inner.page-inner .contact-email .icon { color: var(--data7); margin-right: 0.4rem; }

/* Active nav item */
#header nav ul li a.active { color: #9ed7ff; box-shadow: inset 0 -2px 0 0 var(--data7); }

/* --- Background overlay: subtle blue-tinted darkening instead of grey --- */
#bg:before {
	background-image:
		linear-gradient(to top, rgba(6, 26, 43, 0.55), rgba(6, 26, 43, 0.55)),
		url("../../images/overlay.png") !important;
}

/* --- Language switch on the home hero (fixed top-right) --- */
.lang-switch.home { position: fixed; top: 1.25rem; right: 1.6rem; z-index: 100; display: flex; align-items: center; gap: 0.45rem; font-size: 0.72rem; font-weight: 600; letter-spacing: 0.14rem; font-family: "Source Sans Pro", sans-serif; }
.lang-switch.home a { color: rgba(255,255,255,0.6); text-decoration: none; text-transform: uppercase; }
.lang-switch.home a:hover { color: #9ed7ff; }
.lang-switch.home a.active { color: #229DEF; }
.lang-switch.home .sep { color: rgba(255,255,255,0.3); }

/* --- Home hero heading: 20% smaller (EN + FR) --- */
#header .content .inner h1 { font-size: 1.8rem; }        /* 2.25rem − 20% */
@media screen and (max-width: 736px) {
	#header .content .inner h1 { font-size: 1.4rem; }    /* 1.75rem − 20% */
}