/**
 * Base styles shared between all pages
 *
 * @copyright   2026, ON1
 */

:root {
	/* Pure black & white */
	--black: #000;
	--white: #fff;

	/* Backgrounds */
	--bg-50: #eef1f5;
	--bg-100: #d3dae3;
	--bg-200: #a7b3c4;
	--bg-300: #7a8ba6;
	--bg-400: #506b8a;
	--bg-500: #345373;
	--bg-600: #1f3e5c;
	--bg-700: #122c47;
	--bg-800: #0a1c31;
	--bg-850: #071525;
	--bg-900: #040f1d;

	/* Text */
	--text-50: #f7f7f8;
	--text-100: #eaeaec;
	--text-200: #d4d4d8;
	--text-300: #bdbdc1;
	--text-400: #9c9ca2;
	--text-500: #7c7c82;
	--text-600: #5e5e64;
	--text-700: #444448;
	--text-800: #2b2b2e;
	--text-900: #161618;

	/* Blue (default: #0a7efa) */
	--blue-50: #f0f7ff;
	--blue-100: #d6e7ff;
	--blue-200: #adceff;
	--blue-300: #75afff;
	--blue-400: #3d91fc;
	--blue-500: #0a7efa;
	--blue-600: #0866d1;
	--blue-700: #074fa8;
	--blue-800: #053a80;
	--blue-900: #07295a;

	/* Green (default: #21ce6e) */
	--green-50: #ecfdf3;
	--green-100: #d1fadf;
	--green-200: #a3f3c0;
	--green-300: #6de89c;
	--green-400: #3ed982;
	--green-500: #21ce6e;
	--green-600: #1aa85a;
	--green-700: #148347;
	--green-800: #0f6235;
	--green-900: #0a4525;

	/* Orange (default: #fe842a) */
	--orange-50: #fff4eb;
	--orange-100: #ffe3ca;
	--orange-200: #ffc491;
	--orange-300: #ffa45c;
	--orange-400: #fe9240;
	--orange-500: #fe842a;
	--orange-600: #d46a1c;
	--orange-700: #a85214;
	--orange-800: #7d3c0e;
	--orange-900: #552809;

	/* Red (default: #ff3d57) */
	--red-50: #fff0f2;
	--red-100: #ffd6dd;
	--red-200: #ffadb9;
	--red-300: #ff7d8f;
	--red-400: #ff5972;
	--red-500: #ff3d57;
	--red-600: #d62a43;
	--red-700: #ab1d32;
	--red-800: #801524;
	--red-900: #570d18;

	/* Purple (default: #914fff) */
	--purple-50: #f5efff;
	--purple-100: #e6d6ff;
	--purple-200: #ccadff;
	--purple-300: #b083ff;
	--purple-400: #9d66ff;
	--purple-500: #914fff;
	--purple-600: #7639d6;
	--purple-700: #5b29a8;
	--purple-800: #421d7d;
	--purple-900: #2c1354;

	/* Pink (default: #ee19a9) */
	--pink-50: #fdeaf6;
	--pink-100: #fbcce9;
	--pink-200: #f79fd4;
	--pink-300: #f368bd;
	--pink-400: #f042b5;
	--pink-500: #ee19a9;
	--pink-600: #c4138b;
	--pink-700: #990d6c;
	--pink-800: #71094f;
	--pink-900: #4b0635;

	/* Gold (default: #fab73b) */
	--gold-50: #fff8e6;
	--gold-100: #ffecbf;
	--gold-200: #fcdb87;
	--gold-300: #fbca56;
	--gold-400: #fac045;
	--gold-500: #fab73b;
	--gold-600: #d4962a;
	--gold-700: #a8731f;
	--gold-800: #7d5416;
	--gold-900: #54380e;

	/* Slate (default: #607796) */
	--slate-50: #f1f4f8;
	--slate-100: #dde3eb;
	--slate-200: #b9c4d3;
	--slate-300: #93a3b8;
	--slate-400: #7689a4;
	--slate-500: #607796;
	--slate-600: #4d6079;
	--slate-700: #3b495c;
	--slate-800: #2b3543;
	--slate-900: #1b222b;

	/* Settings: Surfaces */
	--bg: var(--bg-900);
	--box-bg: var(--bg-800);
	--border: var(--bg-500);
	--border-subtle: var(--bg-700);

	/* Settings: Text */
	--text: var(--text-100);
	--text-muted: var(--text-300);
	--text-subtle: var(--text-500);
	--link: var(--blue-200);
	--link-inverse: var(--white);
	--link-alt: var(--blue-500);

	/* Settings: Colors */
	--blue: var(--blue-500);
	--green: var(--green-500);
	--orange: var(--orange-500);
	--red: var(--red-500);
	--purple: var(--purple-500);
	--pink: var(--pink-500);
	--gold: var(--gold-500);
	--slate: var(--slate-500);

	/* Settings: Status */
	--success: var(--green-500);
	--warning: var(--gold-500);
	--danger: var(--red-500);
	--info: var(--blue-500);

	/* Font families */
	--sans-serif: system-ui, -apple-system, sans-serif;
	--serif: ui-serif, "New York", Georgia, serif;
	--monospace: ui-monospace, SFMono-Regular, "Cascadia Code", Monaco, "Andale Mono", "Ubuntu Mono", monospace;

	/* Font sizes */
	--text-micro: 0.625rem;
	--text-mini: 0.6875rem;
	--text-xs: 0.75rem;
	--text-sm: 0.875rem;
	--text-base: 1rem;
	--text-lg: 1.125rem;
	--text-xl: 1.25rem;
	--text-2xl: 1.5rem;
	--text-3xl: 1.875rem;
	--text-4xl: 2.25rem;
	--text-5xl: 2.5rem;
	--text-6xl: 3rem;

	/* Bootstrap overrides */
	/*
	--bs-body-bg: var(--bg);
	--bs-body-color: var(--text);
	--bs-body-font-family: var(--sans-serif);
	--bs-body-font-size: var(--text-base);
	--bs-body-font-weight: 400;
	--bs-body-line-height: 1.5;
	--bs-link-color: var(--link);
	--bs-link-hover-color: var(--blue-100);
	--bs-border-color: var(--border);
	--bs-success: var(--green-500);
	--bs-danger: var(--red-500);
	--bs-warning: var(--gold-500);
	--bs-info: var(--blue-500);
	--bs-primary: var(--blue-500);
	*/
}

/* !- Background color utilities */
.bg-black {
	background-color: var(--black);
}

