/*
Theme Name:   ROYAAR
Theme URI:    https://royaar.ae
Description:  Salient child theme for ROYAAR CONSULTANCY – FZCO. Implements the ROYAAR brand system: Archivo / Newsreader / Readex Pro, paper-ink-ultramarine, square-chamfer-round geometry, hairlines instead of shadows.
Author:       ROYAAR
Author URI:   https://royaar.ae
Template:     salient
Version:      1.0.0
Text Domain:  royaar
*/

/* ============================================================================
   ROYAAR DESIGN SYSTEM
   Brand identity Edition 01 · August 2026

   Every visual declaration below carries !important so it resolves after
   Salient's own stylesheets and its Theme Options inline CSS.

   CONTENTS
   00  Tokens
   01  Foundation
   02  Typography
   03  Links
   04  Buttons
   05  Pills
   06  Cards
   07  Rules, labels, philosophy
   08  Forms
   09  Header and navigation
   10  Footer
   11  Icons and images
   12  Badges
   13  Animation
   14  Reduced motion
   15  Responsive
   16  Salient suppression
   ============================================================================ */


/* 00 · TOKENS ============================================================== */

:root {
	/* Colour — paper 88% · ink 10% · ultramarine 2% */
	--r-paper:            #FFFFFF;
	--r-mist:             #FAFAFB;
	--r-hairline:         #E8E8EB;
	--r-ash:              #B9BAC0;
	--r-slate:            #6E7076;
	--r-graphite:         #45464B;
	--r-ink:              #0B0B0C;
	--r-ultramarine:      #1F2BD0;
	--r-ultramarine-deep: #131C8F;
	--r-ultramarine-mist: #EEF0FD;

	/* Type */
	--r-sans:   'Archivo', system-ui, -apple-system, 'Segoe UI', sans-serif;
	--r-serif:  'Newsreader', Georgia, 'Times New Roman', serif;
	--r-arabic: 'Readex Pro', 'Archivo', sans-serif;

	/* Spacing — base 4 */
	--r-4: 4px;    --r-8: 8px;    --r-12: 12px;  --r-16: 16px;  --r-24: 24px;
	--r-32: 32px;  --r-48: 48px;  --r-64: 64px;  --r-96: 96px;  --r-128: 128px;

	/* Grid */
	--r-gutter: 24px;
	--r-margin: 120px;
	--r-measure: 68ch;

	/* Motion — one curve across the whole system */
	--r-ease: cubic-bezier(0.16, 1, 0.3, 1);
	--r-dur-pill: 160ms;
	--r-dur-rise: 420ms;
	--r-dur-aperture: 620ms;
	--r-dur-rule: 640ms;
	--r-dur-weave: 900ms;

	/* Geometry — the logo's rule: square, 45° chamfer, or full round. Nothing between. */
	--r-chamfer: 12px;
}


/* 01 · FOUNDATION ========================================================== */

html,
body,
body.material,
body.ascend,
#ajax-content-wrap,
#page-header-wrap,
.container-wrap,
.main-content,
#boxed,
.wpb_row,
.vc_row,
.full-width-content,
.nectar-slider-wrap {
	background-color: var(--r-paper) !important;
}

body,
body.material,
body #ajax-content-wrap {
	font-family: var(--r-sans) !important;
	font-size: 16px !important;
	line-height: 26px !important;
	font-weight: 400 !important;
	color: var(--r-graphite) !important;
	letter-spacing: 0 !important;
	-webkit-font-smoothing: antialiased !important;
	-moz-osx-font-smoothing: grayscale !important;
	text-rendering: optimizeLegibility !important;
}

/* Elevation: none. Hairlines instead of shadows. */
body *,
body *::before,
body *::after {
	box-shadow: none !important;
	text-shadow: none !important;
}

/* There is no soft corner radius anywhere in this system. */
body *,
body *::before,
body *::after {
	border-radius: 0 !important;
}

/* Selection */
::selection      { background: var(--r-ultramarine-mist) !important; color: var(--r-ink) !important; }
::-moz-selection { background: var(--r-ultramarine-mist) !important; color: var(--r-ink) !important; }

/* Focus — ultramarine, always visible, never removed */
body a:focus-visible,
body button:focus-visible,
body input:focus-visible,
body textarea:focus-visible,
body select:focus-visible,
body [tabindex]:focus-visible {
	outline: 2px solid var(--r-ultramarine) !important;
	outline-offset: 2px !important;
	background-color: var(--r-ultramarine-mist) !important;
}

