:root {
	--surface: #0b1324;
	--surface-raised: #101c32;
	--surface-deep: #050811;
	--ink-strong: #f7fafc;
	--ink-soft: #a7b3c7;
	--line-soft: rgba(167, 179, 199, 0.18);
	--mint: #35e0bd;
	--blue: #5bd7ff;
	--coral: #ffb36b;
	--accent-lime: #d6f36a;
	--accent-coral: #ff7058;
}

body {
	background:
		radial-gradient(circle at 8% 8%, rgba(53, 224, 189, 0.08), transparent 28rem),
		var(--surface-deep);
	color: var(--ink-strong);
	overflow-x: hidden;
}

body::before {
	content: "";
	position: fixed;
	inset: 0;
	pointer-events: none;
	z-index: -1;
	opacity: .22;
	background-image: radial-gradient(rgba(255,255,255,.16) .6px, transparent .6px);
	background-size: 5px 5px;
	mask-image: linear-gradient(to bottom, black, transparent 70%);
}

#siteHeader {
	height: 72px;
	background: rgba(5, 8, 17, .52);
	border-bottom-color: rgba(255,255,255,.06);
}

#siteHeader.header-scrolled {
	background: rgba(5, 8, 17, .88);
	border-bottom-color: var(--line-soft);
	box-shadow: 0 12px 40px rgba(0,0,0,.2);
}

.panel {
	background: linear-gradient(145deg, rgba(16, 28, 50, .94), rgba(8, 16, 31, .94));
	border-color: var(--line-soft);
	box-shadow: 0 18px 50px rgba(0,0,0,.16);
	transition: transform .35s ease, border-color .35s ease, box-shadow .35s ease;
}

.panel:hover {
	transform: translateY(-5px);
	border-color: rgba(91, 215, 255, .42);
	box-shadow: 0 24px 60px rgba(0,0,0,.28), 0 0 0 1px rgba(53,224,189,.08);
}