.bg-white {
	background-color: var(--white);
}

.bg-blue-50 {
	background-color: var(--blue-50);
}

.bg-blue-100 {
	background-color: var(--blue-100);
}

.bg-blue-200 {
	background-color: var(--blue-200);
}

.bg-blue-300 {
	background-color: var(--blue-300);
}

.bg-blue-400 {
	background-color: var(--blue-400);
}

.bg-blue,
.bg-blue-500 {
	--bs-btn-bg: var(--blue-500);
	--bs-btn-border-color: var(--blue-500);
	--bs-btn-hover-bg: var(--blue-500);
	--bs-btn-hover-border-color: var(--blue-500);
	--bs-btn-active-bg: var(--blue-500);
	--bs-btn-active-border-color: var(--blue-500);

	background-color: var(--blue-500);
}

.bg-blue-600 {
	background-color: var(--blue-600);
}

.bg-blue-700 {
	background-color: var(--blue-700);
}

.bg-blue-800 {
	background-color: var(--blue-800);
}

.bg-blue-900 {
	background-color: var(--blue-900);
}

.bg-green-50 {
	background-color: var(--green-50);
}

.bg-green-100 {
	background-color: var(--green-100);
}

.bg-green-200 {
	background-color: var(--green-200);
}

.bg-green-300 {
	background-color: var(--green-300);
}

.bg-green-400 {
	background-color: var(--green-400);
}

.bg-green,
.bg-green-500 {
	--bs-btn-bg: var(--green-500);
	--bs-btn-border-color: var(--green-500);
	--bs-btn-hover-bg: var(--green-500);
	--bs-btn-hover-border-color: var(--green-500);
	--bs-btn-active-bg: var(--green-500);
	--bs-btn-active-border-color: var(--green-500);

	background-color: var(--green-500);
}

.bg-green-600 {
	background-color: var(--green-600);
}

.bg-green-700 {
	background-color: var(--green-700);
}

.bg-green-800 {
	background-color: var(--green-800);
}

.bg-green-900 {
	background-color: var(--green-900);
}

.bg-orange-50 {
	background-color: var(--orange-50);
}

.bg-orange-100 {
	background-color: var(--orange-100);
}

.bg-orange-200 {
	background-color: var(--orange-200);
}

.bg-orange-300 {
	background-color: var(--orange-300);
}

.bg-orange-400 {
	background-color: var(--orange-400);
}

.bg-orange,
.bg-orange-500 {
	--bs-btn-bg: var(--orange-500);
	--bs-btn-border-color: var(--orange-500);
	--bs-btn-hover-bg: var(--orange-500);
	--bs-btn-hover-border-color: var(--orange-500);
	--bs-btn-active-bg: var(--orange-500);
	--bs-btn-active-border-color: var(--orange-500);

	background-color: var(--orange-500);
}

.bg-orange-600 {
	background-color: var(--orange-600);
}

.bg-orange-700 {
	background-color: var(--orange-700);
}

.bg-orange-800 {
	background-color: var(--orange-800);
}

.bg-orange-900 {
	background-color: var(--orange-900);
}

.bg-red-50 {
	background-color: var(--red-50);
}

.bg-red-100 {
	background-color: var(--red-100);
}

.bg-red-200 {
	background-color: var(--red-200);
}

.bg-red-300 {
	background-color: var(--red-300);
}

.bg-red-400 {
	background-color: var(--red-400);
}

.bg-red,
.bg-red-500 {
	--bs-btn-bg: var(--red-500);
	--bs-btn-border-color: var(--red-500);
	--bs-btn-hover-bg: var(--red-500);
	--bs-btn-hover-border-color: var(--red-500);
	--bs-btn-active-bg: var(--red-500);
	--bs-btn-active-border-color: var(--red-500);

	background-color: var(--red-500);
}

.bg-red-600 {
	background-color: var(--red-600);
}

.bg-red-700 {
	background-color: var(--red-700);
}

.bg-red-800 {
	background-color: var(--red-800);
}

.bg-red-900 {
	background-color: var(--red-900);
}

.bg-purple-50 {
	background-color: var(--purple-50);
}

.bg-purple-100 {
	background-color: var(--purple-100);
}

.bg-purple-200 {
	background-color: var(--purple-200);
}

.bg-purple-300 {
	background-color: var(--purple-300);
}

.bg-purple-400 {
	background-color: var(--purple-400);
}

.bg-purple,
.bg-purple-500 {
	--bs-btn-bg: var(--purple-500);
	--bs-btn-border-color: var(--purple-500);
	--bs-btn-hover-bg: var(--purple-500);
	--bs-btn-hover-border-color: var(--purple-500);
	--bs-btn-active-bg: var(--purple-500);
	--bs-btn-active-border-color: var(--purple-500);

	background-color: var(--purple-500);
}

.bg-purple-600 {
	background-color: var(--purple-600);
}

.bg-purple-700 {
	background-color: var(--purple-700);
}

.bg-purple-800 {
	background-color: var(--purple-800);
}

.bg-purple-900 {
	background-color: var(--purple-900);
}

.bg-pink-50 {
	background-color: var(--pink-50);
}

.bg-pink-100 {
	background-color: var(--pink-100);
}

.bg-pink-200 {
	background-color: var(--pink-200);
}

.bg-pink-300 {
	background-color: var(--pink-300);
}

.bg-pink-400 {
	background-color: var(--pink-400);
}

.bg-pink,
.bg-pink-500 {
	--bs-btn-bg: var(--pink-500);
	--bs-btn-border-color: var(--pink-500);
	--bs-btn-hover-bg: var(--pink-500);
	--bs-btn-hover-border-color: var(--pink-500);
	--bs-btn-active-bg: var(--pink-500);
	--bs-btn-active-border-color: var(--pink-500);

	background-color: var(--pink-500);
}

.bg-pink-600 {
	background-color: var(--pink-600);
}

.bg-pink-700 {
	background-color: var(--pink-700);
}

.bg-pink-800 {
	background-color: var(--pink-800);
}

.bg-pink-900 {
	background-color: var(--pink-900);
}

.bg-gold-50 {
	background-color: var(--gold-50);
}

.bg-gold-100 {
	background-color: var(--gold-100);
}

.bg-gold-200 {
	background-color: var(--gold-200);
}

.bg-gold-300 {
	background-color: var(--gold-300);
}

.bg-gold-400 {
	background-color: var(--gold-400);
}