/* Container width and margins */
body .container,
body .container-wrap .container,
body .row .col.section-title,
body .nectar-global-section .container {
	max-width: 1440px !important;
	padding-left: var(--r-margin) !important;
	padding-right: var(--r-margin) !important;
}


/* 02 · TYPOGRAPHY ========================================================== */

/* Tracking goes negative above 28px and positive below 14px. Never both in one block. */

body h1, body h2, body h3, body h4, body h5, body h6,
body .nectar-fancy-title h1,
body .row .col h1, body .row .col h2, body .row .col h3,
body .wpb_wrapper h1, body .wpb_wrapper h2, body .wpb_wrapper h3,
body #header-outer .row .col.span_3 #logo,
body .page-header-title {
	font-family: var(--r-sans) !important;
	color: var(--r-ink) !important;
	text-transform: none !important;
	margin-top: 0 !important;
}

/* Display */
body .r-display,
body .nectar-fancy-title.display h1 {
	font-family: var(--r-sans) !important;
	font-weight: 500 !important;
	font-size: 88px !important;
	line-height: 88px !important;
	letter-spacing: -0.03em !important;
	color: var(--r-ink) !important;
}

/* H1 */
body h1,
body .page-header-title,
body .nectar-fancy-title h1 {
	font-weight: 400 !important;
	font-size: 56px !important;
	line-height: 59px !important;
	letter-spacing: -0.025em !important;
	margin-bottom: var(--r-32) !important;
}

/* H2 */
body h2,
body .wpb_wrapper h2 {
	font-weight: 400 !important;
	font-size: 40px !important;
	line-height: 44px !important;
	letter-spacing: -0.02em !important;
	margin-bottom: var(--r-24) !important;
}

/* H3 */
body h3,
body .wpb_wrapper h3 {
	font-weight: 400 !important;
	font-size: 28px !important;
	line-height: 34px !important;
	letter-spacing: -0.015em !important;
	margin-bottom: var(--r-16) !important;
}

/* H4 — interface heading */
body h4,
body .wpb_wrapper h4 {
	font-weight: 500 !important;
	font-size: 19px !important;
	line-height: 26px !important;
	letter-spacing: -0.01em !important;
	margin-bottom: var(--r-12) !important;
}

/* H5 / H6 fall back to the label treatment */
body h5, body h6 {
	font-family: var(--r-sans) !important;
	font-weight: 500 !important;
	font-size: 11px !important;
	line-height: 16px !important;
	letter-spacing: 0.20em !important;
	text-transform: uppercase !important;
	color: var(--r-slate) !important;
	margin-bottom: var(--r-12) !important;
}

/* Body */
body p,
body li,
body td,
body .wpb_text_column p,
body .wpb_wrapper p {
	font-family: var(--r-sans) !important;
	font-weight: 400 !important;
	font-size: 16px !important;
	line-height: 26px !important;
	color: var(--r-graphite) !important;
	letter-spacing: 0 !important;
}

body p { margin-bottom: var(--r-16) !important; }

/* Prose measure never exceeds 68 characters. */
body .r-prose,
body .wpb_text_column.r-prose p {
	max-width: var(--r-measure) !important;
}

/* Small */
body .r-small,
body small,
body figcaption,
body .wp-caption-text {
	font-family: var(--r-sans) !important;
	font-weight: 400 !important;
	font-size: 14px !important;
	line-height: 21px !important;
	letter-spacing: 0.01em !important;
	color: var(--r-slate) !important;
}

/* Label */
body .r-label {
	display: block !important;
	font-family: var(--r-sans) !important;
	font-weight: 500 !important;
	font-size: 11px !important;
	line-height: 16px !important;
	letter-spacing: 0.20em !important;
	text-transform: uppercase !important;
	color: var(--r-slate) !important;
}

/* Micro — licence lines, legal */
body .r-micro {
	font-family: var(--r-sans) !important;
	font-weight: 600 !important;
	font-size: 10px !important;
	line-height: 15px !important;
	letter-spacing: 0.20em !important;
	text-transform: uppercase !important;
	color: var(--r-ash) !important;
}

