/*
 * Ruggiero Fencing site styles.
 * Tokens mirror the Elementor kit (scripts/set-kit.php). Change both together.
 *
 * Navy #0F2140 and gold #C9A15A are sampled from the owner's AI flyer logo
 * (Watermarks/fofl ads/Ruggiero Fencing LLC/22d728c8…jpeg): navy ~#061830, gold ~#9C783C,
 * lifted so they hold contrast on screen. One accent: gold. Navy is the ground, not an accent.
 * Contrast, measured 2026-11-12 (WCAG 2.x):
 *   body  #2A3342 on white 12.72:1   on panel #F2F4F7 11.55:1
 *   muted #566173 on white  6.26:1   on panel          5.68:1
 *   ink   #0F2140 on white 16.01:1
 *   gold-text #86601F on white 5.67:1 (small gold text on light)
 *   navy on gold button #C9A15A 6.65:1, hover #B38A45 5.06:1
 *   on-navy #DCE3EE 12.40:1, on-navy muted #A9B6CA 7.80:1, gold-light #D9B978 on navy 8.51:1
 * Type scale 1.25 from 17px: 14 17 21 27 33 42 52. Spacing: 4 8 12 16 24 32 48 64 96 128.
 */

:root {
	--rf-navy: #0F2140;
	--rf-navy-deep: #0A1830;
	--rf-white: #FFFFFF;
	--rf-panel: #F2F4F7;
	--rf-line: #D8DDE5;
	--rf-body: #2A3342;
	--rf-muted: #566173;
	--rf-ink: #0F2140;
	--rf-gold: #C9A15A;
	--rf-gold-hover: #B38A45;
	--rf-gold-text: #86601F;
	--rf-gold-light: #D9B978;
	--rf-on-navy: #DCE3EE;
	--rf-on-navy-muted: #A9B6CA;

	--rf-display: "Archivo Narrow", "Arial Narrow", "Roboto Condensed", sans-serif;
	--rf-text: "Public Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

	--rf-fs-14: 0.875rem;
	--rf-fs-17: 1.0625rem;
	--rf-fs-21: 1.3125rem;
	--rf-fs-27: 1.6875rem;
	--rf-fs-33: 2.0625rem;
	--rf-fs-42: 2.625rem;
	--rf-fs-52: 3.25rem;

	--rf-radius: 4px;
	--rf-measure: 66ch;
}

/* ---------------------------------------------------------------- Base */

body {
	background: var(--rf-white);
	color: var(--rf-body);
	font-family: var(--rf-text);
	font-size: var(--rf-fs-17);
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	overflow-x: hidden;
}
body a { color: var(--rf-navy); text-underline-offset: 3px; }
body a:hover { color: var(--rf-gold-text); }
:focus-visible { outline: 2px solid var(--rf-gold); outline-offset: 3px; }

.elementor-widget-heading .elementor-heading-title,
body h1, body h2, body h3, body h4 {
	font-family: var(--rf-display);
	font-weight: 700;
	color: var(--rf-ink);
	line-height: 1.1;
	text-wrap: balance;
	letter-spacing: 0;
}
body h1, .elementor-widget-heading h1.elementor-heading-title { font-size: var(--rf-fs-52); }
body h2, .elementor-widget-heading h2.elementor-heading-title { font-size: var(--rf-fs-42); }
body h3, .elementor-widget-heading h3.elementor-heading-title { font-size: var(--rf-fs-27); line-height: 1.2; }
body h4, .elementor-widget-heading h4.elementor-heading-title { font-size: var(--rf-fs-21); line-height: 1.25; }

.elementor-widget-text-editor { color: var(--rf-body); font-size: var(--rf-fs-17); line-height: 1.6; }
.elementor-widget-text-editor p { margin: 0 0 16px; max-width: var(--rf-measure); }
.elementor-widget-text-editor p:last-child { margin-bottom: 0; }
.elementor-widget-text-editor ul { margin: 0; padding-left: 20px; }
.elementor-widget-text-editor li { margin-bottom: 8px; }