.bg-gold,
.bg-gold-500 {
	--bs-btn-bg: var(--gold-500);
	--bs-btn-border-color: var(--gold-500);
	--bs-btn-hover-bg: var(--gold-500);
	--bs-btn-hover-border-color: var(--gold-500);
	--bs-btn-active-bg: var(--gold-500);
	--bs-btn-active-border-color: var(--gold-500);

	background-color: var(--gold-500);
}

.bg-gold-600 {
	background-color: var(--gold-600);
}

.bg-gold-700 {
	background-color: var(--gold-700);
}

.bg-gold-800 {
	background-color: var(--gold-800);
}

.bg-gold-900 {
	background-color: var(--gold-900);
}

.bg-slate-50 {
	background-color: var(--slate-50);
}

.bg-slate-100 {
	background-color: var(--slate-100);
}

.bg-slate-200 {
	background-color: var(--slate-200);
}

.bg-slate-300 {
	background-color: var(--slate-300);
}

.bg-slate-400 {
	background-color: var(--slate-400);
}

.bg-slate,
.bg-slate-500 {
	--bs-btn-bg: var(--slate-500);
	--bs-btn-border-color: var(--slate-500);
	--bs-btn-hover-bg: var(--slate-500);
	--bs-btn-hover-border-color: var(--slate-500);
	--bs-btn-active-bg: var(--slate-500);
	--bs-btn-active-border-color: var(--slate-500);

	background-color: var(--slate-500);
}

.bg-slate-600 {
	background-color: var(--slate-600);
}

.bg-slate-700 {
	background-color: var(--slate-700);
}

.bg-slate-800 {
	background-color: var(--slate-800);
}

.bg-slate-900 {
	background-color: var(--slate-900);
}

.bg-hollow,
.bg-hollow:hover {
	background-color: transparent;
	border: 1px solid var(--text);
}

/* !- Text color utilities */
.text-blue-50 {
	color: var(--blue-50);
}

.text-blue-100 {
	color: var(--blue-100);
}

.text-blue-200 {
	color: var(--blue-200);
}

.text-blue-300 {
	color: var(--blue-300);
}

.text-blue-400 {
	color: var(--blue-400);
}

.text-blue,
.text-blue-500 {
	color: var(--blue-500);
}

.text-blue-600 {
	color: var(--blue-600);
}

.text-blue-700 {
	color: var(--blue-700);
}

.text-blue-800 {
	color: var(--blue-800);
}

.text-blue-900 {
	color: var(--blue-900);
}

.text-green-50 {
	color: var(--green-50);
}

.text-green-100 {
	color: var(--green-100);
}

.text-green-200 {
	color: var(--green-200);
}

.text-green-300 {
	color: var(--green-300);
}

.text-green-400 {
	color: var(--green-400);
}

.text-green,
.text-green-500 {
	color: var(--green-500);
}

.text-green-600 {
	color: var(--green-600);
}

.text-green-700 {
	color: var(--green-700);
}

.text-green-800 {
	color: var(--green-800);
}

.text-green-900 {
	color: var(--green-900);
}

.text-orange-50 {
	color: var(--orange-50);
}

.text-orange-100 {
	color: var(--orange-100);
}

.text-orange-200 {
	color: var(--orange-200);
}

.text-orange-300 {
	color: var(--orange-300);
}

.text-orange-400 {
	color: var(--orange-400);
}

.text-orange,
.text-orange-500 {
	color: var(--orange-500);
}

.text-orange-600 {
	color: var(--orange-600);
}

.text-orange-700 {
	color: var(--orange-700);
}

.text-orange-800 {
	color: var(--orange-800);
}

.text-orange-900 {
	color: var(--orange-900);
}

.text-red-50 {
	color: var(--red-50);
}

.text-red-100 {
	color: var(--red-100);
}

.text-red-200 {
	color: var(--red-200);
}

.text-red-300 {
	color: var(--red-300);
}

.text-red-400 {
	color: var(--red-400);
}

.text-red,
.text-red-500 {
	color: var(--red-500);
}

.text-red-600 {
	color: var(--red-600);
}

.text-red-700 {
	color: var(--red-700);
}

.text-red-800 {
	color: var(--red-800);
}

.text-red-900 {
	color: var(--red-900);
}

.text-purple-50 {
	color: var(--purple-50);
}

.text-purple-100 {
	color: var(--purple-100);
}

.text-purple-200 {
	color: var(--purple-200);
}

.text-purple-300 {
	color: var(--purple-300);
}

.text-purple-400 {
	color: var(--purple-400);
}

.text-purple,
.text-purple-500 {
	color: var(--purple-500);
}

.text-purple-600 {
	color: var(--purple-600);
}

.text-purple-700 {
	color: var(--purple-700);
}

.text-purple-800 {
	color: var(--purple-800);
}

.text-purple-900 {
	color: var(--purple-900);
}

.text-pink-50 {
	color: var(--pink-50);
}

.text-pink-100 {
	color: var(--pink-100);
}

.text-pink-200 {
	color: var(--pink-200);
}

.text-pink-300 {
	color: var(--pink-300);
}

.text-pink-400 {
	color: var(--pink-400);
}

.text-pink,
.text-pink-500 {
	color: var(--pink-500);
}

.text-pink-600 {
	color: var(--pink-600);
}

.text-pink-700 {
	color: var(--pink-700);
}

.text-pink-800 {
	color: var(--pink-800);
}

.text-pink-900 {
	color: var(--pink-900);
}

.text-gold-50 {
	color: var(--gold-50);
}

.text-gold-100 {
	color: var(--gold-100);
}

.text-gold-200 {
	color: var(--gold-200);
}

.text-gold-300 {
	color: var(--gold-300);
}

.text-gold-400 {
	color: var(--gold-400);
}

.text-gold,
.text-gold-500 {
	color: var(--gold-500);
}

.text-gold-600 {
	color: var(--gold-600);
}

.text-gold-700 {
	color: var(--gold-700);
}

.text-gold-800 {
	color: var(--gold-800);
}

.text-gold-900 {
	color: var(--gold-900);
}

.text-slate-50 {
	color: var(--slate-50);
}

.text-slate-100 {
	color: var(--slate-100);
}

.text-slate-200 {
	color: var(--slate-200);
}

.text-slate-300 {
	color: var(--slate-300);
}

.text-slate-400 {
	color: var(--slate-400);
}

.text-slate,
.text-slate-500 {
	color: var(--slate-500);
}

.text-slate-600 {
	color: var(--slate-600);
}