/* Numerals — section numbers, metrics */
body .r-numeral {
	font-family: var(--r-sans) !important;
	font-weight: 400 !important;
	font-variant-numeric: tabular-nums !important;
	letter-spacing: 0 !important;
	color: var(--r-ultramarine) !important;
}

/* Wordmark */
body .r-wordmark,
body #header-outer #logo.r-wordmark {
	font-family: var(--r-sans) !important;
	font-weight: 500 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.30em !important;
	color: var(--r-ink) !important;
}

/* Arabic — optically matched to Archivo, never scaled to match */
body .r-ar,
body [lang="ar"],
body :lang(ar) {
	font-family: var(--r-arabic) !important;
	font-weight: 300 !important;
	direction: rtl !important;
	letter-spacing: 0 !important;
}

/* Strong / em */
body strong, body b { font-weight: 500 !important; color: var(--r-ink) !important; }
body em, body i     { font-style: italic !important; }


/* 03 · LINKS =============================================================== */

body a,
body .wpb_wrapper a,
body p a {
	color: var(--r-ultramarine) !important;
	text-decoration: none !important;
	text-underline-offset: 0.22em !important;
	text-decoration-thickness: 1px !important;
	transition: color var(--r-dur-pill) ease-out !important;
}

body p a,
body li a,
body .r-prose a {
	text-decoration: underline !important;
	text-decoration-color: var(--r-hairline) !important;
}

body a:hover,
body p a:hover {
	color: var(--r-ultramarine-deep) !important;
	text-decoration-color: var(--r-ultramarine-deep) !important;
}

/* Arrow link */
body .r-link-arrow {
	display: inline-flex !important;
	align-items: center !important;
	gap: var(--r-8) !important;
	color: var(--r-ink) !important;
	text-decoration: none !important;
	font-weight: 500 !important;
}
body .r-link-arrow::after {
	content: '→' !important;
	transition: transform var(--r-dur-pill) ease-out !important;
}
body .r-link-arrow:hover::after { transform: translateX(4px) !important; }


/* 04 · BUTTONS ============================================================= */
/* The primary button carries one 12px chamfer at the top right — the only
   place the logo's cut appears in the interface. Hit area never below 44px. */

body .nectar-button,
body a.nectar-button,
body input[type="submit"],
body button[type="submit"],
body .wpcf7-submit,
body .r-btn {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-height: 44px !important;
	padding: var(--r-12) var(--r-24) !important;
	font-family: var(--r-sans) !important;
	font-weight: 500 !important;
	font-size: 15px !important;
	line-height: 20px !important;
	letter-spacing: 0.01em !important;
	text-transform: none !important;
	border: 1px solid var(--r-ink) !important;
	background: var(--r-ink) !important;
	color: var(--r-paper) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	text-shadow: none !important;
	transition: background var(--r-dur-pill) ease-out,
	            border-color var(--r-dur-pill) ease-out,
	            color var(--r-dur-pill) ease-out !important;
	-webkit-clip-path: polygon(0 0, calc(100% - var(--r-chamfer)) 0, 100% var(--r-chamfer), 100% 100%, 0 100%) !important;
	        clip-path: polygon(0 0, calc(100% - var(--r-chamfer)) 0, 100% var(--r-chamfer), 100% 100%, 0 100%) !important;
}

body .nectar-button:hover,
body a.nectar-button:hover,
body input[type="submit"]:hover,
body button[type="submit"]:hover,
body .wpcf7-submit:hover,
body .r-btn:hover {
	background: var(--r-ultramarine) !important;
	border-color: var(--r-ultramarine) !important;
	color: var(--r-paper) !important;
}

body .nectar-button:active,
body .r-btn:active {
	background: var(--r-ultramarine-deep) !important;
	border-color: var(--r-ultramarine-deep) !important;
}

/* Secondary — square, no chamfer */
body .nectar-button.regular-tilt,
body .nectar-button.see-through,
body .r-btn--secondary {
	background: transparent !important;
	border: 1px solid var(--r-hairline) !important;
	color: var(--r-ink) !important;
	-webkit-clip-path: none !important;
	        clip-path: none !important;
}
body .nectar-button.see-through:hover,
body .r-btn--secondary:hover {
	background: transparent !important;
	border-color: var(--r-ink) !important;
	color: var(--r-ink) !important;
}

