/*
Theme Name: Redfield & Wilton Strategies
Theme URI: https://redfieldandwiltonstrategies.com/
Author: Redfield & Wilton Strategies
Description: Chrome only. Header, navigation, footer, typography and the page shell. All content and functionality lives in the RWS Client Portal plugin, so this theme can be replaced without losing the site.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: rws-theme
*/

/**
 * NOTE ON UNITS
 *
 * This theme does NOT do the html { font-size: 62.5% } trick the old site did.
 * 1rem is 16px here, as the browser intends. The plugin's stylesheets are all in
 * px, which is safe either way. Do not reintroduce the 62.5% hack: it silently
 * shrinks every rem on the site and you will spend a day finding out why.
 */

:root {
	--rws-ink: #0f1b2d;
	--rws-body: #4a5768;
	--rws-muted: #6b7889;
	--rws-line: #dbe2ea;
	--rws-accent: #14477d;
	--rws-accent-dark: #0e3159;
	--rws-alt: #f4f6f9;

	--rws-header-h: 84px;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

body {
	margin: 0;
	background: #fff;
	color: var(--rws-body);
	font-family: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
	font-size: 16px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
	text-wrap: balance;
}

p, li {
	text-wrap: pretty;
}

img {
	max-width: 100%;
	height: auto;
}

/* ---------- Skip link ---------- */

.rws-skip {
	position: absolute;
	left: -9999px;
	z-index: 999;
	padding: 12px 20px;
	background: var(--rws-accent);
	color: #fff;
	text-decoration: none;
}

.rws-skip:focus {
	left: 16px;
	top: 16px;
}

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

.rws-header {
	position: relative;
	z-index: 20;
	background: #fff;
	border-bottom: 1px solid var(--rws-line);
}

.rws-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	width: 100%;
	max-width: 1120px;
	min-height: var(--rws-header-h);
	margin: 0 auto;
	padding: 14px 20px;
}

.rws-header__brand img,
.rws-header__brand .custom-logo {
	display: block;
	max-height: 56px;
	width: auto;
}

.rws-header__wordmark {
	text-decoration: none;
}

.rws-header__name {
	color: var(--rws-ink);
	font-size: 17px;
	font-weight: 700;
	letter-spacing: 0.02em;
	line-height: 1.2;
}

/* ---------- Burger ---------- */

.rws-burger {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 5px;
	width: 44px;
	height: 44px;
	padding: 0;
	background: transparent;
	border: 1px solid var(--rws-line);
	border-radius: 8px;
	cursor: pointer;
}

.rws-burger__bar {
	display: block;
	width: 18px;
	height: 2px;
	background: var(--rws-ink);
	border-radius: 2px;
}

.rws-burger:focus-visible {
	outline: 3px solid rgba(20, 71, 125, 0.4);
	outline-offset: 2px;
}

/* -------------------------------------------------------------------------
 * Navigation
 *
 * The menu is VISIBLE by default and hidden by JS on small screens. If the
 * script never runs, a phone visitor gets a stacked, usable menu instead of a
 * dead burger button. That is why the hiding rule is scoped to .rws-has-js.
 * ---------------------------------------------------------------------- */

.rws-nav__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 26px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.rws-nav__list a {
	display: inline-block;
	padding: 6px 0;
	color: var(--rws-ink);
	font-size: 15px;
	text-decoration: none;
	transition: color 0.15s ease;
}

.rws-nav__list a:hover,
.rws-nav__list a:focus {
	color: var(--rws-accent);
}

/* The current page. */
.rws-nav__list .current-menu-item > a,
.rws-nav__list .current_page_item > a {
	font-weight: 700;
}

/*
 * The Client Portal and Get the Product items read as buttons.
 * Add the CSS class rws-nav-cta to a menu item in Appearance > Menus.
 * (Screen Options > CSS Classes must be ticked to see the field.)
 */
.rws-nav__list .rws-nav-cta > a {
	padding: 10px 20px;
	background: var(--rws-accent);
	border-radius: 8px;
	color: #fff;
	font-weight: 600;
}

.rws-nav__list .rws-nav-cta > a:hover,
.rws-nav__list .rws-nav-cta > a:focus {
	background: var(--rws-accent-dark);
	color: #fff;
}

