/* RTPL header — colours taken from the RTPL logo */
:root {
	--rtpl-navy: #1d2b5e;
	--rtpl-navy-deep: #131c40;
	--rtpl-red: #d8261f;
	--rtpl-yellow: #f6c90e;
	--rtpl-gold: #e0a526;
	--rtpl-ink: #1b1f33;
	--rtpl-muted: #5b6280;
	--rtpl-surface: #f4f6fb;
	--rtpl-border: rgba(29, 43, 94, 0.12);

	/* Bootstrap overrides */
	--bs-primary: var(--rtpl-navy);
	--bs-primary-rgb: 29, 43, 94;
	--bs-danger: var(--rtpl-red);
	--bs-warning: var(--rtpl-yellow);
	--bs-link-color: var(--rtpl-navy);
	--bs-link-hover-color: var(--rtpl-red);
	--bs-body-color: var(--rtpl-ink);
}

/* ---------- Shell ---------- */
.rtpl-header {
	position: relative;
	z-index: 1050;
	background: #fff;
	border-bottom: 1px solid var(--rtpl-border);
	transition: box-shadow 0.3s ease;
}
.rtpl-header::after { /* logo-inspired gradient accent line */
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: -1px;
	height: 3px;
	background: linear-gradient(90deg, var(--rtpl-navy) 0%, var(--rtpl-red) 45%, var(--rtpl-yellow) 100%);
}
.rtpl-header.is-scrolled { box-shadow: 0 8px 28px rgba(19, 28, 64, 0.12); }
.admin-bar .rtpl-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .rtpl-header { top: 46px; } }

/* ---------- Top bar ---------- */
.rtpl-topbar {
	background: var(--rtpl-navy-deep);
	color: #fff;
	font-size: 0.8125rem;
	padding: 0.4rem 0;
	transition: margin 0.3s ease, opacity 0.3s ease;
}
.rtpl-header.is-scrolled .rtpl-topbar { display: none !important; }
.rtpl-topbar a { color: rgba(255, 255, 255, 0.86); text-decoration: none; transition: color 0.2s; }
.rtpl-topbar a:hover { color: var(--rtpl-yellow); }

.rtpl-toplinks { gap: 0; }
.rtpl-toplinks li { position: relative; padding: 0 0.85rem; text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.75rem; }
.rtpl-toplinks li + li::before {
	content: ""; position: absolute; left: 0; top: 15%; height: 70%; width: 2px;
	background: var(--rtpl-red);
}
.rtpl-phone { display: inline-flex; align-items: center; gap: 0.5rem; line-height: 1.1; }
.rtpl-phone small { text-transform: uppercase; font-size: 0.625rem; letter-spacing: 0.08em; opacity: 0.7; max-width: 4.5rem; }
.rtpl-phone strong { font-size: 1.05rem; color: var(--rtpl-yellow); font-weight: 700; }

/* ---------- Main navbar ---------- */
.navbar-brand{
	padding-top: 0px;
	padding-bottom: 0px;
}
/* .rtpl-navbar { padding: 0.6rem 0; } */
.rtpl-logo img,
.rtpl-logo .custom-logo { height: 90px; width: auto; transition: height 0.3s ease; }
.rtpl-header.is-scrolled .rtpl-logo img,
.rtpl-header.is-scrolled .rtpl-logo .custom-logo { height: 48px; }
.rtpl-logo a { color: var(--rtpl-navy); font-weight: 800; font-size: 1.4rem; text-decoration: none; display: block;}