.text-slate-700 {
	color: var(--slate-700);
}

.text-slate-800 {
	color: var(--slate-800);
}

.text-slate-900 {
	color: var(--slate-900);
}

.text-subtle {
	color: var(--text-subtle);
}

.text-muted {
	color: var(--text-muted);
}

/* !- Body */
body {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	background: var(--bg);
	color: var(--text);
	font-family: var(--sans-serif);
	font-size: var(--text-base);
	font-weight: 400;
	line-height: 1.6;
}

/* !- Headings */
h1,
h2,
h3,
h4,
h5,
h6 {
	color: var(--text);
	font-weight: 600;
	line-height: 1.2;
	margin: 0 0 0.5em;
}

h1 {
	font-size: var(--text-5xl);
}

h2 {
	font-size: var(--text-4xl);
}

h3 {
	font-size: var(--text-3xl);
}

h4 {
	font-size: var(--text-2xl);
}

h5 {
	font-size: var(--text-xl);
}

h6 {
	font-size: var(--text-lg);
}

/* !- Paragraphs */
p {
	margin: 0 0 1.5rem;
}

p:last-child {
	margin-bottom: 0;
}

/* !- Inline text */
em,
i {
	font-style: italic;
}

strong,
b {
	font-weight: 600;
}

small {
	font-size: var(--text-sm);
}

mark {
	background: var(--gold-200);
	border-radius: 0.2em;
	color: var(--text-900);
	padding: 0.1em 0.25em;
}

/* !- Links */
a {
	color: var(--link);
	font-weight: 500;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.2em;
	transition: color 0.15s ease;
}

a:hover {
	color: var(--blue-100);
}

a:focus-visible {
	border-radius: 2px;
	outline: 2px solid var(--link);
	outline-offset: 2px;
}

/* !- Lists */
ul,
ol {
	margin: 0 0 1rem;
	padding-left: 1.5rem;
}

li {
	margin-bottom: 0.25rem;
}

li:last-child {
	margin-bottom: 0;
}

/* !- Nested lists */
ul ul,
ul ol,
ol ul,
ol ol {
	margin-bottom: 0;
	margin-top: 0.25rem;
}

/* !- Definition lists */
dl {
	margin: 0 0 1rem;
}

dt {
	font-weight: 600;
	margin-top: 0.5rem;
}

dd {
	color: var(--text-muted);
	margin: 0 0 0.5rem;
}

/* !- Blockquotes */
blockquote {
	border-left: 3px solid var(--border);
	color: var(--text-muted);
	font-style: italic;
	margin: 0 0 1rem;
	padding: 0.5rem 0 0.5rem 1rem;
}

blockquote p:last-child {
	margin-bottom: 0;
}

blockquote cite {
	color: var(--text-subtle);
	display: block;
	font-size: var(--text-sm);
	font-style: normal;
	margin-top: 0.5rem;
}

/* !- Code */
code,
kbd,
samp {
	font-family: var(--monospace);
	font-size: 0.9em;
}

code {
	background: var(--box-bg);
	border-radius: 0.25em;
	color: var(--text);
	padding: 0.1em 0.3em;
}

pre {
	background: var(--box-bg);
	border-radius: 0.5rem;
	font-size: var(--text-sm);
	line-height: 1.5;
	margin: 0 0 1rem;
	overflow-x: auto;
	padding: 1rem;
}

pre code {
	background: transparent;
	border-radius: 0;
	font-size: inherit;
	padding: 0;
}

kbd {
	background: var(--bg-700);
	border: 1px solid var(--border);
	border-radius: 0.25em;
	font-size: 0.85em;
	padding: 0.1em 0.4em;
}

/* !- Horizontal rule */
hr {
	border: 0;
	border-top: 1px solid var(--border);
	margin: 2rem 0;
}

/* !- Tables */
table {
	border-collapse: collapse;
	margin: 0 0 1rem;
	width: 100%;
}

th,
td {
	border-bottom: 1px solid var(--border);
	padding: 0.5rem 0.75rem;
	text-align: left;
}

th {
	color: var(--text);
	font-weight: 600;
}

td {
	color: var(--text-muted);
}

/* !- Figures */
figure {
	margin: 0 0 1rem;
}

figcaption {
	color: var(--text-subtle);
	font-size: var(--text-sm);
	margin-top: 0.5rem;
	text-align: center;
}

/* !- Images */
img {
	height: auto;
	max-width: 100%;
}

/* !- Containers */
.container,
.container-fluid,
.container-xxl,
.container-xl,
.container-lg,
.container-md,
.container-sm {
	margin-left: auto;
	margin-right: auto;
	padding-left: 1.5rem;
	padding-right: 1.5rem;
	width: 100%;
}

@media (max-width: 575.98px) {
	.container,
	.container-fluid,
	.container-xxl,
	.container-xl,
	.container-lg,
	.container-md,
	.container-sm {
		padding-left: 1rem;
		padding-right: 1rem;
	}
}

/* !- Header */
#site-header {
	background: var(--bg);
	border-bottom: 2px solid transparent;
	border-image: linear-gradient(to right, var(--bg), var(--blue-400), var(--bg));
	border-image-slice: 1;
	font-size: var(--text-sm);
	width: 100%;
}

#site-header .nav-item {
	margin-bottom: 0;
}

#site-header .badge.logged-in-user {
	font-size: var(--text-sm);
}

/* !- Navigation */
#site-navigation .nav-link {
	color: var(--text);
	font-weight: 500;
	padding-left: 1.25rem;
	padding-right: 1.25rem;
}

@media (max-width: 575.98px) {
	#site-navigation .nav-link {
		padding-left: 0;
		padding-right: 0;
	}
}

#site-navigation .nav-link:hover,
#site-navigation .dropdown-toggle.show {
	color: var(--link);
}

#site-navigation .dropdown-toggle::after {
	border: none;
	content: '\f107';
	font-family: 'Font Awesome 6 Pro';
	font-size: var(--text-xs);
	margin-left: 0.25rem;
	margin-top: -0.125rem;
	vertical-align: middle;
}

#site-navigation .dropdown:hover .dropdown-menu-end,
#site-navigation .dropdown-menu-end[data-bs-popper] {
	right: 0;
	left: auto;
}

#site-navigation .dropdown-menu {
	background: var(--slate-900);
	color: var(--text);
}

#site-navigation .dropdown-menu li {
	margin-bottom: 0;
}

