/* Google Fonts loaded in each HTML via preconnect + link for performance */
:root {
--bg: #020708;
--bg-2: #0b1717;
--ink: #f6f0df;
--muted: rgba(246, 240, 223, 0.72);
--faint: rgba(246, 240, 223, 0.12);
--line: rgba(246, 240, 223, 0.18);
--yellow: #ead83d;
--orange: #ff5a3d;
--orange-2: #ff765f;
--dark-pill: #061313;
--panel: rgba(255, 255, 255, 0.045);
--panel-strong: rgba(255, 255, 255, 0.075);
--max: 1180px;
--radius: 22px;
--shadow: 0 24px 80px rgba(0, 0, 0, 0.38);
--font-display: "Anton", Impact, sans-serif;
--font-body: "Outfit", system-ui, sans-serif;
--font-accent: "Bebas Neue", Impact, sans-serif;
--space-eyebrow-heading: clamp(1.2rem, 1.8vw, 1.85rem);
--space-heading-copy: clamp(1rem, 1.45vw, 1.35rem);
--space-copy-action: clamp(1.25rem, 1.8vw, 1.75rem);
--space-action-note: clamp(2.15rem, 2.8vw, 3rem);
}
*,
*::before,
*::after {
box-sizing: border-box;
}
html {
scroll-behavior: smooth;
text-size-adjust: 100%;
}
body {
position: relative;
isolation: isolate;
margin: 0;
min-width: 320px;
min-height: 100vh;
background: var(--bg);
color: var(--ink);
font-family: var(--font-body);
font-size: 16px;
line-height: 1.55;
overflow-x: hidden;
}
body::before {
content: "";
position: fixed;
inset: 0;
z-index: 1;
pointer-events: none;
background:
radial-gradient(circle at 50% 38%, rgba(3, 18, 20, 0.08), rgba(2, 7, 8, 0.36) 54%, rgba(1, 4, 5, 0.7) 100%),
linear-gradient(180deg, rgba(1, 5, 6, 0.36), rgba(1, 5, 6, 0.22) 45%, rgba(1, 5, 6, 0.48));
}
body::after {
content: "";
position: fixed;
inset: 0;
z-index: 0;
pointer-events: none;
background: url("../assets/images/site-starfield-bg.png") center / cover no-repeat;
opacity: 0.82;
transform: translateZ(0);
}
img,
picture,
svg,
video,
canvas {
display: block;
max-width: 100%;
}
img,
video {
height: auto;
}
a {
color: inherit;
text-decoration: none;
}
p,
h1,
h2,
h3,
h4,
h5,
h6 {
overflow-wrap: break-word;
}
h1,
h2,
h3,
h4,
h5,
h6 {
text-wrap: balance;
}
p {
margin: 0;
text-wrap: pretty;
}
button,
input,
select,
textarea {
font: inherit;
}
button {
cursor: pointer;
}
[hidden] {
display: none !important;
}
input,
select,
textarea {
width: 100%;
min-width: 0;
border: 1px solid var(--line);
border-radius: 16px;
background: rgba(6, 19, 19, 0.72);
color: var(--ink);
padding: 0.9rem 1rem;
}
textarea {
resize: vertical;
}
::placeholder {
color: rgba(246, 240, 223, 0.45);
}
:focus-visible {
outline: 3px solid rgba(255, 90, 61, 0.9);
outline-offset: 4px;
}
::selection {
background: rgba(234, 216, 61, 0.28);
color: var(--ink);
}
.site-shell {
width: min(100% - 32px, var(--max));
margin-inline: auto;
}
.section {
position: relative;
z-index: 2;
padding: clamp(48px, 6vw, 96px) 0;
}
.eyebrow {
margin: 0 0 var(--space-eyebrow-heading);
font-family: var(--font-accent);
color: var(--orange-2);
font-size: clamp(1.1rem, 2vw, 2.1rem);
letter-spacing: 0.42em;
line-height: 1;
text-transform: uppercase;
}
.display {
margin: 0;
font-family: var(--font-display);
font-weight: 400;
color: var(--yellow);
font-size: clamp(3rem, 7vw, 7.4rem);
line-height: 0.88;
text-transform: uppercase;
text-wrap: balance;
}
.display-small {
font-size: clamp(2.45rem, 5.1vw, 5.4rem);
}
@media (max-width: 760px) {
.display {
font-size: clamp(2.45rem, 12vw, 4.1rem);
}
.display-small {
font-size: clamp(2.25rem, 11vw, 3.6rem);
}
}
.lede {
max-width: 720px;
color: var(--muted);
font-size: clamp(1rem, 1.4vw, 1.18rem);
}
.lede + .lede {
margin-top: var(--space-heading-copy);
}
.display + .lede,
.display-small + .lede,
.display + .audit-kicker,
.display-small + .audit-kicker {
margin-top: var(--space-heading-copy);
}
.lede + .btn,
.lede + .service-link,
.audit-kicker + .audit-form {
margin-top: var(--space-copy-action);
}
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
@media (prefers-reduced-motion: reduce) {
*,
*::before,
*::after {
scroll-behavior: auto !important;
animation-duration: 0.001ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.001ms !important;
}
}