/* ============================================================
   TUME Design System — TW Team × Lower
   Cinematic navy stages · luminous light sections · glass · gold
   ============================================================ */

/* ---------- Tokens ---------- */
:root {
	--navy-950: #060d17;
	--navy-900: #0a1626;
	--navy-800: #10233c;
	--navy-700: #1e3e5c;
	--blue-500: #1b6cf2;
	--blue-400: #4f8ffb;
	--sky-300: #8cb8ff;
	--gold-400: #d9a441;
	--gold-300: #f0c97a;
	--paper: #f7f9fc;
	--white: #ffffff;
	--ink-900: #0d1b2a;
	--ink-600: #46586e;
	--mist-300: #a9bed8;
	--text-on-dark: #e8f0fa;

	--font-display: "Source Serif 4", "Playfair Display", Georgia, "Times New Roman", serif; /* Source Serif 4 from 9/16: Playfair's f hook ran into i and l (client, 9/15) */
	--font-ui: "Archivo", "Helvetica Neue", Arial, sans-serif;
	--font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", monospace;

	--wrap: 1200px;
	--wrap-wide: 1440px;
	--radius: 20px;
	--radius-sm: 12px;
	--shadow-xl: 0 24px 64px -16px rgba(13, 27, 42, 0.22);
	--shadow-md: 0 10px 32px -12px rgba(13, 27, 42, 0.16);
	--glass-bg: rgba(255, 255, 255, 0.06);
	--glass-border: rgba(140, 184, 255, 0.18);
	--ease-out: cubic-bezier(0.22, 1, 0.36, 1);
	--nav-h: 84px;
}

/* ---------- Reset & base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; overflow-x: clip; max-width: 100vw; }
body {
	margin: 0;
	font-family: var(--font-ui);
	font-size: 17px;
	line-height: 1.65;
	color: var(--ink-900);
	background: var(--navy-950);
	-webkit-font-smoothing: antialiased;
	overflow-x: clip;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
/* Ligatures off on display type: Playfair joins "fi" and "fl" into one glyph (first, refinance, flexibility), which the
 * client reads as the letters bleeding together (9/15). Tracking opened a touch for the same reason. */
h1, h2, h3, h4 { font-family: var(--font-display); font-weight: 590; line-height: 1.08; letter-spacing: 0; margin: 0 0 0.5em; font-variant-ligatures: none; font-feature-settings: "liga" 0, "dlig" 0, "clig" 0; }
h1 { font-size: clamp(44px, 6.4vw, 84px); }
h2 { font-size: clamp(34px, 4.2vw, 56px); }
h3 { font-size: clamp(22px, 2.2vw, 28px); line-height: 1.2; }
p { margin: 0 0 1em; }
:focus-visible { outline: 2px solid var(--blue-400); outline-offset: 3px; border-radius: 4px; }

.skip-link {
	position: absolute; left: -9999px; top: 0; z-index: 999;
	background: var(--white); color: var(--ink-900); padding: 12px 20px; border-radius: 0 0 12px 0;
}
.skip-link:focus { left: 0; }

/* ---------- Layout primitives ---------- */
.wrap { max-width: var(--wrap); margin-inline: auto; padding-inline: 24px; }
.wrap-wide { max-width: var(--wrap-wide); margin-inline: auto; padding-inline: 24px; }
.section { padding-block: clamp(72px, 9vw, 150px); position: relative; }
.stage-dark { background: var(--navy-950); color: var(--text-on-dark); position: relative; }
.stage-dark-2 { background: var(--navy-900); color: var(--text-on-dark); position: relative; }
.stage-light { background: var(--paper); color: var(--ink-900); position: relative; }
.stage-white { background: var(--white); color: var(--ink-900); position: relative; }
.stage-dark h1, .stage-dark h2, .stage-dark h3, .stage-dark-2 h1, .stage-dark-2 h2, .stage-dark-2 h3 { color: var(--white); }

.eyebrow {
	font-family: var(--font-mono); font-size: 13px; font-weight: 450;
	text-transform: uppercase; letter-spacing: 0.14em;
	color: var(--blue-500); margin: 0 0 18px;
}
.stage-dark .eyebrow, .stage-dark-2 .eyebrow { color: var(--sky-300); }
.eyebrow-gold { color: var(--gold-400) !important; }
.lede { font-size: clamp(18px, 1.6vw, 21px); line-height: 1.6; color: var(--ink-600); max-width: 640px; }
.stage-dark .lede, .stage-dark-2 .lede { color: var(--mist-300); }
.center { text-align: center; }
.center .lede { margin-inline: auto; }

.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 80px); align-items: center; }
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }

/* ---------- Buttons ---------- */
.btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 10px;
	font-family: var(--font-ui); font-weight: 650; font-size: 16px; line-height: 1;
	padding: 18px 34px; border-radius: 999px; text-decoration: none;
	border: 1px solid transparent; cursor: pointer;
	transition: transform 0.35s var(--ease-out), box-shadow 0.35s var(--ease-out), background 0.3s, border-color 0.3s;
}
.btn-cta {
	background: linear-gradient(135deg, var(--blue-500), var(--blue-400));
	color: var(--white);
	box-shadow: 0 8px 28px -8px rgba(27, 108, 242, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.25);
}
.btn-cta:hover { box-shadow: 0 14px 40px -8px rgba(27, 108, 242, 0.75), inset 0 1px 0 rgba(255, 255, 255, 0.25); }
.btn-ghost {
	background: var(--glass-bg); color: var(--white);
	border-color: var(--glass-border);
	-webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
}
.btn-ghost:hover { background: rgba(255, 255, 255, 0.11); }
.stage-light .btn-ghost, .stage-white .btn-ghost { color: var(--navy-700); border-color: rgba(30, 62, 92, 0.25); background: rgba(30, 62, 92, 0.04); }
.stage-light .btn-ghost:hover, .stage-white .btn-ghost:hover { background: rgba(30, 62, 92, 0.09); }
.btn-gold { background: linear-gradient(135deg, var(--gold-400), var(--gold-300)); color: var(--navy-950); box-shadow: 0 8px 28px -8px rgba(217, 164, 65, 0.5); }
.btn-lg { padding: 22px 44px; font-size: 17px; }
.btn-note { display: block; margin-top: 12px; font-size: 13.5px; color: var(--mist-300); }
.stage-light .btn-note, .stage-white .btn-note { color: var(--ink-600); }

/* ---------- Cards & glass ---------- */
.glass-card {
	background: var(--glass-bg);
	border: 1px solid var(--glass-border);
	border-radius: var(--radius);
	-webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
	padding: 34px;
	transition: transform 0.5s var(--ease-out), border-color 0.4s, box-shadow 0.5s var(--ease-out);
}
.glass-card:hover { border-color: rgba(140, 184, 255, 0.4); box-shadow: 0 24px 60px -20px rgba(27, 108, 242, 0.35); }
.light-card {
	background: var(--white); border-radius: var(--radius); padding: 34px;
	box-shadow: var(--shadow-md); border: 1px solid rgba(13, 27, 42, 0.05);
	transition: transform 0.5s var(--ease-out), box-shadow 0.5s var(--ease-out);
}
.light-card:hover { box-shadow: var(--shadow-xl); }
.card-icon {
	width: 58px; height: 58px; border-radius: 50%; display: grid; place-items: center; margin-bottom: 24px;
	background: transparent; color: var(--navy-700);
	border: 1px solid rgba(217, 164, 65, 0.55);
	position: relative;
	transition: border-color 0.4s, box-shadow 0.5s var(--ease-out);
}
.card-icon::after {
	content: ""; position: absolute; inset: -5px; border-radius: 50%;
	border: 1px solid rgba(217, 164, 65, 0.18);
	transition: transform 0.5s var(--ease-out), border-color 0.4s;
}
.card-icon svg { stroke-width: 1.4; width: 26px; height: 26px; }
.light-card:hover .card-icon, .glass-card:hover .card-icon {
	border-color: var(--gold-400);
	box-shadow: 0 0 24px rgba(217, 164, 65, 0.25);
}
.light-card:hover .card-icon::after, .glass-card:hover .card-icon::after { transform: scale(1.12); border-color: rgba(217, 164, 65, 0.4); }
.stage-dark .card-icon, .stage-dark-2 .card-icon { color: var(--sky-300); }

/* Stat chips */
.stat-chip { text-align: left; }
.stat-num {
	font-family: var(--font-mono); font-weight: 450;
	font-size: clamp(38px, 4.6vw, 64px); line-height: 1; color: var(--white);
	display: inline-block;
}
.stage-light .stat-num, .stage-white .stat-num { color: var(--navy-700); }
.stat-num .unit { font-size: 0.55em; color: var(--sky-300); }
.stat-label { margin-top: 10px; font-size: 15px; color: var(--mist-300); }
.stage-light .stat-label, .stage-white .stat-label { color: var(--ink-600); }
.stat-tick { display: block; width: 44px; height: 3px; margin-top: 16px; background: linear-gradient(90deg, var(--gold-400), var(--gold-300)); border-radius: 2px; }