.panel-glow { animation: none; }
.text-gradient { background-image: linear-gradient(100deg, var(--blue), var(--mint) 55%, var(--coral)); }
.bg-hero-gradient { background: linear-gradient(125deg, #081324 0%, #0b1d35 48%, #142a3b 100%); }
.bg-mesh { background-size: 52px 52px; opacity: 1; }

section > .max-w-7xl,
section > .max-w-5xl,
section > .max-w-4xl {
	position: relative;
}

[data-src-key] { transition: transform .8s cubic-bezier(.2,.8,.2,1), filter .5s ease; }
.panel:hover [data-src-key] { transform: scale(1.045); filter: saturate(1.12) contrast(1.04); }

@keyframes revealUp {
	from { opacity: 0; transform: translateY(18px); }
	to { opacity: 1; transform: translateY(0); }
}

section .relative.z-10 > *,
section .max-w-7xl > .grid > *,
section .max-w-7xl > .max-w-xl {
	animation: revealUp .8s both;
}

section .relative.z-10 > *:nth-child(2),
section .max-w-7xl > .grid > *:nth-child(2) { animation-delay: .12s; }

section .relative.z-10 > *:nth-child(3) { animation-delay: .22s; }

/* The landing hero gets a quiet, instrument-like focal point behind the copy. */
.home-hero-orbit {
	position: absolute;
	right: 8%;
	top: 50%;
	width: min(42vw, 560px);
	aspect-ratio: 1;
	transform: translateY(-50%);
	border: 1px solid rgba(91,215,255,.25);
	border-radius: 50%;
	box-shadow: 0 0 0 34px rgba(91,215,255,.025), 0 0 0 70px rgba(53,224,189,.018), inset 0 0 80px rgba(53,224,189,.08);
	animation: orbitBreath 8s ease-in-out infinite;
}

.home-hero-orbit::before,
.home-hero-orbit::after {
	content: "";
	position: absolute;
	inset: 13%;
	border: 1px dashed rgba(53,224,189,.25);
	border-radius: 50%;
	animation: spinOrbit 22s linear infinite;
}

.home-hero-orbit::after {
	inset: 29%;
	border-style: solid;
	border-color: rgba(255,179,107,.38) transparent rgba(255,179,107,.1);
	animation-direction: reverse;
	animation-duration: 13s;
}

.hero-signal {
	position: absolute;
	left: 14%;
	top: 25%;
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: var(--coral);
	box-shadow: 0 0 0 8px rgba(255,179,107,.1), 0 0 24px var(--coral);
	animation: signalPulse 2.7s ease-in-out infinite;
}

.hero-command-panel {
	position: relative;
	width: min(38vw, 430px);
	padding: 1rem;
	border: 1px solid rgba(91,215,255,.3);
	border-radius: 16px;
	background: linear-gradient(145deg, rgba(12, 29, 47, .94), rgba(5, 13, 27, .92));
	box-shadow: 0 28px 70px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.07);
	backdrop-filter: blur(18px);
	animation: panelFloat 7s ease-in-out infinite;
}

@media (min-width: 500px) {
	.hero-content-shell {
		display: grid;
		grid-template-areas: "copy panel" "stats panel";
		grid-template-columns: minmax(0, 1fr) minmax(245px, .78fr);
		grid-template-rows: auto auto;
		align-content: center;
		align-items: center;
		column-gap: clamp(1.5rem, 5vw, 5rem);
		box-sizing: border-box;
	}
	.hero-content-shell > .max-w-2xl { grid-area: copy; position: relative; z-index: 2; }
	.hero-content-shell > .hero-command-panel {
		grid-area: panel;
		width: 100%;
		max-height: min(68vh, 430px);
		justify-self: end;
		align-self: center;
		overflow: auto;
		z-index: 2;
	}
	.hero-content-shell > .mt-14 { grid-area: stats; margin-top: 3.5rem; }
}

.hero-content-shell > * { animation: none !important; }

.hero-panel-topline,
.hero-panel-footer {
	display: flex;
	align-items: center;
	gap: .5rem;
	font-family: 'IBM Plex Mono', monospace;
	font-size: 9px;
	letter-spacing: .1em;
	color: var(--blue);
}

.hero-panel-time { margin-left: auto; color: var(--ink-soft); letter-spacing: .04em; }
.hero-live-dot { width: 6px; height: 6px; border-radius: 999px; background: var(--mint); box-shadow: 0 0 0 5px rgba(53,224,189,.1), 0 0 14px var(--mint); animation: signalPulse 2s ease-in-out infinite; }
.hero-panel-heading { display: flex; align-items: end; justify-content: space-between; margin-top: 1rem; }
.hero-panel-heading strong { display: block; margin-top: .22rem; font-family: 'Space Grotesk', sans-serif; font-size: 1.45rem; letter-spacing: -.03em; }
.hero-score { color: var(--mint); font: 600 2.25rem/1 'Space Grotesk', sans-serif; }
.hero-score span { color: var(--ink-soft); font: 500 .8rem 'IBM Plex Mono', monospace; }
.hero-signal-chart { display: flex; align-items: end; gap: 5px; height: 62px; margin: .9rem 0 .8rem; padding: 0 .15rem .45rem; border-bottom: 1px solid rgba(167,179,199,.15); }
.hero-signal-chart i { flex: 1; height: var(--bar); min-height: 10px; border-radius: 3px 3px 0 0; background: linear-gradient(to top, rgba(53,224,189,.28), var(--blue)); transform-origin: bottom; animation: barBreathe 3.8s ease-in-out infinite; }
.hero-signal-chart i:nth-child(2n) { animation-delay: -.8s; opacity: .72; }
.hero-signal-chart i:nth-child(3n) { animation-delay: -1.7s; }
.hero-panel-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .65rem; }
.hero-panel-grid div { padding: .65rem .7rem; border: 1px solid rgba(167,179,199,.12); border-radius: 8px; background: rgba(255,255,255,.025); }
.hero-panel-grid span { display: block; color: var(--ink-soft); font: 9px 'IBM Plex Mono', monospace; letter-spacing: .06em; }
.hero-panel-grid b { display: block; margin-top: .3rem; color: var(--ink-strong); font: 600 1rem 'Space Grotesk', sans-serif; }
.hero-panel-footer { margin-top: .75rem; padding-top: .7rem; border-top: 1px solid rgba(167,179,199,.12); color: var(--ink-soft); letter-spacing: 0; font-size: 10px; }
.hero-status-mark { display: inline-grid; place-items: center; width: 17px; height: 17px; border-radius: 50%; color: var(--mint); border: 1px solid rgba(53,224,189,.4); }
.hero-panel-arrow { margin-left: auto; color: var(--coral); font-size: 15px; }

@keyframes panelFloat { 50% { transform: translateY(-8px); } }
@keyframes barBreathe { 50% { transform: scaleY(.82); opacity: .78; } }

@keyframes spinOrbit { to { transform: rotate(360deg); } }
@keyframes orbitBreath { 50% { transform: translateY(-50%) scale(1.035); opacity: .82; } }
@keyframes signalPulse { 50% { transform: scale(.7); opacity: .45; } }

.scroll-cue { bottom: 22px; }

button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--coral); outline-offset: 3px; }

@media (max-width: 499px) {
	.home-hero-orbit { width: 75vw; right: -24%; top: 22%; opacity: .22; }
	.hero-content-shell { height: auto !important; min-height: 100%; padding-top: 7.5rem; padding-bottom: 5.5rem; }
	.hero-command-panel { width: min(100%, 470px); margin: 3rem 0 0 auto; animation: none; }
	.hero-content-shell h1 { font-size: clamp(1.8rem, 9vw, 2.5rem); overflow-wrap: normal; word-break: normal; }
	.hero-content-shell p { font-size: .95rem; }
	.hero-content-shell .mt-8 a { width: 100%; text-align: center; }
}