@media (max-width: 767px) {
	body h1, .elementor-widget-heading h1.elementor-heading-title { font-size: var(--rf-fs-33); }
	body h2, .elementor-widget-heading h2.elementor-heading-title { font-size: var(--rf-fs-27); }
	body h3, .elementor-widget-heading h3.elementor-heading-title { font-size: var(--rf-fs-21); }
}

/* ---------------------------------------------------------------- Sections */

.rf-section { padding: 96px 24px; background: var(--rf-white); }
.rf-section--panel { background: var(--rf-panel); }
.rf-section--tight { padding-top: 48px; padding-bottom: 48px; }
.rf-section--navy { background: var(--rf-navy); }
@media (max-width: 767px) {
	.rf-section { padding: 48px 16px; }
	.rf-section--tight { padding-top: 32px; padding-bottom: 32px; }
}

.rf-eyebrow .elementor-heading-title,
p.rf-eyebrow {
	font-family: var(--rf-text) !important;
	font-size: var(--rf-fs-14) !important;
	font-weight: 700 !important;
	letter-spacing: 0.08em !important;
	text-transform: uppercase;
	color: var(--rf-gold-text) !important;
	line-height: 1.4 !important;
}
.rf-lead, .rf-lead p { font-size: var(--rf-fs-21); line-height: 1.5; }
@media (max-width: 767px) { .rf-lead, .rf-lead p { font-size: var(--rf-fs-17); } }
.rf-muted, .rf-muted p { color: var(--rf-muted); font-size: var(--rf-fs-14); }

/* Navy surfaces: hero, proof strip, CTA band, footer */
.rf-section--navy .elementor-heading-title,
.rf-hero .elementor-heading-title,
.rf-cta .elementor-heading-title { color: var(--rf-white); }
.rf-section--navy .elementor-widget-text-editor,
.rf-hero .elementor-widget-text-editor,
.rf-cta .elementor-widget-text-editor { color: var(--rf-on-navy); }
.rf-section--navy .rf-eyebrow .elementor-heading-title,
.rf-hero .rf-eyebrow .elementor-heading-title,
.rf-cta .rf-eyebrow .elementor-heading-title { color: var(--rf-gold-light) !important; }
.rf-hero a:not(.elementor-button), .rf-cta a:not(.elementor-button) { color: var(--rf-gold-light); }

/* ---------------------------------------------------------------- Hero */

.rf-hero { background: var(--rf-navy); padding: 96px 24px; }
@media (max-width: 767px) { .rf-hero { padding: 48px 16px; } }
.rf-hero__photo img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: var(--rf-radius);
	display: block;
}
.rf-hero__facts {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 8px 24px;
	color: var(--rf-on-navy);
	font-size: var(--rf-fs-14);
	font-weight: 600;
}
.rf-hero__facts li::before { content: "\2713"; color: var(--rf-gold-light); margin-right: 8px; }

/* ---------------------------------------------------------------- Buttons */

.elementor-button {
	background: var(--rf-gold) !important;
	color: var(--rf-navy) !important;
	font-family: var(--rf-text) !important;
	font-weight: 700 !important;
	font-size: var(--rf-fs-17) !important;
	border-radius: var(--rf-radius) !important;
	padding: 16px 24px !important;
	line-height: 1.2 !important;
	border: 2px solid var(--rf-gold) !important;
}
.elementor-button:hover, .elementor-button:focus { background: var(--rf-gold-hover) !important; border-color: var(--rf-gold-hover) !important; }
.rf-btn-ghost .elementor-button { background: transparent !important; color: var(--rf-navy) !important; border-color: var(--rf-navy) !important; }
.rf-btn-ghost .elementor-button:hover { background: var(--rf-navy) !important; color: var(--rf-white) !important; }
.rf-hero .rf-btn-ghost .elementor-button,
.rf-cta .rf-btn-ghost .elementor-button { color: var(--rf-white) !important; border-color: var(--rf-on-navy-muted) !important; }
.rf-hero .rf-btn-ghost .elementor-button:hover,
.rf-cta .rf-btn-ghost .elementor-button:hover { background: var(--rf-white) !important; color: var(--rf-navy) !important; }
.rf-btn-small .elementor-button { padding: 12px 16px !important; font-size: var(--rf-fs-14) !important; }