#site-navigation .dropdown-menu .dropdown-header {
	color: var(--slate-500);
	font-size: var(--text-xs);
	font-weight: 900;
	letter-spacing: 0.1em;
	margin-bottom: 0.5rem;
	padding-bottom: 0;
	padding-left: 1.5rem;
	text-transform: uppercase;
}

@media (max-width: 575.98px) {
	#site-navigation .dropdown-menu .dropdown-header {
		padding-left: 0.75rem;
	}
}

#site-navigation .dropdown-menu .dropdown-divider {
	border-top: 1px solid var(--slate-800);
}

#site-navigation .dropdown-menu .dropdown-item {
	color: var(--text);
	padding: 0.375rem 1.5rem;
}

@media (max-width: 575.98px) {
	#site-navigation .dropdown-menu .dropdown-item {
		padding: 0.375rem 0.75rem;
		white-space: normal;
	}
}

#site-navigation .dropdown-menu .dropdown-item .product-tagline {
	color: var(--slate-300);
	font-size: var(--text-xs);
	margin-top: 0.25rem;
}

#site-navigation .dropdown-menu .dropdown-item .product-tagline small {
	font-size: var(--text-xs);
}

#site-navigation .dropdown-menu .dropdown-item:focus,
#site-navigation .dropdown-menu .dropdown-item:hover {
	background: color-mix(in srgb, var(--purple) 25%, transparent);
}

#site-navigation .dropdown-menu#products-dropdown .col:first-child {
	max-width: 25rem;
}

#site-navigation .dropdown-menu#products-dropdown .col:nth-child(2) {
	border-left: 2px solid var(--slate-800);
	border-right: 2px solid var(--slate-800);
	max-width: 20rem;
}

#site-navigation .dropdown-menu#products-dropdown .col:last-child {
	width: 18.75rem;
}

@media (max-width: 575.98px) {
	#site-navigation .dropdown-menu#products-dropdown .col:first-child {
		max-width: 100%;
	}

	#site-navigation .dropdown-menu#products-dropdown .col:nth-child(2) {
		border-left: none;
		border-right: none;
		max-width: 100%;
	}

	#site-navigation .dropdown-menu#products-dropdown .col:last-child {
		width: 100%;
	}
}

#site-navigation .dropdown-menu#products-dropdown .core-editing-software .dropdown-item {
	padding-bottom: 0.75rem;
	padding-top: 0.75rem;
}

#site-navigation .dropdown-menu#products-dropdown .core-editing-software .compare-link {
	padding: 0 0 0.5rem 1.5rem;
}

@media (max-width: 575.98px) {
	#site-navigation .dropdown-menu#products-dropdown .core-editing-software .compare-link {
		padding: 0 0 0.5rem 0.75rem;
	}
}

#site-navigation .dropdown-menu#products-dropdown .core-editing-software .compare-link a {
	text-decoration: none;
}

#site-navigation .dropdown-menu#products-dropdown .ai-creative-tools .dropdown-divider {
	margin: 0.75rem 0;
}

#site-navigation .dropdown-menu#products-dropdown .ai-creative-tools .included-note {
	font-size: var(--text-sm);
	line-height: 1.4;
	padding: 0 1.5rem;
}

@media (max-width: 575.98px) {
	#site-navigation .dropdown-menu#products-dropdown .ai-creative-tools .included-note {
		padding: 0 0.75rem;
	}
}

#site-navigation .dropdown-menu#learn-dropdown .col:first-child {
	border-right: 2px solid var(--slate-800);
}

#site-navigation #nav-cart .nav-link {
	top: 0.125rem;
}

#site-navigation #nav-cart .fa-shopping-cart {
	font-size: var(--text-base);
}

#site-navigation #nav-cart .badge {
	font-size: var(--text-micro);
	position: absolute;
	right: 0.375rem;
	top: 0;
}

@media (max-width: 575.98px) {
	#site-navigation #nav-cart .badge {
		display: none;
	}
}

#site-navigation #nav-sign-in #signin-dropdown-toggle {
	padding-right: 0;
}

#site-navigation .dropdown-menu#user-dropdown-menu {
	min-width: max-content;
	padding: 1rem 1.25rem;
	white-space: nowrap;
}

#site-navigation .dropdown-menu#user-dropdown-menu p {
	margin-bottom: 1rem;
}

#site-navigation .dropdown-menu#user-dropdown-menu .logged-in-as {
	color: var(--slate-500);
	font-size: var(--text-xs);
	font-weight: 900;
	letter-spacing: 0.1em;
	margin-bottom: 0.5rem;
	text-transform: uppercase;
}

#site-navigation .dropdown-menu#user-dropdown-menu ul {
	margin-bottom: 1.25rem;
}

#site-navigation .dropdown-menu#user-dropdown-menu li {
	font-size: var(--text-sm);
	margin-bottom: 0.375rem;
}

#site-navigation .dropdown-menu#user-dropdown-menu .badge {
	font-size: var(--text-micro);
}

#site-navigation .dropdown-menu#user-dropdown-menu .sign-out-link {
	margin: 0;
	text-align: right;
}

#site-navigation .dropdown-menu#user-dropdown-menu .manage-acct-link {
	background: var(--slate-800);
	color: var(--text);
	font-size: var(--text-xs);
	font-weight: 500;
	text-decoration: none;
}

#site-navigation .avatar {
	border-radius: 50rem;
	height: 1.875rem;
	margin-top: 1px;
	width: 1.875rem;
}

#site-navigation .avatar-48 {
	height: 3rem;
	width: 3rem;
}

#site-navigation #admin-link .nav-link {
	padding-left: 0.5rem;
}

#site-navigation #admin-link .fa-lock-keyhole {
	font-size: var(--text-base);
	position: relative;
	top: 0.125rem;
}

@media (max-width: 575.98px) {
	#site-navigation #admin-link .nav-link {
		padding-left: 0;
	}

	#site-navigation #admin-link .fa-lock-keyhole {
		top: 0;
	}
}

#site-navigation .offcanvas {
	background: var(--bg);
	width: 100%;
}

#site-navigation .offcanvas-header {
	padding-bottom: 1.5rem;
	padding-top: 1.5rem;
}


#site-navigation .offcanvas-header img {
	border: none;
	box-shadow: none;
}

#site-navigation .offcanvas-header .btn-close {
	--bs-btn-close-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414'/%3e%3c/svg%3e");
	--bs-btn-close-color: var(--white);
	--bs-btn-close-hover-opacity: 1;
	--bs-btn-close-opacity: 1;
	color: var(--white);
}