/* Disabled */
body .r-btn:disabled,
body .r-btn[aria-disabled="true"],
body input[type="submit"]:disabled,
body button:disabled {
	background: transparent !important;
	border-color: var(--r-hairline) !important;
	color: var(--r-ash) !important;
	cursor: not-allowed !important;
	-webkit-clip-path: none !important;
	        clip-path: none !important;
}


/* 05 · PILLS =============================================================== */
/* Pills are the only fully round form in the system. They carry taxonomy —
   capability, sector, status — never actions. */

body .r-pill {
	display: inline-flex !important;
	align-items: center !important;
	gap: var(--r-8) !important;
	padding: 6px var(--r-16) !important;
	border: 1px solid var(--r-hairline) !important;
	border-radius: 999px !important;
	background: var(--r-paper) !important;
	font-family: var(--r-sans) !important;
	font-weight: 500 !important;
	font-size: 11px !important;
	line-height: 16px !important;
	letter-spacing: 0.20em !important;
	text-transform: uppercase !important;
	color: var(--r-slate) !important;
	transition: border-color var(--r-dur-pill) ease-out,
	            background var(--r-dur-pill) ease-out,
	            color var(--r-dur-pill) ease-out !important;
}

body .r-pill:hover,
body .r-pill--active {
	border-color: var(--r-ink) !important;
	color: var(--r-ink) !important;
}

body .r-pill--accent {
	border-color: var(--r-ultramarine) !important;
	background: var(--r-ultramarine-mist) !important;
	color: var(--r-ultramarine) !important;
}

body .r-pill--inactive {
	border-color: var(--r-hairline) !important;
	color: var(--r-ash) !important;
}


/* 06 · CARDS =============================================================== */
/* Hairlines, never shadows. Square, never rounded. */

body .r-card,
body .nectar-fancy-box,
body .wpb_column.r-card {
	background: var(--r-paper) !important;
	border: 1px solid var(--r-hairline) !important;
	border-radius: 0 !important;
	padding: var(--r-32) !important;
	box-shadow: none !important;
	transition: border-color var(--r-dur-pill) ease-out !important;
}

body .r-card:hover { border-color: var(--r-ink) !important; }

body .r-card__num {
	font-family: var(--r-sans) !important;
	font-size: 11px !important;
	letter-spacing: 0.20em !important;
	color: var(--r-ultramarine) !important;
	font-variant-numeric: tabular-nums !important;
	display: block !important;
	margin-bottom: var(--r-24) !important;
}

/* Recessed panel — Mist. Never a card fill. */
body .r-panel {
	background: var(--r-mist) !important;
	border: 0 !important;
	padding: var(--r-48) !important;
}


/* 07 · RULES, LABELS, PHILOSOPHY =========================================== */

body hr,
body .r-rule,
body .divider-small-border,
body .nectar-divider {
	height: 1px !important;
	border: 0 !important;
	background: var(--r-hairline) !important;
	margin: var(--r-64) 0 !important;
	transform-origin: left center !important;
}

/* Philosophy — Newsreader Light, no quotation marks, no attribution.
   One thought per view. Maximum fourteen words to a line. */
body .r-philosophy {
	font-family: var(--r-serif) !important;
	font-weight: 300 !important;
	font-size: 48px !important;
	line-height: 1.18 !important;
	letter-spacing: -0.01em !important;
	color: var(--r-ink) !important;
	max-width: 20ch !important;
	quotes: none !important;
}
body .r-philosophy::before,
body .r-philosophy::after { content: none !important; }

/* Prose set in the thinking face */
body .r-prose--serif,
body .r-prose--serif p {
	font-family: var(--r-serif) !important;
	font-weight: 300 !important;
	font-size: 19px !important;
	line-height: 30px !important;
	color: var(--r-graphite) !important;
	max-width: var(--r-measure) !important;
}

/* Section rhythm uses 96 and above. */
body .r-section {
	padding-top: var(--r-128) !important;
	padding-bottom: var(--r-128) !important;
}
body .r-section--tight {
	padding-top: var(--r-96) !important;
	padding-bottom: var(--r-96) !important;
}

/* Blockquote inherits the thinking face */
body blockquote {
	font-family: var(--r-serif) !important;
	font-weight: 300 !important;
	font-size: 24px !important;
	line-height: 34px !important;
	color: var(--r-ink) !important;
	border: 0 !important;
	border-left: 1px solid var(--r-ultramarine) !important;
	padding: 0 0 0 var(--r-24) !important;
	margin: var(--r-48) 0 !important;
	background: transparent !important;
}