/* ---------- Nav ---------- */
.site-nav {
	position: fixed; inset: 0 0 auto; z-index: 100;
	transition: background 0.4s, box-shadow 0.4s, backdrop-filter 0.4s;
}
.site-nav.is-scrolled {
	background: rgba(6, 13, 23, 0.72);
	-webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);
	box-shadow: 0 1px 0 rgba(140, 184, 255, 0.12);
}
.nav-inner {
	max-width: var(--wrap-wide); margin-inline: auto; padding: 0 28px;
	height: var(--nav-h); display: flex; align-items: center; gap: 30px;
	transition: height 0.4s var(--ease-out);
}
.site-nav.is-scrolled .nav-inner { height: 66px; }
.nav-logo img { width: 148px; height: auto; }
.nav-links { display: flex; align-items: center; gap: 22px; margin-left: auto; }
.nav-links > a, .nav-drop-btn {
	font-size: 15px; font-weight: 500; color: var(--text-on-dark); text-decoration: none;
	background: none; border: 0; padding: 8px 2px; cursor: pointer; font-family: var(--font-ui);
	display: inline-flex; align-items: center; gap: 6px; white-space: nowrap;
	position: relative;
}
/* Eight top-level items since 9/15 (Rate Report and Property Search moved under Resources): the logo and the Apply
 * button keep their full size down to 1240px; below that they tighten so nothing wraps before the burger at 1080px. */
@media (max-width: 1240px) {
	.nav-links { gap: 12px; }
	.nav-links > a, .nav-drop-btn { font-size: 14px; }
	.nav-logo img { width: 132px; }
	.nav-apply { padding: 11px 18px; font-size: 14px; }
	.nav-phone { font-size: 14px; }
}
/* Nine items plus phone and button fill the bar even on wide screens: below 1600px the phone drops to its icon
 * (the number is one tap away and repeated site-wide) and the links tighten a notch, so nothing wraps. */
@media (max-width: 1600px) {
	.nav-links { gap: 16px; }
	.nav-links > a, .nav-drop-btn { font-size: 14.5px; }
	.nav-phone span { display: none; }
}
.nav-links > a::after, .nav-drop-btn::after {
	content: ""; position: absolute; left: 0; right: 100%; bottom: 2px; height: 2px;
	background: var(--sky-300); transition: right 0.35s var(--ease-out);
}
.nav-links > a:hover::after, .nav-drop-btn:hover::after { right: 0; }
.nav-drop { position: relative; }
.nav-drop-panel {
	position: absolute; top: calc(100% + 14px); left: 50%; transform: translateX(-50%) translateY(8px);
	min-width: 230px; padding: 12px; border-radius: 16px;
	background: rgba(10, 22, 38, 0.92);
	-webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px);
	border: 1px solid var(--glass-border);
	box-shadow: 0 30px 60px -20px rgba(0, 0, 0, 0.5);
	display: flex; flex-direction: column;
	opacity: 0; visibility: hidden; transition: opacity 0.3s, transform 0.3s var(--ease-out), visibility 0.3s;
}
.nav-drop:hover .nav-drop-panel, .nav-drop:focus-within .nav-drop-panel {
	opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0);
}
.nav-drop-panel a {
	padding: 10px 16px; border-radius: 10px; font-size: 14.5px; color: var(--text-on-dark);
	text-decoration: none; transition: background 0.2s, color 0.2s;
}
.nav-drop-panel a:hover { background: rgba(140, 184, 255, 0.1); color: var(--white); }
.nav-drop-panel .drop-all { color: var(--sky-300); font-weight: 500; }
.nav-actions { display: flex; align-items: center; gap: 20px; flex-shrink: 0; }
.nav-phone {
	display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-mono);
	font-size: 14.5px; color: var(--text-on-dark); text-decoration: none; white-space: nowrap;
}
.nav-phone:hover { color: var(--sky-300); }
.nav-apply { padding: 13px 26px; font-size: 15px; white-space: nowrap; flex-shrink: 0; } /* never a two-line pill */
.nav-burger { display: none; }

/* Mobile menu */
.mobile-menu {
	position: fixed; inset: 0; z-index: 99; padding: 110px 32px 40px;
	background: var(--navy-950);
	-webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px);
	flex-direction: column;
}
.mobile-menu nav { display: flex; flex-direction: column; gap: 4px; }
.mobile-menu nav a {
	color: var(--white); text-decoration: none; font-family: var(--font-display);
	font-size: 28px; padding: 10px 0; border-bottom: 1px solid rgba(140, 184, 255, 0.08);
	opacity: 0; transform: translateY(16px);
}
.mobile-menu-cta { margin-top: 28px; display: flex; flex-direction: column; gap: 12px; }