/* !- Buttons */
#site-main .btn {
	padding: 0.9375rem 1.875rem;
}

/* !- Eyebrow */
.eyebrow {
	font-size: var(--text-xs);
	font-weight: 600;
	letter-spacing: 0.16em;
	line-height: 1.5;
	margin-bottom: 1rem;
	text-transform: uppercase;
}

/* Image compare grabber */
image-compare {
	--thumb-size: clamp(3em, 10vmin, 4em);
}

/* !- Footer */
#site-footer {
	background-color: var(--slate-900);
}

#site-footer .footer-top {
	padding: 4rem 0 3rem 0;
}

#site-footer .footer-top h3 {
	font-weight: 900;
}

#site-footer .footer-top .footer-list-title,
#site-footer .footer-top .choose-language-title {
	color: var(--slate-500);
	font-size: var(--text-xs);
	font-weight: 900;
	margin-bottom: 0.5rem;
	text-transform: uppercase;
}

#site-footer .footer-top li {
	margin-bottom: 0.125rem;
}

#site-footer .footer-top a {
	border-bottom: none;
	color: var(--slate-100);
	font-size: var(--text-sm);
	text-decoration: none;
}

#site-footer .footer-top a:hover {
	text-decoration: underline;
}

#site-footer .footer-top .gt_selector.form-select {
	--bs-form-select-bg-img: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%234d6079' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
	background-color: var(--slate-800);
	border: 1px solid var(--slate-600);
	box-shadow: none;
	color: var(--text-300);
	font-size: var(--text-sm);
	width: auto;
}

#site-footer .footer-bottom {
	border-top: 2px solid var(--slate-800);
	color: var(--slate-300);
	font-size: var(--text-xs);
	padding: 1rem 0;
}

/* !- Utilities */
.btn {
	font-weight: 600;
}

.video-player {
	box-shadow: none;
	outline: none;
}

.fw-bolder {
	font-weight: 900 !important;
}

.video-player {
	box-shadow: none;
	outline: none;
}

.no-disp-field {
	display: none !important;
}

/* !- Modals */
.modal-open,
.fsb-modalOpen {
	overflow: auto !important;
	padding-right: 0 !important;
}

.modal .close,
.modal .btn-close {
	background: none;
	border-radius: 0;
	box-sizing: initial;
	color: var(--white);
	font-size: 2rem;
	font-weight: 400;
	height: auto;
	opacity: 1;
	outline: none;
	padding: 0;
	position: absolute;
	right: 0;
	text-shadow: none;
	top: -3rem;
	width: auto;
}

.modal .modal-fullscreen .btn-close {
	background: none;
	border-radius: 0;
	box-sizing: initial;
	color: var(--white);
	font-size: 2rem;
	font-weight: 400;
	height: auto;
	opacity: 1;
	outline: none;
	padding: 0;
	position: absolute;
	right: 2rem;
	text-shadow: none;
	top: 0;
	width: auto;
}

.modal-content {
	background: var(--box-bg);
}

.modal-backdrop.show {
	opacity: 0.85;
}

#image-modal .modal-content,
#video-modal .modal-content {
	border-radius: 0;
}

#image-modal .modal-body,
#video-modal .modal-body {
	padding: 0.3125rem;
}

#fsb-modal.fsb-MOD .fsb-modal-content {
	color: var(--bg);
}

/* !- Carousel */
.carousel-control-next,
.carousel-control-prev {
	opacity: 1 !important;
	width: 5%;
}

.carousel-indicators [data-bs-target] {
	background-color: transparent;
	border: 2px solid var(--text-300);
	border-radius: 100%;
	height: 8px;
	margin-left: 5px;
	margin-right: 5px;
	width: 8px;
}

.carousel-indicators .active {
	background-color: var(--white);
	border: 2px solid var(--white);
	opacity: 1;
}

/* !- TwentyTwenty before/after slider */
.twentytwenty-handle {
	border: none !important;
	border-radius: 0 !important;
	bottom: 1.5rem !important;
	height: auto !important;
	margin-left: 0 !important;
	margin-top: 0 !important;
	top: initial !important;
	width: 3px !important;
}

.twentytwenty-horizontal .twentytwenty-handle::before {
	margin-bottom: 0 !important;
}

.twentytwenty-horizontal .twentytwenty-handle::after {
	margin-top: 0 !important;
}

.twentytwenty-left-arrow,
.twentytwenty-right-arrow {
	background: rgba(0, 0, 0, 0.5) !important;
	border: 0 !important;
	height: auto !important;
	line-height: 1 !important;
	margin-top: 0 !important;
	padding: 0 !important;
	text-align: center !important;
	width: 64px !important;
}

.twentytwenty-left-arrow {
	margin-left: -64px !important;
}

.twentytwenty-right-arrow {
	margin-right: -64px !important;
}

.twentytwenty-left-arrow::before,
.twentytwenty-right-arrow::before {
	color: var(--white) !important;
	display: inline-block !important;
	font-size: var(--text-micro) !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	padding: 0.3125rem 0 !important;
	text-align: center !important;
	text-transform: uppercase !important;
	vertical-align: middle !important;
}

.twentytwenty-left-arrow::before {
	content: 'Before' !important;
}

.twentytwenty-right-arrow::before {
	content: 'After' !important;
}

/* !- Plus quick access menu */
#plus-quick-access-menu {
	bottom: 0;
	margin: 0 !important;
	opacity: 0;
	padding: 0.5rem 0 !important;
	position: fixed;
	transform: translateY(100%);
	transition: all 200ms ease-out;
	visibility: hidden;
	width: 100%;
	z-index: 999;
}

#plus-quick-access-menu.show {
	opacity: 1;
	transform: translateY(0%);
	transition-delay: 200ms;
	visibility: visible;
}

#plus-quick-access-menu.hide-me {
	display: none;
}

#plus-quick-access-menu .nav-item .nav-link {
	align-items: center;
	color: var(--white);
	display: inline-flex;
	font-size: var(--text-base);
	font-weight: 500;
	justify-content: space-between;
	padding: 0.3125rem 1rem;
}

#plus-quick-access-menu .nav-item .nav-link span {
	border-bottom: 1px solid transparent;
}

#plus-quick-access-menu .nav-item .nav-link.active,
#plus-quick-access-menu .nav-item .nav-link:hover span {
	border-bottom: 1px solid var(--white);
}