/* 08 · FORMS =============================================================== */
/* Inputs have one line, at the bottom. No boxes, no fills, no placeholders
   that repeat the label. */

body input[type="text"],
body input[type="email"],
body input[type="tel"],
body input[type="url"],
body input[type="search"],
body input[type="password"],
body input[type="number"],
body textarea,
body select,
body .wpcf7 input,
body .wpcf7 textarea {
	font-family: var(--r-sans) !important;
	font-size: 16px !important;
	line-height: 26px !important;
	color: var(--r-ink) !important;
	background: transparent !important;
	border: 0 !important;
	border-bottom: 1px solid var(--r-hairline) !important;
	border-radius: 0 !important;
	padding: var(--r-12) 0 !important;
	box-shadow: none !important;
	transition: border-color var(--r-dur-pill) ease-out !important;
	-webkit-appearance: none !important;
	        appearance: none !important;
}

body input:focus,
body textarea:focus,
body select:focus {
	border-bottom-color: var(--r-ultramarine) !important;
	background: transparent !important;
	outline: none !important;
}

body ::-webkit-input-placeholder { color: var(--r-ash) !important; }
body ::placeholder               { color: var(--r-ash) !important; opacity: 1 !important; }

body label,
body .wpcf7 label {
	font-family: var(--r-sans) !important;
	font-weight: 500 !important;
	font-size: 11px !important;
	letter-spacing: 0.20em !important;
	text-transform: uppercase !important;
	color: var(--r-slate) !important;
	display: block !important;
	margin-bottom: var(--r-4) !important;
}


/* 09 · HEADER AND NAVIGATION =============================================== */

body #header-outer,
body #header-outer.transparent,
body #header-outer .container,
body #header-secondary-outer,
body #header-outer[data-transparent-header="true"] {
	background-color: var(--r-paper) !important;
	border-bottom: 1px solid var(--r-hairline) !important;
	box-shadow: none !important;
}

body #header-outer #logo,
body #header-outer #logo img { max-height: 32px !important; }

body #header-outer nav > ul > li > a,
body #top nav > ul > li > a,
body #header-outer .sf-menu li a {
	font-family: var(--r-sans) !important;
	font-weight: 400 !important;
	font-size: 14px !important;
	line-height: 21px !important;
	letter-spacing: 0.01em !important;
	text-transform: none !important;
	color: var(--r-slate) !important;
	transition: color var(--r-dur-pill) ease-out !important;
}

body #header-outer nav > ul > li > a:hover,
body #top nav > ul > li.current-menu-item > a,
body #top nav > ul > li > a:hover {
	color: var(--r-ink) !important;
}

/* Salient's animated underline → hairline in ink */
body #header-outer .sf-menu li .sf-sub-indicator,
body #top nav .sf-menu li ul { border-radius: 0 !important; }

body #top nav > ul > li > a::after,
body #header-outer nav .sf-menu > li > a::after {
	background-color: var(--r-ink) !important;
	height: 1px !important;
}

/* Dropdowns */
body #top nav ul#top-menu li ul,
body #header-outer .sub-menu {
	background-color: var(--r-paper) !important;
	border: 1px solid var(--r-hairline) !important;
	box-shadow: none !important;
}

/* Mobile menu */
body #slide-out-widget-area,
body #slide-out-widget-area.fullscreen,
body .slide-out-widget-area-toggle {
	background-color: var(--r-paper) !important;
}
body #slide-out-widget-area a,
body #mobile-menu a { color: var(--r-ink) !important; font-family: var(--r-sans) !important; }


/* 10 · FOOTER ============================================================== */

body #footer-outer,
body #footer-widgets,
body #footer-outer #copyright {
	background-color: var(--r-paper) !important;
	border-top: 1px solid var(--r-hairline) !important;
	color: var(--r-slate) !important;
}

body #footer-outer #copyright { border-top: 1px solid var(--r-hairline) !important; }

body #footer-outer p,
body #footer-outer li,
body #footer-outer #copyright p {
	font-family: var(--r-sans) !important;
	font-size: 14px !important;
	line-height: 21px !important;
	color: var(--r-slate) !important;
}