/* ---------- Hero ---------- */
.hero {
	min-height: 100svh; display: flex; align-items: center; position: relative;
	overflow: clip; padding-top: var(--nav-h);
}
.page-hero { padding: calc(var(--nav-h) + clamp(64px, 9vw, 130px)) 0 clamp(64px, 8vw, 110px); overflow: clip; position: relative; }
.hero-mesh, .footer-mesh {
	position: absolute; inset: -20%; z-index: 0; pointer-events: none;
	background:
		radial-gradient(42% 42% at 18% 28%, rgba(30, 62, 92, 0.55) 0%, transparent 70%),
		radial-gradient(36% 36% at 82% 18%, rgba(27, 108, 242, 0.28) 0%, transparent 70%),
		radial-gradient(30% 30% at 68% 82%, rgba(140, 184, 255, 0.12) 0%, transparent 70%);
	filter: none;
}
.footer-mesh { opacity: 0.5; }
.hero-beam {
	position: absolute; top: -30%; width: 42%; height: 160%; z-index: 0; pointer-events: none;
	background: linear-gradient(100deg, transparent 30%, rgba(140, 184, 255, 0.05) 50%, transparent 70%);
	transform: rotate(12deg);
}
.hero-photo {
	position: absolute; inset: -16% 0; z-index: 0; pointer-events: none;
	will-change: transform;
}
.hero-photo img {
	width: 100%; height: 100%; object-fit: cover; opacity: 1;
	animation: hero-ken 1.4s cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes hero-ken { from { transform: scale(1.09); } to { transform: scale(1); } }
.hero-photo video {
	position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
	opacity: 0; transition: opacity 0.9s ease;
}
.hero-photo.video-live video { opacity: 1; }
.hero-photo img { transition: opacity 0.9s ease; }
.hero-photo.video-live img { opacity: 0; animation: none; }
.hero-photo.video-dip video { opacity: 0; transition-duration: 0.55s; }
.hero-photo::after {
	content: ""; position: absolute; inset: 0;
	background:
		linear-gradient(90deg, rgba(6, 13, 23, 0.5) 0%, rgba(6, 13, 23, 0.2) 42%, rgba(6, 13, 23, 0) 66%),
		linear-gradient(180deg, rgba(6, 13, 23, 0.24) 0%, rgba(6, 13, 23, 0.03) 48%, rgba(6, 13, 23, 0.6) 88%, var(--navy-950) 98%);
}
#tume-particles { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.hero-content { position: relative; z-index: 2; width: 100%; will-change: transform, opacity; }
.hero h1 { margin-bottom: 26px; }
.hero .lede { margin-bottom: 40px; }
.hero-ctas { display: flex; gap: 18px; flex-wrap: wrap; align-items: center; }

/* Floating hero card */
.hero-float {
	position: absolute; z-index: 2; right: 6%; bottom: 16%;
	width: min(340px, 30vw);
}
.hero-scroll-hint {
	position: absolute; bottom: 34px; left: 50%; transform: translateX(-50%); z-index: 2;
	font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase;
	color: var(--mist-300); display: flex; flex-direction: column; align-items: center; gap: 10px;
}
.hero-scroll-hint::after {
	content: ""; width: 1px; height: 44px;
	background: linear-gradient(180deg, var(--sky-300), transparent);
	animation: scrollhint 2.2s var(--ease-out) infinite;
}
@keyframes scrollhint { 0% { transform: scaleY(0); transform-origin: top; } 45% { transform: scaleY(1); transform-origin: top; } 55% { transform: scaleY(1); transform-origin: bottom; } 100% { transform: scaleY(0); transform-origin: bottom; } }

/* ---------- Marquee ---------- */
.marquee { overflow: clip; display: flex; }
.marquee-track {
	display: flex; gap: 24px; padding-block: 6px; padding-right: 24px; flex-shrink: 0; will-change: transform;
	animation: marquee-drift var(--mq-dur, 55s) linear infinite;
}
.marquee:hover .marquee-track, .marquee.mq-off .marquee-track { animation-play-state: paused; }
@keyframes marquee-drift { to { transform: translateX(-100%); } }
/* Solid faux-glass in the marquee: live backdrop blur on 16 moving cards is a GPU sink, and the blur is invisible while they drift */
.marquee .glass-card { width: 380px; flex-shrink: 0; -webkit-backdrop-filter: none; backdrop-filter: none; background: rgba(22, 39, 61, 0.92); }
.review-stars { color: var(--gold-400); letter-spacing: 3px; font-size: 15px; margin-bottom: 12px; }
.review-quote { font-size: 15.5px; line-height: 1.6; color: var(--text-on-dark); }
.review-meta { margin-top: 16px; display: flex; align-items: center; gap: 10px; font-size: 13.5px; color: var(--mist-300); }
.review-meta img { height: 18px; width: auto; opacity: 0.85; }

/* ---------- Pinned #TUME steps ---------- */
.tume-steps { position: relative; }
.tume-step { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: clamp(32px, 5vw, 80px); align-items: center; }
.step-num {
	font-family: var(--font-mono); font-size: clamp(96px, 14vw, 190px); line-height: 0.9;
	color: transparent; -webkit-text-stroke: 1.5px rgba(140, 184, 255, 0.35);
}
.step-progress { display: flex; gap: 8px; margin-bottom: 34px; }
.step-progress i { width: 44px; height: 3px; border-radius: 2px; background: rgba(140, 184, 255, 0.18); overflow: hidden; position: relative; }
.step-progress i::after { content: ""; position: absolute; inset: 0; background: var(--sky-300); transform: scaleX(0); transform-origin: left; transition: transform 0.4s var(--ease-out); }
.step-progress i.on::after { transform: scaleX(1); }

/* ---------- Prose (long-form) ---------- */
.prose { max-width: 760px; }
.prose h2 { font-size: clamp(28px, 3vw, 38px); margin-top: 1.6em; }
.prose h3 { margin-top: 1.4em; }
.prose ul, .prose ol { padding-left: 24px; margin-bottom: 1.2em; }
.prose li { margin-bottom: 0.45em; }
.prose a { color: var(--blue-500); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.prose blockquote {
	margin: 1.6em 0; padding: 20px 28px; border-left: 3px solid var(--gold-400);
	background: rgba(30, 62, 92, 0.04); border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
	font-family: var(--font-display); font-size: 1.15em;
}

/* ---------- FAQ accordion ---------- */
.faq-item { border-bottom: 1px solid rgba(13, 27, 42, 0.1); }
.stage-dark .faq-item, .stage-dark-2 .faq-item { border-color: rgba(140, 184, 255, 0.12); }
.faq-item summary {
	list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 20px;
	padding: 24px 0; font-family: var(--font-display); font-size: clamp(18px, 1.7vw, 22px); font-weight: 590;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after {
	content: "+"; font-family: var(--font-mono); font-size: 22px; color: var(--blue-500);
	transition: transform 0.35s var(--ease-out); flex-shrink: 0;
}
.faq-item[open] summary::after { transform: rotate(45deg); }
.faq-item .faq-a { padding: 0 0 24px; max-width: 700px; color: var(--ink-600); }
.stage-dark .faq-item .faq-a, .stage-dark-2 .faq-item .faq-a { color: var(--mist-300); }

/* ---------- Team ---------- */
.team-card { text-align: center; }
.team-photo {
	width: 168px; height: 168px; border-radius: 50%; object-fit: cover; margin: 0 auto 22px;
	border: 3px solid var(--white); box-shadow: 0 0 0 2px var(--gold-400), var(--shadow-md);
}
.team-role { font-family: var(--font-mono); font-size: 13px; text-transform: uppercase; letter-spacing: 0.12em; color: var(--blue-500); margin-bottom: 6px; }
.team-nmls { font-size: 13.5px; color: var(--ink-600); }

/* ---------- Forms ---------- */
.tume-form { display: grid; gap: 18px; }
.tume-form .row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.tume-form label { font-size: 14px; font-weight: 500; display: block; margin-bottom: 8px; }
.tume-form input, .tume-form select, .tume-form textarea {
	width: 100%; padding: 15px 18px; font: inherit; font-size: 15.5px; color: var(--white);
	background: var(--glass-bg); border: 1px solid var(--glass-border); border-radius: var(--radius-sm);
	transition: border-color 0.3s, background 0.3s;
}
.tume-form input:focus, .tume-form select:focus, .tume-form textarea:focus {
	outline: none; border-color: var(--blue-400); background: rgba(255, 255, 255, 0.09);
}
.form-note { font-size: 13.5px; color: var(--mist-300); }

/* ---------- Footer ---------- */
.site-footer { padding: clamp(64px, 7vw, 100px) 0 36px; overflow: clip; }
.footer-inner { position: relative; z-index: 1; max-width: var(--wrap-wide); margin-inline: auto; padding-inline: 28px; }
.footer-top { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1fr 1.3fr; gap: 40px; padding-bottom: 48px; }
.footer-brand img { width: 190px; }
.footer-tag { margin-top: 18px; font-size: 14.5px; color: var(--mist-300); max-width: 280px; }
.footer-social { display: flex; gap: 14px; margin-top: 20px; }
.footer-social a { color: var(--mist-300); transition: color 0.25s, transform 0.25s; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--glass-border); }
.footer-social a:hover { color: var(--white); transform: translateY(-3px); }
.footer-col h2 { font-family: var(--font-mono); font-size: 12.5px; font-weight: 450; text-transform: uppercase; letter-spacing: 0.14em; color: var(--sky-300); margin-bottom: 18px; }
.footer-col { display: flex; flex-direction: column; gap: 10px; }
.footer-col a { color: var(--mist-300); text-decoration: none; font-size: 14.5px; transition: color 0.25s; }
.footer-col a:hover { color: var(--white); }
.footer-col p { font-size: 14.5px; color: var(--mist-300); margin: 0; }
.footer-phone { font-family: var(--font-mono); font-size: 19px !important; color: var(--white) !important; }
.footer-hours { font-size: 13px !important; }
.footer-area { font-size: 13px !important; color: var(--mist-400, #8a99b3); margin-top: 10px; }
.footer-legal {
	border-top: 1px solid rgba(140, 184, 255, 0.1); padding-top: 28px;
	display: flex; gap: 20px; align-items: flex-start;
}
.footer-legal p { font-size: 12.5px; line-height: 1.7; color: rgba(169, 190, 216, 0.75); margin: 0; }
.footer-legal a { color: var(--mist-300); }
.footer-copy { margin-top: 20px; font-size: 12.5px; color: rgba(169, 190, 216, 0.55); }

/* ---------- Mobile CTA bar ---------- */
.mobile-cta-bar {
	position: fixed; bottom: 0; left: 0; right: 0; z-index: 90; display: none;
	gap: 10px; padding: 10px 14px calc(10px + env(safe-area-inset-bottom));
	background: rgba(6, 13, 23, 0.9);
	-webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
	border-top: 1px solid var(--glass-border);
	transform: translateY(110%); transition: transform 0.45s var(--ease-out);
}
.mobile-cta-bar.show { transform: translateY(0); }
.mobile-cta-bar .btn { flex: 1; padding: 15px 10px; font-size: 15px; }
.mobile-cta-bar .btn-ghost { flex: 0.6; }

/* ---------- Cursor glow ---------- */
.cursor-glow {
	position: fixed; z-index: 5; width: 520px; height: 520px; border-radius: 50%;
	pointer-events: none; opacity: 0; left: 0; top: 0;
	background: radial-gradient(circle, rgba(79, 143, 251, 0.07) 0%, transparent 65%);
	transform: translate(-50%, -50%);
}

/* ---------- Curtain reveal: one-shot clip-path on enter (JS toggles .curtain-open) ---------- */
html.js [data-curtain] {
	clip-path: inset(8% 5% 0 5% round 40px);
	transform: scale(0.965);
	transition: clip-path 0.9s var(--ease-out), transform 0.9s var(--ease-out);
}
html.js [data-curtain].curtain-open { clip-path: inset(0 0 0 0 round 0px); transform: none; }
@media (max-width: 860px) { html.js [data-curtain] { clip-path: inset(8% 0 0 0 round 32px); } }
@media (prefers-reduced-motion: reduce) { html.js [data-curtain] { clip-path: none; transform: none; transition: none; } }

/* ---------- Entrance system: CSS transitions driven by IntersectionObserver ---------- */
html.js [data-anim] {
	opacity: 0; transform: translateY(64px) skewY(2deg) scale(0.985);
	filter: blur(7px);
	transition: opacity 0.85s var(--ease-out), transform 1.05s cubic-bezier(0.16, 1, 0.3, 1), filter 0.8s var(--ease-out);
}
html.js [data-anim].in { opacity: 1; transform: none; filter: blur(0); }
html.js [data-anim].done, html.js [data-anim].lines-mode { opacity: 1; transform: none; filter: none; transition: transform 0.45s var(--ease-out), box-shadow 0.5s var(--ease-out); }
html.js [data-anim="scale"] { transform: translateY(26px) scale(0.94); }
html.js [data-anim="clip-left"] {
	opacity: 1; transform: none; filter: none;
	-webkit-mask-image: linear-gradient(100deg, #000 45%, transparent 58%);
	mask-image: linear-gradient(100deg, #000 45%, transparent 58%);
	-webkit-mask-size: 260% 100%; mask-size: 260% 100%;
	-webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
	-webkit-mask-position: 100% 0; mask-position: 100% 0;
	transition: -webkit-mask-position 2s cubic-bezier(0.55, 0.06, 0.28, 0.99), mask-position 2s cubic-bezier(0.55, 0.06, 0.28, 0.99);
}
html.js [data-anim="clip-left"].in { -webkit-mask-position: 0% 0; mask-position: 0% 0; }
html.js [data-anim="img-reveal"] { opacity: 1; transform: none; filter: none; clip-path: inset(100% 0 0 0); transition: clip-path 1.2s cubic-bezier(0.77, 0, 0.18, 1); }
html.js [data-anim="img-reveal"].in { clip-path: inset(0 0 0 0); }
html.js [data-anim="img-reveal"] img { transform: scale(1.22); transition: transform 1.55s cubic-bezier(0.22, 1, 0.36, 1) 0.1s; }
html.js [data-anim="img-reveal"].in img { transform: scale(1); }
html.js [data-anim-group] { perspective: 1000px; }
html.js [data-anim-group] > * {
	opacity: 0; transform: translateY(64px) rotateX(-10deg) scale(0.96);
	transition: opacity 0.8s var(--ease-out), transform 0.95s cubic-bezier(0.16, 1, 0.3, 1);
}
html.js [data-anim-group].in > * { opacity: 1; transform: none; }
html.js [data-anim-group].done > * { opacity: 1; transform: none; transition: transform 0.45s var(--ease-out), box-shadow 0.5s var(--ease-out); }
html.js [data-anim-group].done > .light-card:hover, html.js [data-anim-group].done > .glass-card:hover, html.js [data-anim].done.glass-card:hover { transform: translateY(-8px); }
html.js [data-anim-group].in > *:nth-child(2) { transition-delay: 0.09s; }
html.js [data-anim-group].in > *:nth-child(3) { transition-delay: 0.18s; }
html.js [data-anim-group].in > *:nth-child(4) { transition-delay: 0.27s; }
html.js [data-anim-group].in > *:nth-child(5) { transition-delay: 0.36s; }
html.js [data-anim-group].in > *:nth-child(6) { transition-delay: 0.45s; }
html.js [data-anim-group].in > *:nth-child(7) { transition-delay: 0.54s; }
html.js [data-anim-group].in > *:nth-child(8) { transition-delay: 0.63s; }
html.js [data-anim-group].in > *:nth-child(9) { transition-delay: 0.72s; }
.split-line-wrap { overflow: hidden; display: block; padding: 0.14em 0.12em; margin: -0.14em -0.12em; }

/* ---------- Utilities ---------- */
.mt-0 { margin-top: 0; } .mb-0 { margin-bottom: 0; }
.gold { color: var(--gold-400); }
.stage-dark .sky, .stage-dark-2 .sky {
	background: linear-gradient(100deg, var(--blue-400) 10%, var(--sky-300) 35%, var(--gold-300) 55%, var(--blue-400) 80%);
	background-size: 280% 100%;
	-webkit-background-clip: text; background-clip: text; color: transparent;
	animation: text-shimmer 8s linear infinite;
}
@keyframes text-shimmer { to { background-position: -280% 0; } }
.sky { color: var(--sky-300); }
.divider-fade { height: 1px; background: linear-gradient(90deg, transparent, rgba(140, 184, 255, 0.25), transparent); border: 0; margin: 0; }
.section-head { max-width: 720px; margin-bottom: clamp(40px, 5vw, 72px); }
.section-head.center { margin-inline: auto; text-align: center; }
.logo-strip { display: flex; align-items: center; justify-content: center; gap: clamp(28px, 5vw, 64px); flex-wrap: wrap; }
.logo-strip img { height: 34px; width: auto; opacity: 0.75; filter: grayscale(1) brightness(1.6); transition: opacity 0.3s, filter 0.3s; }
.logo-strip img:hover { opacity: 1; filter: none; }
.stage-light .logo-strip img, .stage-white .logo-strip img { filter: grayscale(1); }
.stage-light .logo-strip img:hover, .stage-white .logo-strip img:hover { filter: none; }

/* ---------- Responsive ---------- */
@media (max-width: 1080px) {
	.nav-links { display: none; }
	.nav-actions { margin-left: auto; }
	.nav-burger {
		display: flex; flex-direction: column; gap: 5px; background: none; border: 0; padding: 10px; cursor: pointer;
	}
	.nav-burger span { width: 24px; height: 2px; background: var(--white); border-radius: 2px; transition: transform 0.35s var(--ease-out), opacity 0.3s; }
	.nav-burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
	.nav-burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
	.nav-burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
	.mobile-menu { display: flex; }
	.mobile-menu[hidden] { display: none; }
	.footer-top { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 860px) {
	.grid-2, .grid-3, .grid-4, .tume-step, .tume-form .row-2 { grid-template-columns: 1fr; }
	.grid-2 { gap: 44px; }
	.hero { min-height: 92svh; flex-direction: column; justify-content: center; align-items: stretch; padding-bottom: 48px; }
	.hero-float { position: static; width: auto; margin: 40px 20px 0; }
	.nav-phone span { display: none; }
	.nav-apply { display: none; }
	.mobile-cta-bar { display: flex; }
	body { padding-bottom: 0; }
	.step-num { font-size: 96px; }
	.marquee .glass-card { width: 300px; }
	.hero-scroll-hint { display: none; }
}
@media (max-width: 560px) {
	.footer-top { grid-template-columns: 1fr; }
	.wrap, .wrap-wide { padding-inline: 20px; }
	.glass-card, .light-card { padding: 26px; }
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation-duration: 0.001s !important; transition-duration: 0.001s !important; }
	.js [data-anim] { visibility: visible !important; }
	.cursor-glow, .hero-scroll-hint { display: none !important; }
}

/* Footer logo: mono-white treatment of the co-brand */
.logo-invert { filter: brightness(0) invert(1) opacity(0.94); }

/* ---------- Interior page helpers ---------- */
.form-ok { color: #7dd8a0 !important; }
.form-err { color: #f0a3a3 !important; }
.breadcrumbs { font-family: var(--font-mono); font-size: 12.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--mist-300); margin-bottom: 22px; }
.breadcrumbs a { color: var(--sky-300); text-decoration: none; }
.breadcrumbs a:hover { text-decoration: underline; }
.glance { display: flex; flex-wrap: wrap; gap: 14px; margin: 34px 0 0; }
.glance-chip {
	display: flex; flex-direction: column; gap: 4px; padding: 16px 22px; border-radius: 14px;
	background: var(--glass-bg); border: 1px solid var(--glass-border);
	-webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
}
.glance-chip b { font-family: var(--font-mono); font-weight: 450; font-size: 21px; color: var(--white); }
.glance-chip span { font-size: 12.5px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--mist-300); }
.stage-light .glance-chip, .stage-white .glance-chip { background: rgba(30, 62, 92, 0.05); border-color: rgba(30, 62, 92, 0.12); }
.stage-light .glance-chip b, .stage-white .glance-chip b { color: var(--navy-700); }
.stage-light .glance-chip span, .stage-white .glance-chip span { color: var(--ink-600); }
.two-col-prose { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: clamp(36px, 5vw, 80px); align-items: start; }
.sticky-aside { position: sticky; top: 110px; }
@media (max-width: 860px) { .two-col-prose { grid-template-columns: 1fr; } .sticky-aside { position: static; } }

/* Calculators */
.calc-card label { display: flex; justify-content: space-between; align-items: baseline; font-size: 14px; font-weight: 500; margin: 18px 0 8px; }
.calc-card label output { font-family: var(--font-mono); color: var(--blue-500); }
.calc-card input[type="range"] { width: 100%; accent-color: var(--blue-500); }
.calc-card input[type="number"] {
	width: 100%; padding: 13px 16px; font: inherit; font-size: 15.5px;
	border: 1px solid rgba(13, 27, 42, 0.15); border-radius: var(--radius-sm); background: var(--white); color: var(--ink-900);
}
.calc-result { margin-top: 26px; padding: 22px; border-radius: 14px; background: linear-gradient(135deg, rgba(27,108,242,0.07), rgba(79,143,251,0.04)); border: 1px solid rgba(27,108,242,0.15); }
.calc-result .stat-num { font-size: clamp(30px, 3vw, 44px); }
.calc-note { font-size: 12.5px; color: var(--ink-600); margin-top: 14px; }


/* ---------- WP admin bar ---------- */
body.admin-bar .site-nav { top: 32px; }
@media (max-width: 782px) { body.admin-bar .site-nav { top: 46px; } }
body.admin-bar .mobile-menu { padding-top: 148px; }

/* ---------- Sticky #TUME scroll-telling (no JS pinning) ---------- */
.tume-stage {
	position: sticky; top: 0; min-height: 100svh;
	display: flex; flex-direction: column; justify-content: center;
	overflow: clip; padding: 48px 0;
}
@media (max-width: 860px) {
	.tume-stage { position: static; min-height: 0; padding: 0; }
}


/* ---------- Scroll progress bar ---------- */
.scroll-progress {
	position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 130;
	background: linear-gradient(90deg, var(--blue-500), var(--sky-300), var(--gold-400));
	transform-origin: left; transform: scaleX(0); pointer-events: none;
}
body.admin-bar .scroll-progress { top: 32px; }
@media (max-width: 782px) { body.admin-bar .scroll-progress { top: 46px; } }
@media (prefers-reduced-motion: reduce) { .marquee-track { animation: none; } .hero-photo img { animation: none; } .scroll-progress { display: none; } }

/* Light cards keep ink text even on dark stages */
.stage-dark .light-card, .stage-dark-2 .light-card { color: var(--ink-900); }
.stage-dark .light-card h3, .stage-dark-2 .light-card h3,
.stage-dark .light-card h2, .stage-dark-2 .light-card h2 { color: var(--ink-900); }


/* ============ AURORA MOTION BACKGROUNDS (dark stages) ============ */
.aurora { position: absolute; inset: -18%; pointer-events: none; z-index: -1; opacity: 0.6; filter: blur(58px); }
.aurora::before, .aurora::after, .aurora i { content: ""; position: absolute; border-radius: 50%; display: block; }
.aurora::before {
	left: 4%; top: 8%; width: 52%; height: 56%;
	background: radial-gradient(circle at 35% 35%, rgba(27, 108, 242, 0.34), transparent 65%);
	animation: aurora-a 24s ease-in-out infinite alternate;
}
.aurora::after {
	right: 2%; bottom: 4%; width: 48%; height: 52%;
	background: radial-gradient(circle at 65% 65%, rgba(140, 184, 255, 0.2), transparent 62%);
	animation: aurora-b 31s ease-in-out infinite alternate;
}
.aurora i {
	left: 58%; top: 6%; width: 34%; height: 38%;
	background: radial-gradient(circle, rgba(217, 164, 65, 0.13), transparent 60%);
	animation: aurora-c 38s ease-in-out infinite alternate;
}
@keyframes aurora-a { from { transform: translate(-7%, -5%) scale(1) rotate(0deg); } to { transform: translate(16%, 12%) scale(1.3) rotate(30deg); } }
@keyframes aurora-b { from { transform: translate(8%, 7%) scale(1.2); } to { transform: translate(-14%, -10%) scale(0.9); } }
@keyframes aurora-c { from { transform: translate(0, 0) scale(1); } to { transform: translate(-20%, 20%) scale(1.35); } }

/* Soft glow blobs for light stages */
.glow-blobs { position: absolute; inset: -12%; pointer-events: none; z-index: -1; filter: blur(70px); opacity: 0.75; }
.glow-blobs::before, .glow-blobs::after { content: ""; position: absolute; border-radius: 50%; }
.glow-blobs::before {
	left: -4%; top: 12%; width: 44%; height: 52%;
	background: radial-gradient(circle, rgba(27, 108, 242, 0.07), transparent 62%);
	animation: aurora-b 34s ease-in-out infinite alternate;
}
.glow-blobs::after {
	right: -2%; bottom: 6%; width: 40%; height: 48%;
	background: radial-gradient(circle, rgba(217, 164, 65, 0.06), transparent 60%);
	animation: aurora-a 28s ease-in-out infinite alternate;
}

/* ============ CINEMATIC FILM GRAIN ============ */
.grain {
	position: fixed; inset: -60px; z-index: 135; pointer-events: none; opacity: 0.055;
	mix-blend-mode: overlay;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.7'/%3E%3C/svg%3E");
	background-size: 220px;
	animation: grain-shift 0.9s steps(1, end) infinite;
}
@keyframes grain-shift {
	0% { background-position: 0 0; } 25% { background-position: -70px 45px; }
	50% { background-position: 45px -70px; } 75% { background-position: -45px -45px; } 100% { background-position: 0 0; }
}

/* ============ BUTTON SHINE + CTA PULSE ============ */
.btn-cta { position: relative; overflow: hidden; }
.btn-cta::before {
	content: ""; position: absolute; top: -10%; bottom: -10%; left: -45%; width: 32%;
	background: linear-gradient(105deg, transparent, rgba(255, 255, 255, 0.5), transparent);
	transform: skewX(-22deg); pointer-events: none; transition: left 0.75s var(--ease-out);
}
.btn-cta:hover::before { left: 120%; }
.hero-ctas .btn-cta.btn-lg { animation: cta-breathe 3.4s ease-in-out infinite; }
@keyframes cta-breathe {
	0%, 100% { box-shadow: 0 8px 28px -8px rgba(27, 108, 242, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.25); }
	50% { box-shadow: 0 12px 44px -6px rgba(27, 108, 242, 0.85), 0 0 0 6px rgba(27, 108, 242, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.25); }
}

/* ============ CARD CHOREOGRAPHY ============ */
.light-card:hover {
	box-shadow: var(--shadow-xl), 0 0 0 1px rgba(27, 108, 242, 0.22), 0 32px 90px -28px rgba(27, 108, 242, 0.4);
}
.glass-card:hover {
	border-color: rgba(140, 184, 255, 0.55);
	box-shadow: 0 32px 90px -24px rgba(27, 108, 242, 0.5), inset 0 0 40px rgba(140, 184, 255, 0.04);
}
html.js [data-anim-group].done > .light-card:hover, html.js [data-anim-group].done > .glass-card:hover { transform: translateY(-12px) scale(1.015); }

/* Team photo hover pop */
.team-photo { transition: transform 0.55s var(--ease-out), box-shadow 0.55s var(--ease-out); }
.team-card:hover .team-photo {
	transform: scale(1.07) rotate(2deg);
	box-shadow: 0 0 0 3px var(--gold-400), 0 0 34px rgba(217, 164, 65, 0.35), 0 20px 50px -14px rgba(13, 27, 42, 0.4);
}

/* Stat tick draw-in */
.stat-tick { transform: scaleX(0); transform-origin: left; transition: transform 1.1s var(--ease-out) 0.5s; }
html.js [data-anim-group].in .stat-tick, html.js [data-anim-group].done .stat-tick, html.no-js .stat-tick, html:not(.js) .stat-tick { transform: scaleX(1); }

/* Eyebrow tracking-in */
html.js .eyebrow[data-anim].in { animation: track-in 1s var(--ease-out) both; }
@keyframes track-in { from { letter-spacing: 0.34em; } to { letter-spacing: 0.14em; } }

/* Scroll progress glow */
.scroll-progress { box-shadow: 0 0 14px rgba(79, 143, 251, 0.7), 0 0 4px rgba(217, 164, 65, 0.5); }

/* Marquee perf: contained, GPU-promoted, no per-card backdrop blur */
.marquee { contain: layout paint; transform: translateZ(0); }
.marquee .glass-card {
	-webkit-backdrop-filter: none; backdrop-filter: none;
	background: rgba(16, 35, 60, 0.55);
	transition: border-color 0.4s;
	will-change: auto;
}

/* Cursor glow: bigger, richer */
.cursor-glow {
	width: 640px; height: 640px;
	background: radial-gradient(circle, rgba(79, 143, 251, 0.085) 0%, rgba(217, 164, 65, 0.02) 40%, transparent 65%);
}

/* Curtain sections settle-scale from the bottom edge (JS-driven) */
[data-curtain] { transform-origin: 50% 100%; }

/* Guards */
@media (max-width: 860px) {
	.aurora, .glow-blobs, .grain { display: none; }
	html.js [data-anim] { filter: none; transform: translateY(40px); transition: opacity 0.7s var(--ease-out), transform 0.7s var(--ease-out); }
	html.js [data-anim-group] > * { transform: translateY(40px); }
}
@media (prefers-reduced-motion: reduce) {
	.aurora, .glow-blobs, .grain { display: none; }
	.stage-dark .sky, .stage-dark-2 .sky { animation: none; color: var(--sky-300); background: none; -webkit-background-clip: initial; background-clip: initial; }
	.hero-ctas .btn-cta.btn-lg { animation: none; }
}


/* ============ INSTANT HERO ENTRANCES (pure CSS — no JS dependency) ============ */
@keyframes hero-rise {
	from { opacity: 0; transform: translateY(46px) skewY(1.5deg); filter: blur(6px); }
	to { opacity: 1; transform: none; filter: blur(0); }
}
/* Hero elements are excluded from the JS entrance system; keyframes drive them
   from the moment styles parse. 'both' fill keeps them hidden pre-delay. */
html.js .hero [data-anim], html.js .page-hero [data-anim],
html.js .hero .hero-content > *, html.js .page-hero .wrap > * {
	transition: none;
	animation: hero-rise 0.9s cubic-bezier(0.16, 1, 0.3, 1) both;
}
html.js .hero .hero-content > *:nth-child(1), html.js .page-hero .wrap > *:nth-child(1) { animation-delay: 0.05s; }
html.js .hero .hero-content > *:nth-child(2), html.js .page-hero .wrap > *:nth-child(2) { animation-delay: 0.16s; }
html.js .hero .hero-content > *:nth-child(3), html.js .page-hero .wrap > *:nth-child(3) { animation-delay: 0.28s; }
html.js .hero .hero-content > *:nth-child(4), html.js .page-hero .wrap > *:nth-child(4) { animation-delay: 0.4s; }
html.js .hero .hero-content > *:nth-child(5), html.js .page-hero .wrap > *:nth-child(5) { animation-delay: 0.52s; }
html.js .hero .hero-content > *:nth-child(6), html.js .page-hero .wrap > *:nth-child(6) { animation-delay: 0.62s; }
html.js .hero .hero-float { transition: none; animation: hero-rise 1s cubic-bezier(0.16, 1, 0.3, 1) 0.55s both; }
/* Glance chips inside page heroes: staggered the same way */
html.js .page-hero [data-anim-group] > * { transition: none; animation: hero-rise 0.8s cubic-bezier(0.16, 1, 0.3, 1) both; }
html.js .page-hero [data-anim-group] > *:nth-child(1) { animation-delay: 0.5s; }
html.js .page-hero [data-anim-group] > *:nth-child(2) { animation-delay: 0.58s; }
html.js .page-hero [data-anim-group] > *:nth-child(3) { animation-delay: 0.66s; }
html.js .page-hero [data-anim-group] > *:nth-child(4) { animation-delay: 0.74s; }
/* The hero h1 keeps its glyph headroom without SplitText */
.hero h1, .page-hero h1 { overflow: visible; }
/* Hero scroll parallax (JS) sets inline transform/opacity on .hero-content AFTER
   the entrance completes; the animation fill would fight it, so JS removes the
   animation once done (see hero-parallax module). */
@media (prefers-reduced-motion: reduce) {
	html.js .hero [data-anim], html.js .page-hero [data-anim],
	html.js .hero .hero-content > *, html.js .page-hero .wrap > *,
	html.js .hero .hero-float, html.js .page-hero [data-anim-group] > * { animation: none; opacity: 1; transform: none; filter: none; }
}


/* ============ Page-hero / section background images (parallax layer) ============ */
.stage-dark, .stage-dark-2, .stage-light, .stage-white, .page-hero { isolation: isolate; }
.ph-bg { position: absolute; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
.ph-bg img { width: 100%; height: 100%; object-fit: cover; opacity: 0.85; }
.ph-bg::after {
	content: ""; position: absolute; inset: 0;
	background:
		linear-gradient(90deg, rgba(6, 13, 23, 0.58) 0%, rgba(6, 13, 23, 0.26) 45%, rgba(6, 13, 23, 0) 70%),
		linear-gradient(180deg, rgba(6, 13, 23, 0.2) 0%, rgba(6, 13, 23, 0.04) 50%, rgba(6, 13, 23, 0.66) 88%, var(--navy-950) 98%);
}
.ph-bg.band-bg img { opacity: 0.6; }
@media (max-width: 860px) { .ph-bg { inset: 0; } }

/* Ambient layers (mesh/beam/aurora) must never widen the layout viewport */
section, .site-footer { overflow-x: clip; }
body { max-width: 100vw; }
/* Third-party widgets injected at body level must never widen the viewport */
body > *:not(script):not(style):not(.grain) { max-width: 100vw; }

/* ============ Mobile menu: scrollable overlay + accordion groups ============ */
.mobile-menu { height: 100dvh; overflow-y: auto; padding: 96px 32px 48px; overscroll-behavior: contain; }
.mobile-menu nav > a, .mm-drop summary {
	color: var(--white); text-decoration: none; font-family: var(--font-display);
	font-size: 25px; padding: 12px 0; border-bottom: 1px solid rgba(140, 184, 255, 0.08);
	display: flex; align-items: center; justify-content: space-between;
}
.mm-drop summary { list-style: none; cursor: pointer; opacity: 0; transform: translateY(16px); }
.mm-drop summary::-webkit-details-marker { display: none; }
.mm-drop summary::after {
	content: "+"; font-family: var(--font-mono); font-size: 22px; color: var(--sky-300);
	transition: transform 0.3s var(--ease-out);
}
.mm-drop[open] summary::after { transform: rotate(45deg); }
.mm-sub { display: flex; flex-direction: column; padding: 4px 0 10px 16px; border-bottom: 1px solid rgba(140, 184, 255, 0.08); }
.mobile-menu .mm-sub a {
	font-family: var(--font-ui); font-size: 17px; font-weight: 500; color: var(--mist-300);
	padding: 9px 0; border-bottom: 0;
}
.mobile-menu .mm-sub a:active { color: var(--white); }
.mobile-menu-cta { margin-top: 26px; padding-bottom: env(safe-area-inset-bottom); }

/* ============ Calculator suite ============ */
.calc-tabs { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; margin-bottom: 36px; }
.calc-tab {
	font: 650 14.5px/1 var(--font-ui); color: var(--navy-700);
	padding: 12px 20px; border-radius: 999px; cursor: pointer;
	background: rgba(30, 62, 92, 0.05); border: 1px solid rgba(30, 62, 92, 0.16);
	transition: background 0.25s, color 0.25s, border-color 0.25s, transform 0.3s var(--ease-out);
}
.calc-tab:hover { background: rgba(27, 108, 242, 0.09); transform: translateY(-2px); }
.calc-tab.active {
	background: linear-gradient(135deg, var(--blue-500), var(--blue-400)); color: var(--white);
	border-color: transparent; box-shadow: 0 8px 22px -8px rgba(27, 108, 242, 0.55);
}
.calc-suite { max-width: 880px; margin-inline: auto; }
.calc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 34px; margin-top: 8px; }
.calc-suite select {
	width: 100%; padding: 12px 14px; font: inherit; font-size: 15px;
	border: 1px solid rgba(13, 27, 42, 0.15); border-radius: var(--radius-sm); background: var(--white); color: var(--ink-900);
}
#calc-results { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 26px; }
#calc-results .calc-result { margin-top: 0; }
@media (max-width: 700px) {
	.calc-grid, #calc-results { grid-template-columns: 1fr; }
	.calc-tabs { justify-content: flex-start; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 8px; margin-inline: -20px; padding-inline: 20px; }
	.calc-tab { white-space: nowrap; flex-shrink: 0; }
}


/* ============ Ghost typography (scroll-drifting outlined words) ============ */
.ghost-word {
	opacity: 0; transition: opacity 1.2s ease 0.15s;
	position: absolute; z-index: 0; pointer-events: none; user-select: none;
	font-family: var(--font-display); font-weight: 620; white-space: nowrap;
	/* Sized and inset so the whole word stays inside the section: a word running off the viewport edge reads as a bug, not a bleed (Taylor, 2026-09-04).
	   2026-09-09: Playfair's glyph area is 1.33em tall, so at line-height 1 the letters overhung the box by ~0.17em on each side and the next
	   section's background sliced them at the boundary (Taylor's "cut off" screenshot). The line box now contains the glyphs, the word no longer
	   clips itself, insets have a pixel floor, and tume.js clamps the scroll drift to the room left inside the section. */
	font-size: clamp(110px, 13vw, 230px); line-height: 1.36;
	color: transparent; -webkit-text-stroke: 1px rgba(140, 184, 255, 0.1);
	top: max(4%, 20px); left: max(3%, 20px); max-width: 94%;
}
.stage-light .ghost-word, .stage-white .ghost-word { -webkit-text-stroke: 1px rgba(30, 62, 92, 0.08); }
html.fonts-in .ghost-word { opacity: 1; }
.ghost-word.gw-right { left: auto; right: max(3%, 20px); }
.ghost-word.gw-bottom { top: auto; bottom: max(3%, 20px); }
@media (max-width: 860px) { .ghost-word { display: none; } }

/* ============ Rate report: gauge + tiles ============ */
.gauge-wrap { display: grid; place-items: center; position: relative; }
.gauge-svg { width: min(340px, 78vw); height: auto; }
.gauge-track { fill: none; stroke: rgba(140, 184, 255, 0.14); stroke-width: 12; stroke-linecap: round; }
.gauge-arc { fill: none; stroke: url(#gaugeGrad); stroke-width: 12; stroke-linecap: round; }
.gauge-center { position: absolute; text-align: center; top: 52%; }
.gauge-center .stat-num { font-size: clamp(52px, 6vw, 78px); }
.gauge-label {
	display: inline-block; margin-top: 8px; padding: 7px 18px; border-radius: 999px;
	font: 450 12.5px var(--font-mono); letter-spacing: 0.14em;
	color: var(--gold-300); border: 1px solid rgba(217, 164, 65, 0.4);
}
.rate-tiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.rate-tile { text-align: center; padding: 26px 14px; }
.rate-tile .rt-label { font: 450 11.5px var(--font-mono); letter-spacing: 0.12em; color: var(--mist-300); text-transform: uppercase; }
.rate-tile .stat-num { font-size: clamp(30px, 3.4vw, 46px); display: block; margin-top: 10px; }
.rate-tile .rt-delta { font-size: 12.5px; margin-top: 8px; color: var(--mist-300); }
.rt-up { color: #f0a3a3; } .rt-down { color: #7dd8a0; }
.dash-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
@media (max-width: 860px) { .rate-tiles { grid-template-columns: 1fr 1fr; } .dash-tiles { grid-template-columns: 1fr 1fr; } }

/* ============ Footer app badges + legal ============ */
.app-badges { display: flex; gap: 10px; margin-top: 12px; }
.app-badges img { height: 40px; width: auto; border-radius: 7px; }
.footer-legal { align-items: flex-start; }
.footer-legal > div { display: flex; flex-direction: column; gap: 10px; }
.footer-legal-links a { color: var(--sky-300) !important; }

/* ============ Review platform cards ============ */
.platform-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.platform-card { display: flex; flex-direction: column; align-items: center; gap: 14px; text-decoration: none; text-align: center; padding: 30px 20px; }
.platform-card img { height: 44px; width: auto; }
.platform-card .review-stars { margin: 0; }
.platform-card span { font-size: 13.5px; color: var(--ink-600); }
@media (max-width: 860px) { .platform-row { grid-template-columns: 1fr 1fr; } }

/* ============================================================
   Cinematic pass 2 — scroll-scrub systems
   ============================================================ */

/* Word illumination: passages brighten word by word as you scroll.
   .ws-w spans exist only after JS splits the text, so no-JS and
   reduced-motion users always see the full-opacity original. */
[data-words] .ws-w { opacity: 0.13; transition: opacity 0.5s var(--ease-out); }
.stage-light [data-words] .ws-w, .stage-white [data-words] .ws-w { opacity: 0.16; }
[data-words] .ws-w.lit { opacity: 1; }

/* Statement bands */
.statement .statement-text {
	font-family: var(--font-display);
	font-weight: 590;
	font-size: clamp(30px, 4.3vw, 58px);
	line-height: 1.2;
	letter-spacing: -0.015em;
	color: var(--white);
	max-width: 1040px;
	margin: 18px 0 0;
}
.stage-light .statement-text, .stage-white .statement-text { color: var(--ink-900); }
.statement .statement-foot { margin-top: 40px; display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }

/* Zoom portal: framed image that opens to full bleed as it enters */
.portal { padding-block: clamp(30px, 6vh, 80px); overflow: clip; background: var(--navy-950); }
.portal-frame {
	position: relative; overflow: hidden; width: 100%;
	border-radius: 36px;
	transform: scale(0.78);
	will-change: transform;
}
.portal-frame img {
	display: block; width: 100%; height: min(76vh, 700px);
	object-fit: cover; transform: scale(1.18); will-change: transform;
}
.portal-frame::after {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background: linear-gradient(to top, rgba(6, 13, 23, 0.72), rgba(6, 13, 23, 0) 55%);
}
.portal-cap { position: absolute; left: clamp(22px, 5vw, 64px); bottom: clamp(22px, 5vh, 52px); z-index: 2; max-width: 640px; }
.portal-cap .eyebrow { color: var(--gold-300); }
.portal-line {
	font-family: var(--font-display); font-weight: 590;
	font-size: clamp(24px, 3.1vw, 44px); line-height: 1.14; letter-spacing: -0.015em;
	color: var(--white); margin: 8px 0 0;
}
@media (max-width: 860px) {
	.portal { padding-block: 26px; }
	.portal-frame { transform: none; border-radius: 18px; margin-inline: 14px; width: auto; }
	.portal-frame img { height: 46vh; transform: scale(1.06); }
}

/* Journey timeline: gold line draws down the page; nodes ignite as it passes */
.timeline { position: relative; max-width: 1020px; margin: 56px auto 0; }
.tl-line {
	position: absolute; left: 50%; top: 8px; bottom: 8px; width: 2px;
	transform: translateX(-50%); background: rgba(140, 184, 255, 0.13); border-radius: 2px;
}
.tl-fill {
	position: absolute; inset: 0; display: block; border-radius: 2px;
	background: linear-gradient(180deg, var(--gold-300), var(--gold-400) 40%, var(--blue-500));
	transform: scaleY(0); transform-origin: 50% 0; will-change: transform;
	box-shadow: 0 0 16px rgba(217, 164, 65, 0.35);
}
.tl-item { position: relative; width: calc(50% - 52px); margin-bottom: 40px; }
.tl-item:last-child { margin-bottom: 0; }
.tl-item.tl-right { margin-left: auto; }
.tl-dot {
	position: absolute; top: 30px; width: 15px; height: 15px; border-radius: 50%;
	background: var(--navy-800); border: 2px solid rgba(140, 184, 255, 0.35);
	transition: background 0.5s var(--ease-out), border-color 0.5s var(--ease-out), box-shadow 0.5s var(--ease-out);
	z-index: 2;
}
.tl-item.tl-left .tl-dot { right: -60px; }
.tl-item.tl-right .tl-dot { left: -60px; }
.tl-item.lit .tl-dot { background: var(--gold-400); border-color: var(--gold-300); box-shadow: 0 0 22px rgba(217, 164, 65, 0.7); }
.tl-item .glass-card { transition: border-color 0.6s var(--ease-out); }
.tl-item.lit .glass-card { border-color: rgba(217, 164, 65, 0.35); }
@media (max-width: 860px) {
	.tl-line { left: 10px; transform: none; }
	.tl-item, .tl-item.tl-right { width: auto; margin-left: 34px; }
	.tl-item.tl-left .tl-dot, .tl-item.tl-right .tl-dot { left: -31px; right: auto; }
}

/* Tilt entrance: rises and straightens out of perspective */
html.js [data-anim="tilt"] { transform: perspective(900px) rotateX(13deg) translateY(48px); transform-origin: 50% 0; }

/* ============================================================
   v1.7.0 client build: mixed light/dark rhythm via photo-overlay
   sections, static (non-jacking) steps, digital HELOC pop-up,
   site-wide lead form.
   ============================================================ */

/* Photo-overlay section: a background image under a heavy dark wash so the
   page never runs one flat color top to bottom, with copy set in boxes. */
.has-photo { overflow: clip; }
.ph-bg.deep img { opacity: 0.6; }
.ph-bg.deep::after {
	background: linear-gradient(180deg, rgba(6, 13, 23, 0.84) 0%, rgba(6, 13, 23, 0.78) 50%, rgba(6, 13, 23, 0.9) 100%);
}
/* Solid faux-glass: a live backdrop blur over a full-bleed photo repaints on every scroll frame */
.photo-box {
	background: rgba(10, 22, 38, 0.82); border: 1px solid var(--glass-border);
	border-radius: var(--radius); padding: clamp(26px, 4vw, 48px);
}

/* Static steps: always in normal flow and always visible. Scrolling only
   lights the step in view and its progress dot; the page never stops. */
.tume-steps.steps-static { display: grid; gap: clamp(18px, 2.6vw, 30px); max-width: 960px; margin-inline: auto; }
.steps-static .tume-step {
	grid-template-columns: minmax(84px, 0.3fr) 1fr; gap: clamp(20px, 3.5vw, 46px); align-items: start;
	padding: clamp(24px, 3vw, 38px);
	border: 1px solid rgba(140, 184, 255, 0.12); border-radius: var(--radius);
	background: rgba(16, 35, 60, 0.3);
	transition: border-color 0.6s var(--ease-out), background 0.6s var(--ease-out);
}
.steps-static .step-num { font-size: clamp(56px, 7vw, 88px); line-height: 0.85; -webkit-text-stroke: 1.5px rgba(140, 184, 255, 0.3); }
.steps-static .tume-step.step-lit { border-color: rgba(217, 164, 65, 0.42); background: rgba(16, 35, 60, 0.5); }
.steps-static .tume-step.step-lit .step-num { -webkit-text-stroke-color: var(--gold-400); color: rgba(217, 164, 65, 0.1); }
.steps-static .tume-step h3 { margin-top: 2px; }
.steps-static .tume-step .lede { font-size: clamp(16.5px, 1.3vw, 18.5px); }
@media (max-width: 640px) {
	.steps-static .tume-step { grid-template-columns: 1fr; gap: 10px; }
	.steps-static .step-num { font-size: 50px; }
}

/* Digital HELOC pop-up (Figure fast path; the HELOC page itself is traditional only) */
.tw-modal[hidden] { display: none !important; }
.tw-modal { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 20px; }
.tw-modal-backdrop { position: absolute; inset: 0; background: rgba(6, 13, 23, 0.76); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.tw-modal-panel {
	position: relative; z-index: 1; width: min(580px, 100%); max-height: 90vh; overflow: auto;
	background: var(--navy-900); border: 1px solid var(--glass-border); border-radius: var(--radius);
	padding: clamp(28px, 4vw, 46px); color: var(--text-on-dark); box-shadow: var(--shadow-xl);
	animation: tw-modal-in 0.4s var(--ease-out);
}
@keyframes tw-modal-in { from { opacity: 0; transform: translateY(18px) scale(0.98); } to { opacity: 1; transform: none; } }
.tw-modal-panel h3 { color: var(--white); font-size: clamp(24px, 2.6vw, 32px); }
.tw-modal-panel p { color: var(--mist-300); }
.tw-modal-close {
	position: absolute; top: 12px; right: 12px; width: 40px; height: 40px; border-radius: 50%;
	display: flex; align-items: center; justify-content: center; cursor: pointer;
	background: rgba(255, 255, 255, 0.06); border: 1px solid var(--glass-border); color: var(--text-on-dark);
	font-size: 22px; line-height: 1; transition: background 0.25s; font-family: var(--font-ui);
}
.tw-modal-close:hover { background: rgba(255, 255, 255, 0.14); }
.tw-badge { display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--gold-400); margin-bottom: 14px; }
.tw-note-warn {
	margin: 20px 0 24px; padding: 14px 16px; font-size: 13.5px; line-height: 1.55; color: var(--mist-300);
	background: rgba(217, 164, 65, 0.07); border: 1px solid rgba(217, 164, 65, 0.28);
	border-left: 3px solid var(--gold-400); border-radius: 10px;
}
.tw-note-warn strong { color: var(--gold-300); }
.tw-modal-alt { margin: 20px 0 0; font-size: 14.5px; }
.tw-modal-alt a { color: var(--sky-300); font-weight: 600; text-decoration: none; }
.tw-modal-alt a:hover { text-decoration: underline; }

/* Site-wide lead form: the soft ask */
.lead-form { display: grid; gap: 14px; }
.lead-form .row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.lead-form label { display: block; }
.lead-form .lf-label { font-family: var(--font-mono); font-size: 11.5px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--sky-300); margin-bottom: 7px; display: block; }
.lead-form input, .lead-form select, .lead-form textarea {
	width: 100%; font-family: var(--font-ui); font-size: 16px; color: var(--white);
	background: rgba(255, 255, 255, 0.05); border: 1px solid var(--glass-border);
	border-radius: 12px; padding: 14px 16px; transition: border-color 0.25s, background 0.25s;
}
.lead-form select { appearance: none; -webkit-appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--sky-300) 50%), linear-gradient(135deg, var(--sky-300) 50%, transparent 50%); background-position: calc(100% - 20px) 50%, calc(100% - 15px) 50%; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 40px; }
.lead-form select option { color: var(--ink-900); }
.lead-form textarea { min-height: 96px; resize: vertical; }
.lead-form input::placeholder, .lead-form textarea::placeholder { color: var(--mist-300); opacity: 0.55; }
.lead-form input:focus, .lead-form select:focus, .lead-form textarea:focus { outline: none; border-color: var(--blue-400); background: rgba(255, 255, 255, 0.08); }
.lead-form .lf-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.lead-form .lf-actions { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-top: 4px; }
.lf-status { font-size: 14px; min-height: 1.2em; margin: 0; }
.lf-status.ok { color: var(--gold-300); }
.lf-status.err { color: #ff9b8f; }
@media (max-width: 560px) { .lead-form .row-2 { grid-template-columns: 1fr; } }

@media (prefers-reduced-motion: reduce) {
	.tw-modal-panel { animation: none; }
	.steps-static .tume-step { transition: none; }
}

/* ---------- Phase 2: program comparison table, prose over photo, white steps, HomeBot, calculator embeds ---------- */
.compare-table { width: 100%; border-collapse: collapse; font-size: 14.5px; min-width: 760px; }
.compare-table th { text-align: left; font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--sky-300); padding: 16px 18px; border-bottom: 1px solid var(--glass-border); }
.compare-table td { padding: 13px 18px; border-bottom: 1px solid rgba(140, 184, 255, 0.1); color: var(--mist-300); vertical-align: top; }
.compare-table td:first-child { color: var(--white); font-weight: 600; }
.compare-table tr:last-child td { border-bottom: 0; }
.has-photo .prose.photo-box { color: var(--text-on-dark); }
.has-photo .prose.photo-box h2 { color: var(--white); }
.has-photo .prose.photo-box strong { color: var(--white); }
.has-photo .prose.photo-box a { color: var(--sky-300); }
.steps-static .tume-step.light-card { background: var(--white); color: var(--ink-900); border-color: transparent; box-shadow: var(--shadow-md); }
.steps-static .tume-step.light-card h3 { color: var(--ink-900); }
.steps-static .tume-step.light-card p { color: var(--ink-600); margin: 0; }
.steps-static .tume-step.light-card.step-lit { border-color: rgba(217, 164, 65, 0.6); background: var(--white); }
.hb-widget { background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(140, 184, 255, 0.16); border-radius: var(--radius); padding: 28px 24px 20px; overflow: visible; }
.stage-light .hb-widget, .stage-white .hb-widget { background: var(--white); border: 0; box-shadow: var(--shadow-md); } /* default HomeBot theme on light sections */
#equity-options .light-card { display: flex; flex-direction: column; }
#equity-options .light-card .btn { margin-top: auto; align-self: flex-start; } /* HomeBot runs its dark-mode-theme here so the card can sit inside the dark section instead of a white slab (Taylor: "the seam is obvious") */ /* HomeBot renders ~150px tall in shadow DOM; overflow stays visible so its autocomplete list is not clipped */
.section #twc-root { margin-top: 8px; }
.section-head + #twc-root { margin-top: 0; }

/* ---------- Perf pass v1.8.1 ---------- */
/* Ambient mesh/beam layers are continuously transformed while on screen: keep them on their own compositor layers */
.hero-mesh, .footer-mesh, .hero-beam { will-change: transform; }
/* Equal Housing mark reads as white on the dark footer */
.footer-legal > img { filter: brightness(0) invert(1); opacity: 0.85; }

/* ---------- Single point of conversion: the hero capture form (v1.9.0) ---------- */
.lead-form .row-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 12px; }
.page-hero .capture-form { max-width: 760px; margin-top: 30px; }
.capture-form .lf-actions { margin-top: 2px; }
.capture-form .lf-actions .nav-phone { color: var(--text-on-dark); }
.capture-form .lf-actions .nav-phone:hover { color: var(--white); }
@media (max-width: 720px) {
	.lead-form .row-3 { grid-template-columns: 1fr; }
	.capture-form .lf-actions .btn { width: 100%; }
}

/* ---- Trustindex review grid on dark sections. The widget's own rules use three attribute selectors plus
   !important, so these selectors match that specificity. Zillow reviews repeat their title as the first words
   of the body (<strong>Title</strong>Title ...), so the title is hidden. */
.ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid],
.ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] * { font-family: inherit !important; }
/* The widget's JS sets each item's width, so the gutter lives as padding on the item and the visible card is the inner box. */
.stage-dark .ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] .ti-review-item,
.stage-dark-2 .ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] .ti-review-item {
	background: transparent !important; border: 0 !important; box-shadow: none !important;
	padding: 0 14px 28px !important; margin: 0 !important;
}
.stage-dark .ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] .ti-review-item > .ti-inner,
.stage-dark-2 .ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] .ti-review-item > .ti-inner {
	background: rgba(255, 255, 255, 0.05) !important; border: 1px solid rgba(140, 184, 255, 0.16) !important;
	border-bottom-width: 1px !important; border-radius: var(--radius) !important; padding: 26px !important;
}
.stage-dark .ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] .ti-name,
.stage-dark .ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] .ti-review-content,
.stage-dark .ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] .ti-review-text-container,
.stage-dark-2 .ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] .ti-name,
.stage-dark-2 .ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] .ti-review-content,
.stage-dark-2 .ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] .ti-review-text-container { color: var(--white) !important; }
.stage-dark .ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] .ti-name,
.stage-dark-2 .ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] .ti-name { font-family: var(--font-display) !important; font-size: 19px !important; font-weight: 590 !important; }
.stage-dark .ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] .ti-review-content .ti-inner,
.stage-dark-2 .ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] .ti-review-content .ti-inner { font-size: 15.5px !important; line-height: 1.6 !important; max-height: 99px !important; }
.stage-dark .ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] .ti-date,
.stage-dark-2 .ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] .ti-date { color: var(--mist-300) !important; }
.stage-dark .ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] .ti-read-more,
.stage-dark .ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] .ti-read-more span,
.stage-dark .ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] .ti-load-more-reviews-button,
.stage-dark-2 .ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] .ti-read-more,
.stage-dark-2 .ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] .ti-read-more span,
.stage-dark-2 .ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] .ti-load-more-reviews-button { color: var(--sky-300) !important; border-color: var(--sky-300) !important; opacity: 1 !important; font-size: 14px !important; }
.ti-widget-wrap .ti-widget[data-layout-id][data-set-id][data-pid] .ti-review-text-container > strong:first-child { display: none !important; }