/* !- Countdown */
.countdown .row-cols-4 {
	display: grid;
	grid-auto-columns: minmax(0, 1fr);
	grid-auto-flow: column;
}

/* !- Visibility utilities (Foundation-style breakpoints) */
@media screen and (max-width: 39.9375em) {
	.hide-for-small-only {
		display: none !important;
	}
}

@media screen and (max-width: 0em),
screen and (min-width: 40em) {
	.show-for-small-only {
		display: none !important;
	}
}

@media screen and (min-width: 40em) {
	.hide-for-medium {
		display: none !important;
	}
}

@media screen and (max-width: 39.9375em) {
	.show-for-medium {
		display: none !important;
	}
}

@media screen and (min-width: 40em) and (max-width: 63.9375em) {
	.hide-for-medium-only {
		display: none !important;
	}
}

@media screen and (max-width: 39.9375em),
screen and (min-width: 64em) {
	.show-for-medium-only {
		display: none !important;
	}
}

@media screen and (min-width: 64em) {
	.hide-for-large {
		display: none !important;
	}
}

@media screen and (max-width: 63.9375em) {
	.show-for-large {
		display: none !important;
	}
}

@media screen and (min-width: 64em) and (max-width: 74.9375em) {
	.hide-for-large-only {
		display: none !important;
	}
}

@media screen and (max-width: 63.9375em),
screen and (min-width: 75em) {
	.show-for-large-only {
		display: none !important;
	}
}

@media screen and (max-width: 75em) {
	.show-for-xl {
		display: none !important;
	}
}

/* !- Cookie notice */
#on1-cookie-notice {
	float: left;
	margin-bottom: 0.75rem;
	margin-left: 0.75rem;
	margin-right: 0.75rem;
	max-width: 400px;
	visibility: hidden;
}

#on1-cookie-notice .box-bg {
	background: var(--bg-800);
	border: 1px solid var(--border-subtle);
}

#on1-cookie-notice.show {
	visibility: visible;
}

#on1-cookie-notice .decline {
	color: var(--slate-400);
}

#on1-cookie-notice .btn-close {
	--bs-btn-close-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414'/%3e%3c/svg%3e");
	--bs-btn-close-color: var(--white);
	--bs-btn-close-hover-opacity: 1;
	--bs-btn-close-opacity: 1;
	color: var(--white);
	font-size: var(--text-xs);
	position: absolute;
	right: 0.5rem;
	top: 0.5rem;
}

/* !- Responsive text-nowrap utilities */
.text-xs-nowrap {
	white-space: nowrap !important;
}

@media (min-width: 576px) {
	.text-sm-nowrap {
		white-space: nowrap !important;
	}
}

@media (min-width: 768px) {
	.text-md-nowrap {
		white-space: nowrap !important;
	}
}

@media (min-width: 992px) {
	.text-lg-nowrap {
		white-space: nowrap !important;
	}
}

@media (min-width: 1200px) {
	.text-xl-nowrap {
		white-space: nowrap !important;
	}
}

@media (min-width: 1400px) {
	.text-xxl-nowrap {
		white-space: nowrap !important;
	}
}

/* !- FastSpring spinner */
#fastspring_spinner {
	background: rgba(0, 0, 0, 0.4);
	display: none;
	height: 100%;
	left: 0;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 99999998;
}

#fastspring_spinner img {
	animation-delay: 0.4s;
	animation-duration: 0.4s;
	animation-name: fsb-fadeIn;
	left: 50%;
	margin-left: -50px;
	margin-top: -50px;
	position: fixed;
	top: 50%;
	z-index: 99999999;
}

/* !- Scroll to top */
.scroll-top {
	border: none;
	bottom: 2.5rem;
	color: var(--text-subtle);
	display: none;
	font-size: 2.25rem;
	font-weight: 300;
	position: fixed;
	right: 1.25rem;
	text-decoration: none;
	z-index: 3;
}

.scroll-top:hover {
	color: var(--blue);
}

/* !- Gtranslate */
div.skiptranslate,
#google_translate_element2,
#goog-gt-tt,
.VIpgJd-ZVi9od-aZ2wEe-wOHMyf {
	display: none !important;
}

.goog-te-menu-value:hover {
	text-decoration: none !important;
}

.goog-text-highlight {
	background-color: transparent !important;
	box-shadow: none !important;
}

/* !- Discount drawers */
#photo-raw-drawer .drawer {
	background: url(https://ononesoft.cachefly.net/images/drawers/20260608-21yrs-bg.jpg) center center no-repeat;
	background-size: cover;
	width: 700px;
}

#photo-raw-drawer.plus-holiday-drawer .drawer {
	background: url(https://ononesoft.cachefly.net/images/drawers/20251215-plus-holiday-drawer-bg@2x.jpg) center bottom no-repeat;
	background-size: cover;
	width: 600px;
}

#owners-drawer .drawer {
	background: url(https://ononesoft.cachefly.net/images/drawers/20260213-presidents-day-drawer-bg@2x.jpg) center center no-repeat;
	background-size: cover;
	width: 600px;
}

#cyberweek-drawer .drawer {
	background: #11024d url(https://ononesoft.cachefly.net/images/landing/2024/cyberweek/hero-cyber-week-bg.jpg) center center no-repeat;
	background-size: cover;
}

#effects-drawer .drawer,
#effects-free-drawer .drawer {
	background: #11024d url(https://ononesoft.cachefly.net/images/drawers/20260105-FX-2025fr-bg@2x.jpg) center center no-repeat;
	background-size: cover;
	width: 600px;
}

.discount-drawer {
	bottom: 0.625rem;
	margin: 0 0 0 0.75rem;
	opacity: 0;
	position: fixed;
	right: 0.75rem;
	transform: translateY(100%);
	transition: all 500ms ease-out;
	visibility: hidden;
	max-width: 700px;
	z-index: 10;
}

@media (max-width: 575.98px) {
	.discount-drawer {
		display: none;
	}
}

.discount-drawer.show {
	opacity: 1;
	transform: translateY(0%);
	transition-delay: 500ms;
	visibility: visible;
}

.discount-drawer.hide-me {
	display: none;
}

.discount-drawer .popup-header {
	margin-left: 0;
	margin-right: 0;
}

.discount-drawer .popup-content {
	margin-left: 0;
	margin-right: 0;
	padding: 1rem 1rem 0 0;
}