@media (max-width: 899px) {
	.rws-has-js .rws-nav {
		display: none;
		order: 3;
		width: 100%;
		padding-top: 14px;
		border-top: 1px solid var(--rws-line);
	}

	.rws-has-js .rws-nav.is-open {
		display: block;
	}

	.rws-header__inner {
		flex-wrap: wrap;
	}

	.rws-nav__list {
		flex-direction: column;
		align-items: stretch;
		gap: 2px;
	}

	.rws-nav__list a {
		padding: 12px 0;
	}

	.rws-nav__list .rws-nav-cta > a {
		text-align: center;
	}
}

@media (min-width: 900px) {
	.rws-burger {
		display: none;
	}
}

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

.rws-main {
	display: block;
	min-height: 40vh;
}

/* Full bleed pages (home, archive, portal) render their shortcode edge to edge
   and supply their own spacing. */
.rws-full-bleed .rws-main {
	padding: 0;
}

/* ---------- Ordinary pages ---------- */

.rws-page {
	padding: 56px 0 80px;
}

.rws-page__inner {
	width: 100%;
	max-width: 760px;
	margin: 0 auto;
	padding: 0 20px;
}

.rws-page__inner--centred {
	text-align: center;
}

.rws-page__title {
	margin: 0 0 24px;
	color: var(--rws-ink);
	font-size: 32px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -0.02em;
}

.rws-page__title a {
	color: inherit;
	text-decoration: none;
}

.rws-page__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 50px;
	padding: 13px 28px;
	background: var(--rws-accent);
	border-radius: 8px;
	color: #fff;
	font-weight: 600;
	text-decoration: none;
}

.rws-page__btn:hover,
.rws-page__btn:focus {
	background: var(--rws-accent-dark);
	color: #fff;
}

/* ---------- Prose (privacy, cookie, disclaimer, posts) ---------- */

.rws-prose {
	font-size: 16px;
	line-height: 1.75;
}

.rws-prose h2 {
	margin: 36px 0 12px;
	color: var(--rws-ink);
	font-size: 24px;
	font-weight: 700;
	line-height: 1.3;
}

.rws-prose h3 {
	margin: 28px 0 10px;
	color: var(--rws-ink);
	font-size: 19px;
	font-weight: 700;
}

.rws-prose p,
.rws-prose li {
	margin: 0 0 16px;
}

.rws-prose ul,
.rws-prose ol {
	padding-left: 22px;
}

.rws-prose a {
	color: var(--rws-accent);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.rws-prose strong {
	color: var(--rws-ink);
}

/* -------------------------------------------------------------------------
 * Footer
 * ---------------------------------------------------------------------- */

.rws-footer {
	background: var(--rws-ink);
	color: rgba(255, 255, 255, 0.68);
}

.rws-footer__inner {
	display: grid;
	grid-template-columns: 1fr;
	gap: 36px;
	width: 100%;
	max-width: 1120px;
	margin: 0 auto;
	padding: 56px 20px;
}

.rws-footer__title {
	margin: 0 0 14px;
	color: #fff;
	font-size: 17px;
	font-weight: 700;
}

.rws-footer__text {
	margin: 0 0 10px;
	font-size: 15px;
	line-height: 1.6;
}

.rws-footer__legal {
	margin: 0;
	font-size: 14px;
	line-height: 1.65;
}

.rws-footer__link {
	color: rgba(255, 255, 255, 0.85);
	text-decoration: none;
}

.rws-footer__link:hover,
.rws-footer__link:focus {
	color: #fff;
	text-decoration: underline;
}

.rws-footer__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.rws-footer__list li {
	margin-bottom: 8px;
}

.rws-footer__list a {
	color: rgba(255, 255, 255, 0.72);
	font-size: 15px;
	text-decoration: none;
}

.rws-footer__list a:hover,
.rws-footer__list a:focus {
	color: #fff;
}

.rws-footer__bar {
	border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.rws-footer__bar p {
	max-width: 1120px;
	margin: 0 auto;
	padding: 22px 20px;
	color: rgba(255, 255, 255, 0.5);
	font-size: 13px;
	text-align: center;
}

@media (min-width: 800px) {
	.rws-footer__inner {
		grid-template-columns: 2fr 1fr 1fr;
		gap: 48px;
	}
}

@media (prefers-reduced-motion: reduce) {
	* {
		transition: none !important;
		animation: none !important;
	}
}