.rtpl-nav { gap: 0.15rem; }
.rtpl-nav .nav-link {
	position: relative;
	color: var(--rtpl-ink);
	font-weight: 500;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	padding: 0.55rem 0.85rem;
	border-radius: 999px;
	transition: color 0.2s, background 0.2s;
}
.rtpl-nav .nav-link:hover,
.rtpl-nav .nav-link.show,
.rtpl-nav .nav-link.active {
	color: var(--rtpl-navy);
	background: var(--rtpl-surface);
}
.rtpl-nav .nav-link.active::after { /* active dot */
	content: ""; position: absolute; left: 50%; bottom: 2px; width: 5px; height: 5px;
	margin-left: -2.5px; border-radius: 50%; background: var(--rtpl-red);
}
.rtpl-nav .dropdown-toggle::after {
	border: 0; width: 0.5rem; height: 0.5rem; margin-left: 0.4rem; vertical-align: 0.1em;
	border-right: 2px solid var(--rtpl-red); border-bottom: 2px solid var(--rtpl-red);
	transform: rotate(45deg); transition: transform 0.25s;
}
.rtpl-nav .dropdown-toggle.show::after { transform: rotate(225deg) translate(-2px, -2px); }

/* Dropdown */
.rtpl-dropdown {
	border: 1px solid var(--rtpl-border);
	border-radius: 14px;
	padding: 0.5rem;
	margin-top: 0.6rem !important;
	min-width: 15rem;
	box-shadow: 0 18px 40px rgba(19, 28, 64, 0.16);
	animation: rtplDrop 0.18s ease-out;
}
.rtpl-dropdown .dropdown-item {
	border-radius: 9px; padding: 0.55rem 0.85rem; font-size: 14px; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rtpl-ink);
}
.rtpl-dropdown .dropdown-item:hover,
.rtpl-dropdown .dropdown-item:focus,
.rtpl-dropdown .dropdown-item.active {
	background: var(--rtpl-surface); color: var(--rtpl-red);
}
@keyframes rtplDrop { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* CTA */
.rtpl-cta {
	background: linear-gradient(135deg, var(--rtpl-red), #ef4a2b);
	color: #fff;
	font-weight: 600;
	border: 0;
	border-radius: 999px;
	padding: 0.6rem 1.4rem;
	white-space: nowrap;
	box-shadow: 0 6px 16px rgba(216, 38, 31, 0.3);
	transition: transform 0.2s, box-shadow 0.2s;
}
.rtpl-cta:hover, .rtpl-cta:focus { color: #fff; transform: translateY(-2px); box-shadow: 0 10px 22px rgba(216, 38, 31, 0.38); }

/* ---------- Mobile ---------- */
.rtpl-toggler { border: 0; padding: 0.5rem; width: 44px; height: 44px; display: flex; flex-direction: column; justify-content: center; gap: 5px; box-shadow: none !important; }
.rtpl-toggler span { display: block; height: 2px; border-radius: 2px; background: var(--rtpl-navy); }
.rtpl-toggler span:nth-child(2) { width: 70%; background: var(--rtpl-red); }

.rtpl-offcanvas { border-left: 0; }
.rtpl-offcanvas .offcanvas-header { background: var(--rtpl-navy); color: #fff; }
.rtpl-offcanvas .btn-close { filter: invert(1); }
.rtpl-mobile-contact a { display: block; color: var(--rtpl-navy); font-weight: 600; text-decoration: none; padding: 0.25rem 0; }

@media (max-width: 991.98px) {
	.rtpl-nav .nav-link { border-radius: 10px; padding: 0.75rem 0.9rem; }
	.rtpl-dropdown { box-shadow: none; border: 0; background: var(--rtpl-surface); margin-top: 0 !important; animation: none; }
	.rtpl-cta { display: block; text-align: center; }
	.rtpl-logo img, .rtpl-logo .custom-logo { height: 52px; }
}

@media (prefers-reduced-motion: reduce) {
	.rtpl-header, .rtpl-dropdown, .rtpl-cta, .rtpl-logo img { transition: none; animation: none; }
}

/* Invisible bridge so the pointer can travel from the link to the dropdown without closing it */
@media (min-width: 992px) {
	.rtpl-dropdown { margin-top: 0 !important; }
	.rtpl-dropdown::before { content: ""; position: absolute; left: 0; right: 0; top: -0.75rem; height: 0.75rem; }
}