body #footer-outer h4,
body #footer-widgets .widget h4 {
	font-family: var(--r-sans) !important;
	font-weight: 500 !important;
	font-size: 11px !important;
	letter-spacing: 0.20em !important;
	text-transform: uppercase !important;
	color: var(--r-slate) !important;
}

body #footer-outer a { color: var(--r-slate) !important; }
body #footer-outer a:hover { color: var(--r-ink) !important; }

/* The licence line never leaves the document. */
body .r-licence {
	font-family: var(--r-sans) !important;
	font-weight: 600 !important;
	font-size: 10px !important;
	letter-spacing: 0.20em !important;
	text-transform: uppercase !important;
	color: var(--r-ash) !important;
}


/* 11 · ICONS AND IMAGES ==================================================== */
/* 24px box · 1.5 stroke · butt caps · mitre joins */

body .r-icon,
body .r-icon svg {
	width: 24px !important;
	height: 24px !important;
	fill: none !important;
	stroke: currentColor !important;
	stroke-width: 1.5 !important;
	stroke-linecap: butt !important;
	stroke-linejoin: miter !important;
	color: var(--r-ink) !important;
}
body .r-icon--secondary { color: var(--r-slate) !important; }
body .r-icon--accent    { color: var(--r-ultramarine) !important; }

/* Screens shown flat and at true proportion, never in a tilted device. */
body img,
body .wpb_single_image img,
body .nectar-image-wrap img {
	border-radius: 0 !important;
	box-shadow: none !important;
	transform: none !important;
	max-width: 100% !important;
	height: auto !important;
}

/* Forbidden: gradients and glows of any kind. */
body .r-section,
body .wpb_row,
body .vc_row,
body .row-bg,
body .nectar-shape-divider-wrap {
	background-image: none !important;
	filter: none !important;
}


/* 12 · BADGES ============================================================== */
/* A single row, in the footer or the credentials block. Never in the hero,
   never beside the mark. */

body .r-badges {
	display: flex !important;
	align-items: center !important;
	flex-wrap: wrap !important;
	gap: var(--r-48) !important;
	padding: var(--r-32) 0 !important;
	border-top: 1px solid var(--r-hairline) !important;
}

body .r-badges img {
	height: 28px !important;
	width: auto !important;
	opacity: 0.7 !important;
	filter: none !important;
	transition: opacity var(--r-dur-pill) ease-out !important;
}
body .r-badges a:hover img { opacity: 1 !important; }


/* 13 · ANIMATION =========================================================== */
/* Five names, one easing. Nothing loops, nothing bounces, nothing parallaxes. */

@keyframes r-aperture {
	from { opacity: 0; transform: scale(0.94); }
	to   { opacity: 1; transform: scale(1); }
}

body .r-aperture {
	opacity: 0 !important;
}
body .r-aperture.is-in {
	animation: r-aperture var(--r-dur-aperture) var(--r-ease) forwards !important;
}

body .r-rise {
	opacity: 0 !important;
	transform: translateY(16px) !important;
	transition: opacity var(--r-dur-rise) var(--r-ease),
	            transform var(--r-dur-rise) var(--r-ease) !important;
}
body .r-rise.is-in {
	opacity: 1 !important;
	transform: translateY(0) !important;
}

/* 60ms stagger */
body .r-rise:nth-child(1) { transition-delay: 0ms !important; }
body .r-rise:nth-child(2) { transition-delay: 60ms !important; }
body .r-rise:nth-child(3) { transition-delay: 120ms !important; }
body .r-rise:nth-child(4) { transition-delay: 180ms !important; }
body .r-rise:nth-child(5) { transition-delay: 240ms !important; }
body .r-rise:nth-child(6) { transition-delay: 300ms !important; }

body .r-rule {
	transform: scaleX(0) !important;
	transition: transform var(--r-dur-rule) var(--r-ease) !important;
}
body .r-rule.is-in { transform: scaleX(1) !important; }

/* weave — preloader and title slides only. Never on a repeat visit. */
@keyframes r-weave {
	from { stroke-dashoffset: 640; }
	to   { stroke-dashoffset: 0; }
}
body .r-weave path,
body .r-weave line,
body .r-weave circle {
	stroke-dasharray: 640 !important;
	animation: r-weave var(--r-dur-weave) var(--r-ease) forwards !important;
}