@media (max-width: 360px) {
	#siteHeader .max-w-7xl { padding-left: 1rem; padding-right: 1rem; }
	.home-hero-orbit { right: -38%; opacity: .28; }
	.hero-command-panel { padding: .9rem; margin-top: 2.2rem; }
	.hero-panel-time { display: none; }
	.hero-panel-heading strong { font-size: 1.2rem; }
	.hero-score { font-size: 1.8rem; }
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Final hero contract: layout never depends on animation or viewport height. */
.hero-content-shell {
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
}
.hero-content-shell > * { min-width: 0; animation: none !important; }
.hero-command-panel { transform: none !important; }

@media (min-width: 700px) {
	.hero-content-shell {
		display: grid !important;
		grid-template-areas: "copy panel" "stats panel" !important;
		grid-template-columns: minmax(0, 1fr) minmax(300px, 400px) !important;
		grid-template-rows: auto auto !important;
		column-gap: clamp(2rem, 6vw, 6rem) !important;
		align-content: center !important;
		align-items: center !important;
		height: 100% !important;
	}
	.hero-content-shell > .max-w-2xl { grid-area: copy !important; }
	.hero-content-shell > .hero-command-panel {
		grid-area: panel !important;
		width: 100% !important;
		max-height: min(68vh, 430px) !important;
		justify-self: end !important;
		align-self: center !important;
		overflow: auto !important;
	}
	.hero-content-shell > .mt-14 { grid-area: stats !important; margin-top: 2.5rem !important; }
}

@media (max-width: 699px) {
	.home-hero {
		height: auto !important;
		min-height: 0 !important;
		overflow: visible !important;
	}
	.hero-content-shell {
		display: flex !important;
		flex-direction: column !important;
		justify-content: center !important;
		height: auto !important;
		min-height: 100% !important;
		padding-top: 7.5rem !important;
		padding-bottom: 5rem !important;
	}
	.hero-content-shell > .max-w-2xl,
	.hero-content-shell > .hero-command-panel,
	.hero-content-shell > .mt-14 { width: 100% !important; max-width: none !important; }
	.hero-command-panel { margin: 2.5rem 0 0 !important; }
	.hero-content-shell h1 { font-size: clamp(1.8rem, 9vw, 2.5rem) !important; overflow-wrap: normal !important; word-break: normal !important; }
	.hero-content-shell .mt-8 a { width: 100%; text-align: center; }
}

/* InsuranceShield signature palette: warm editorial contrast instead of the shared blue-teal treatment. */
:root {
	--surface: #1a1b1d;
	--surface-raised: #252629;
	--surface-deep: #101112;
	--ink-strong: #f4efe5;
	--ink-soft: #b8b1a5;
	--line-soft: rgba(244, 239, 229, 0.16);
	--mint: #d6f36a;
	--blue: #ff7058;
	--coral: #f6c66d;
}

body,
.bg-base { background-color: var(--surface-deep) !important; color: var(--ink-strong); }
.bg-hero-gradient { background: linear-gradient(125deg, #171819 0%, #272424 52%, #3a2824 100%) !important; }
.bg-aurora { background-image: radial-gradient(circle at 18% 28%, rgba(255, 112, 88, .16), transparent 42%), radial-gradient(circle at 82% 72%, rgba(214, 243, 106, .12), transparent 48%) !important; }
.bg-mesh { background-image: linear-gradient(rgba(244, 239, 229, .055) 1px, transparent 1px), linear-gradient(90deg, rgba(244, 239, 229, .055) 1px, transparent 1px) !important; }
.panel { background: linear-gradient(145deg, rgba(37, 38, 41, .96), rgba(22, 23, 24, .96)); border-color: var(--line-soft); }
.panel:hover { border-color: rgba(255, 112, 88, .5); box-shadow: 0 24px 60px rgba(0,0,0,.32), 0 0 0 1px rgba(214,243,106,.1); }
.text-gradient { background-image: linear-gradient(100deg, var(--accent-coral), var(--accent-lime) 68%, var(--coral)) !important; }
.text-ink { color: var(--ink-strong) !important; }
.text-mute { color: var(--ink-soft) !important; }
.text-cta, .text-cyan { color: var(--accent-lime) !important; }
.text-amber { color: var(--coral) !important; }
.bg-cta { background-color: var(--accent-coral) !important; }
.bg-card { background-color: var(--surface-raised) !important; }
.bg-chrome { background-color: #0b0c0d !important; }
.border-line { border-color: var(--line-soft) !important; }
#siteHeader { background: rgba(16, 17, 18, .72); }
#siteHeader.header-scrolled { background: rgba(16, 17, 18, .94); }
.nav-active { color: var(--accent-lime) !important; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline-color: var(--accent-coral); }
[stroke="#22D3EE"], [fill="#22D3EE"] { stroke: var(--accent-coral); fill: var(--accent-coral); }
[stroke="#14B8A6"], [fill="#14B8A6"] { stroke: var(--accent-lime); fill: var(--accent-lime); }
[stroke="#FBBF24"], [fill="#FBBF24"] { stroke: var(--coral); fill: var(--coral); }




/* Hide Scrollbar */
html,
body {
  overflow-x: hidden;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar {
  display: none;
}