.discount-drawer .popup-close {
	--bs-btn-close-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414'/%3e%3c/svg%3e");
	--bs-btn-close-color: #fff;
	--bs-btn-close-opacity: 1;
	--bs-btn-close-hover-opacity: 1;
	/* background: transparent var(--bs-btn-close-bg) center/1rem auto no-repeat; */
	background: transparent var(--bs-btn-close-bg) center/0.9375rem auto no-repeat;
	border: 0;
	border-radius: 0.375rem;
	box-sizing: content-box;
	color: var(--bs-btn-close-color);
	height: 1rem;
	opacity: var(--bs-btn-close-opacity);
	padding: 0.25rem;
	position: absolute;
	right: 0.5rem;
	top: 0.375rem;
	width: 1rem;
	z-index: 999;
}

.discount-drawer .popup-header h2,
.discount-drawer .popup-content h2 {
	font-size: 1.75rem;
	font-weight: 900;
	margin-bottom: 1rem;
}

.discount-drawer .form-control {
	background: var(--white) !important;
	color: var(--dark);
	height: auto;
	padding: 0.75rem;
}

.discount-drawer .form-group {
	margin-bottom: 1rem;
}

.discount-drawer .form-check {
	margin-bottom: 0;
}

.discount-drawer .form-check-input {
	margin-top: 1px;
}

.discount-drawer input[type="submit"] {
	margin-bottom: 1rem;
}

.discount-drawer .user-terms label {
	font-size: 0.8125rem;
	font-weight: 400;
	line-height: 1.5;
}

.discount-drawer .drawer {
	float: right;
	width: auto;
}

/* !- Discount modals */
@media (max-width: 1199.98px) {
	.modal-xl {
		max-width: 96% !important;
	}
}

.discount-modal .popup-close {
	background: none;
	border: none;
	border-radius: 0;
	box-sizing: initial;
	color: #fff;
	font-size: 1.5rem;
	height: auto;
	margin: 0;
	opacity: 1;
	outline: none;
	padding: 0;
	position: absolute;
	right: 0;
	text-shadow: none;
	top: -2.25rem;
	width: auto;
}

.discount-modal .modal-content .has-background {
	background: #000 url(https://ononesoft.cachefly.net/images/popups/20250602-anniversary-popup-bg_2x.jpg) center top no-repeat;
	background-size: cover;
	border: 1px solid #8fe9cf;
	border-radius: 1rem;
	padding: 2rem;
}

#resize-modal.discount-modal .modal-content .has-background {
	background: #000 url(https://ononesoft.cachefly.net/images/products/2023/resize-ai/download/quick-start-course-bg@2x.jpg) top left no-repeat;
	border: 1px solid #914fff;
	padding: 2.5rem 2rem;
}

#resize-notify-modal.discount-modal .modal-content .has-background {
	background: #000 url(https://ononesoft.cachefly.net/images/popups/20250717-resize-notify-bg@2x.jpg) top left no-repeat;
	border: 1px solid #914fff;
	padding: 2.5rem 2rem;
}

.discount-modal form label {
	color: var(--text-color);
	font-size: 0.875rem;
	font-weight: 500;
	margin-bottom: 0;
	text-transform: none;
}

.discount-modal .form-field {
	background: var(--box-bg);
	border: 1px solid var(--dark);
	color: var(--text-color);
	margin-bottom: 1.5rem;
	padding-bottom: 0.5rem;
	padding-top: 0.5rem;
}

.discount-modal .form-check-input {
	font-size: 1rem;
	margin-left: -1.6rem;
}

.discount-modal .form-check-label {
	line-height: 1.5;
}

.discount-modal .invalid-feedback {
	margin-bottom: 1.5rem;
	margin-top: -1rem;
}

.discount-modal .invalid-feedback.missing-terms {
	margin-left: -1.75rem;
	margin-top: 0;
}

.fullscreen-modal .popup-close {
	background: none;
	border: none;
	border-radius: 0;
	box-sizing: initial;
	color: #fff;
	cursor: pointer;
	font-size: 1.5rem;
	height: auto;
	margin: 0;
	opacity: 1;
	outline: none;
	padding: 0;
	position: absolute;
	right: 2rem;
	text-shadow: none;
	top: 1rem;
	width: auto;
	z-index: 99;
}

.fullscreen-modal .modal-content {
	background: #000 url(https://ononesoft.cachefly.net/images/popups/20241031-fullscreen-bg@2x.jpg) center top no-repeat;
	background-size: cover;
}

/* !- ON1 Guarantee */
#on1-guarantee {
	padding: 5rem 0;
}

#on1-guarantee .guarantee-wrapper {
	background: url(https://ononesoft.cachefly.net/images/guarantee-bg@2x.jpg) center center no-repeat;
	background-size: cover;
	border: 2px solid var(--green);
	padding: 5rem 1.5rem;
	width: 100%;
}

@media (max-width: 575.98px) {
	#on1-guarantee .guarantee-wrapper {
		background: url(https://ononesoft.cachefly.net/images/guarantee-bg.jpg) center center no-repeat;
		background-size: cover;
	}
}

#on1-guarantee .box-bg {
	/*
	background: var(--slate-900);
	border: 1px solid var(--slate-800);
	*/
	background: rgba(27, 34, 43, 0.7);
	border: 1px solid var(--slate-900);
	padding: 1.5rem 1rem;
}

#on1-guarantee .guarantee-head {
	margin-bottom: 2.25rem;
}

#on1-guarantee .guarantee-head p {
	color: var(--text-muted);
	font-size: var(--text-base);
}

#on1-guarantee h2 {
	margin-bottom: 0.75rem;
}

#on1-guarantee h3 {
	align-items: center;
	color: var(--green);
	display: flex;
	font-size: var(--text-base);
	font-weight: 700;
	gap: 1rem;
	justify-content: center;
	letter-spacing: 0.05em;
	margin-bottom: 1rem;
	text-transform: uppercase;
}

#on1-guarantee h3::before,
#on1-guarantee h3::after {
	content: "";
	flex: 1;
	max-width: 80px;
	height: 2px;
	background: currentColor;
}

#on1-guarantee .guarantee-boxes i {
	color: var(--green);
	font-size: 2.25rem;
	margin-bottom: 1.25rem;
}

#on1-guarantee .guarantee-boxes h4 {
	color: var(--white);
	font-size: var(--text-xs);
}

#on1-guarantee .guarantee-boxes p {
	color: var(--text-muted);
	line-height: 1.1;
}

#on1-guarantee .guarantee-boxes small {
	font-size: var(--text-mini);
}

#on1-guarantee .stretched-link {
	text-decoration: none;
}