/* ---------------------------------------------------------------- Cards */

.rf-card {
	background: var(--rf-white);
	border: 1px solid var(--rf-line);
	border-top: 4px solid var(--rf-gold);
	border-radius: var(--rf-radius);
	padding: 32px 24px;
}
.rf-section--panel .rf-card { background: var(--rf-white); }
.rf-card .elementor-widget-text-editor { font-size: var(--rf-fs-17); }
@media (max-width: 767px) { .rf-card { padding: 24px 16px; } }

.rf-photo img { width: 100%; border-radius: var(--rf-radius); display: block; object-fit: cover; }
.rf-photo--wide img { aspect-ratio: 3 / 1; }
.rf-caption, .rf-caption p { font-size: var(--rf-fs-14); color: var(--rf-muted); }

/* ---------------------------------------------------------------- Proof strip */

.rf-proof {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 24px;
	text-align: left;
}
.rf-proof__item { border-left: 2px solid var(--rf-gold); padding-left: 16px; }
.rf-proof__big { display: block; font-family: var(--rf-display); font-weight: 700; font-size: var(--rf-fs-27); color: var(--rf-white); line-height: 1.2; }
.rf-proof__small { display: block; font-size: var(--rf-fs-14); color: var(--rf-on-navy-muted); }
@media (max-width: 1024px) { .rf-proof { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ---------------------------------------------------------------- Reviews */

.rf-quote {
	margin: 0;
	padding: 24px;
	background: var(--rf-white);
	border: 1px solid var(--rf-line);
	border-radius: var(--rf-radius);
	height: 100%;
}
.rf-quote p { font-size: var(--rf-fs-17); margin: 0 0 12px; color: var(--rf-body); }
.rf-quote footer { font-size: var(--rf-fs-14); color: var(--rf-muted); font-weight: 600; }
.rf-stars { color: var(--rf-gold-text); letter-spacing: 0.08em; font-size: var(--rf-fs-14); margin-bottom: 8px; display: block; }

/* ---------------------------------------------------------------- Offer strip */

.rf-offer {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 24px;
	align-items: center;
	justify-content: space-between;
	background: var(--rf-white);
	border: 1px solid var(--rf-line);
	border-left: 6px solid var(--rf-gold);
	border-radius: var(--rf-radius);
	padding: 24px;
}
.rf-offer strong { font-family: var(--rf-display); font-size: var(--rf-fs-27); color: var(--rf-ink); display: block; line-height: 1.2; }
.rf-offer span { color: var(--rf-muted); font-size: var(--rf-fs-14); }
.rf-offer a { font-weight: 700; }

/* ---------------------------------------------------------------- Lists */

.rf-checks { list-style: none; padding: 0 !important; margin: 0; }
.rf-checks li { padding-left: 28px; position: relative; margin-bottom: 12px; }
.rf-checks li::before { content: "\2713"; position: absolute; left: 0; color: var(--rf-gold-text); font-weight: 700; }

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

.rf-topbar { background: var(--rf-navy); color: var(--rf-on-navy); font-size: var(--rf-fs-14); }
.rf-topbar__row { display: flex; justify-content: space-between; gap: 24px; padding: 8px 0; flex-wrap: wrap; }
.rf-topbar a { color: var(--rf-gold-light); font-weight: 700; text-decoration: none; }
.rf-header { background: var(--rf-white); border-bottom: 1px solid var(--rf-line); }
.rf-logo img { width: 260px !important; max-width: 60vw; height: auto; }
@media (max-width: 767px) { .rf-logo img { width: 190px !important; } }
.rf-header .elementor-nav-menu a { font-weight: 600; color: var(--rf-ink) !important; font-size: var(--rf-fs-17); }
.rf-header .elementor-nav-menu a:hover,
.rf-header .elementor-nav-menu a.elementor-item-active { color: var(--rf-gold-text) !important; }
.rf-header .elementor-nav-menu--main .elementor-item:after { background-color: var(--rf-gold) !important; }
.rf-header .elementor-menu-toggle { color: var(--rf-ink); background: transparent; font-size: 24px; }
.rf-header .elementor-nav-menu--dropdown { background: var(--rf-white); border-top: 1px solid var(--rf-line); }
@media (max-width: 1024px) { .rf-header-cta { display: none; } }

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

.rf-footer { background: var(--rf-navy-deep); color: var(--rf-on-navy); }
.rf-footer .elementor-heading-title { color: var(--rf-white); font-size: var(--rf-fs-21) !important; }
.rf-footer .elementor-widget-text-editor { color: var(--rf-on-navy); font-size: var(--rf-fs-17); }
.rf-footer a { color: var(--rf-on-navy); }
.rf-footer a:hover { color: var(--rf-gold-light); }
.rf-footer ul { list-style: none; padding: 0; margin: 0; }
.rf-footer li { margin-bottom: 8px; }
.rf-footer__legal { border-top: 1px solid rgba(220, 227, 238, 0.18); }
.rf-footer__legal .elementor-widget-text-editor, .rf-footer__legal p { font-size: var(--rf-fs-14); color: var(--rf-on-navy-muted); }
.rf-footer-logo img { width: 220px !important; height: auto; background: var(--rf-white); padding: 12px 16px; border-radius: var(--rf-radius); }

/* ---------------------------------------------------------------- Gravity Forms */

.gform_wrapper.gravity-theme .gfield_label { font-weight: 700; color: var(--rf-ink); font-size: var(--rf-fs-17); }
.gform_wrapper.gravity-theme input[type=text],
.gform_wrapper.gravity-theme input[type=email],
.gform_wrapper.gravity-theme input[type=tel],
.gform_wrapper.gravity-theme select,
.gform_wrapper.gravity-theme textarea {
	border: 1px solid var(--rf-line);
	border-radius: var(--rf-radius);
	padding: 12px;
	font-size: var(--rf-fs-17);
	background: var(--rf-white);
}
.gform_wrapper.gravity-theme .gform_footer input[type=submit],
.gform_wrapper .gform_button {
	background: var(--rf-gold) !important;
	color: var(--rf-navy) !important;
	font-weight: 700;
	font-size: var(--rf-fs-17);
	border: 0;
	border-radius: var(--rf-radius);
	padding: 16px 32px;
	cursor: pointer;
}
.gform_wrapper .gform_button:hover { background: var(--rf-gold-hover) !important; }

/* ---------------------------------------------------------------- Mobile call bar */

.rf-callbar { display: none; }
@media (max-width: 767px) {
	.rf-callbar {
		display: grid;
		grid-template-columns: 1fr 1fr;
		position: fixed;
		left: 0; right: 0; bottom: 0;
		z-index: 999;
		box-shadow: 0 -2px 8px rgba(10, 24, 48, 0.2);
	}
	.rf-callbar a {
		display: block;
		text-align: center;
		padding: 16px 8px;
		font-weight: 700;
		font-size: var(--rf-fs-17);
		text-decoration: none;
	}
	.rf-callbar__call { background: var(--rf-navy); color: var(--rf-white) !important; }
	.rf-callbar__quote { background: var(--rf-gold); color: var(--rf-navy) !important; }
	body { padding-bottom: 56px; }
}

/* Paired work photos: same crop so the row lines up whatever the source size. */
.rf-photo--pair img { aspect-ratio: 4 / 3; height: auto; }
.rf-quote { box-sizing: border-box; }

/* Header row: logo and menu stay on one line at every width. */
.rf-header.e-con, .rf-header > .e-con-inner { flex-wrap: nowrap !important; }
.rf-header .rf-logo { width: auto !important; flex: 0 0 auto; }
.rf-header .rf-logo + .e-con { width: auto !important; flex: 1 1 auto; }