/* Salient's own animation library is suppressed — one easing across the system */
body .wpb_animate_when_almost_visible,
body [data-animation],
body .nectar-waypoint-el {
	animation-timing-function: var(--r-ease) !important;
	transition-timing-function: var(--r-ease) !important;
}


/* 14 · REDUCED MOTION ====================================================== */
/* Every named animation collapses to a 120ms opacity fade. Nothing is removed
   from the page — only its movement. */

@media (prefers-reduced-motion: reduce) {

	body *,
	body *::before,
	body *::after {
		animation-duration: 120ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 120ms !important;
		transition-property: opacity !important;
		scroll-behavior: auto !important;
	}

	body .r-rise,
	body .r-aperture,
	body .r-rule {
		transform: none !important;
		animation: none !important;
	}
	body .r-rise.is-in,
	body .r-aperture.is-in,
	body .r-rule.is-in {
		opacity: 1 !important;
		transform: none !important;
	}
	body .r-weave path,
	body .r-weave line,
	body .r-weave circle {
		stroke-dasharray: none !important;
		animation: none !important;
	}
}


/* 15 · RESPONSIVE ========================================================== */

@media (max-width: 1200px) {
	:root { --r-margin: 64px; }
	body .r-display        { font-size: 64px !important; line-height: 64px !important; }
	body h1                { font-size: 44px !important; line-height: 48px !important; }
	body h2                { font-size: 32px !important; line-height: 38px !important; }
	body .r-philosophy     { font-size: 38px !important; }
}

@media (max-width: 999px) {
	:root { --r-margin: 32px; --r-gutter: 16px; }
	body .r-section        { padding-top: var(--r-96) !important; padding-bottom: var(--r-96) !important; }
	body .r-display        { font-size: 48px !important; line-height: 50px !important; }
	body h1                { font-size: 36px !important; line-height: 40px !important; }
	body h2                { font-size: 28px !important; line-height: 34px !important; }
	body h3                { font-size: 22px !important; line-height: 28px !important; }
	body .r-philosophy     { font-size: 30px !important; max-width: 24ch !important; }
	body .r-card           { padding: var(--r-24) !important; }
	body .r-badges         { gap: var(--r-24) !important; }
}

@media (max-width: 690px) {
	:root { --r-margin: 20px; }
	body .r-display        { font-size: 38px !important; line-height: 40px !important; }
	body h1                { font-size: 30px !important; line-height: 34px !important; }
	body h2                { font-size: 24px !important; line-height: 30px !important; }
	body .r-philosophy     { font-size: 24px !important; line-height: 1.3 !important; }
	body .r-panel          { padding: var(--r-24) !important; }
}

/* No horizontal page scroll at any width. */
html, body { overflow-x: hidden !important; max-width: 100% !important; }


/* 16 · SALIENT SUPPRESSION ================================================= */
/* Theme furniture that does not belong to this system. */

body .nectar-shape-divider-wrap,
body .row-bg-overlay,
body .nectar-parallax-scene,
body #page-header-bg .overlay,
body .nectar-video-wrap,
body .page-header-bg-image-wrap::after,
body .nectar-button i[class*="icon-"] {
	display: none !important;
}

body .row-bg.using-image,
body .page-header-bg-image {
	filter: grayscale(0) !important;
	opacity: 1 !important;
}

/* No tilt, no perspective, no parallax */
body .nectar-parallax-scene,
body [data-parallax],
body .nectar-3d-transform,
body .img-with-aniamtion,
body .hover-tilt {
	transform: none !important;
	perspective: none !important;
}

/* Salient gradient buttons and boxes */
body .nectar-button[data-color-override],
body .nectar-gradient-button,
body .nectar-button.has-gradient {
	background-image: none !important;
	background: var(--r-ink) !important;
	color: var(--r-paper) !important;
}

/* Salient's rounded/extra-rounded button options */
body .nectar-button.rounded,
body .nectar-button.extra-rounded,
body .nectar-button.jumbo {
	border-radius: 0 !important;
}

/* Ensure the accent stays ultramarine wherever Salient injects its own */
body .nectar-progress-bar span,
body .nectar-fancy-ul .icon-default-style,
body .toggle.open > .toggle-title a,
body .tabbed > ul li a.active-tab {
	background-color: var(--r-ultramarine) !important;
	border-color: var(--r-ultramarine) !important;
	color: var(--r-paper) !important;
}
