/* ==========================================================================
   GRADE SYNC PRO — Home v3 (2026-05-29)
   Futuristic, hi-tech, cinematic marketing page rebuild
   ========================================================================== */

:root{
	--c-bg-0:#03060f;
	--c-bg-1:#070d1d;
	--c-bg-2:#0d1530;
	--c-cyan:#38bdf8;
	--c-violet:#8b5cf6;
	--c-magenta:#f472b6;
	--c-emerald:#34d399;
	--c-amber:#fbbf24;
	--c-rose:#fb7185;
	--c-text:#e6efff;
	--c-text-muted:rgba(186,230,253,.62);
	--c-text-dim:rgba(186,230,253,.42);
	--c-border:rgba(125,211,252,.18);
	--c-border-strong:rgba(125,211,252,.32);
	--ease-out:cubic-bezier(.16,.84,.36,1);
	--ease-in-out:cubic-bezier(.6,.04,.22,1);
}

/* ----- Page shell ---------------------------------------------------- */
html, body { background:var(--c-bg-0); }
body.home-page{
	font-family:'Inter','Open Sans',sans-serif;
	color:var(--c-text); margin:0;
	background:
		radial-gradient(1400px 900px at 5% -10%, rgba(56,189,248,.18), transparent 65%),
		radial-gradient(1200px 800px at 110% 5%, rgba(139,92,246,.18), transparent 60%),
		radial-gradient(1000px 700px at 50% 105%, rgba(244,114,182,.10), transparent 60%),
		var(--c-bg-0);
	min-height:100vh;
	overflow-x:hidden;
}

/* Animated grid backdrop — like a hologrid */
body.home-page::before{
	content:""; position:fixed; inset:-50px; z-index:0; pointer-events:none;
	background:
		linear-gradient(rgba(56,189,248,.04) 1px, transparent 1px),
		linear-gradient(90deg, rgba(56,189,248,.04) 1px, transparent 1px);
	background-size:64px 64px;
	mask-image:radial-gradient(ellipse at center, #000 0%, transparent 75%);
	-webkit-mask-image:radial-gradient(ellipse at center, #000 0%, transparent 75%);
}

/* Floating orbs in background */
body.home-page::after{
	content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
	background:
		radial-gradient(circle at 15% 30%, rgba(56,189,248,.12), transparent 30%),
		radial-gradient(circle at 85% 60%, rgba(139,92,246,.12), transparent 30%),
		radial-gradient(circle at 50% 80%, rgba(244,114,182,.08), transparent 35%);
	animation:hv3-orbs 18s ease-in-out infinite alternate;
}
@keyframes hv3-orbs{
	0%{ transform:translate(0,0) scale(1); }
	100%{ transform:translate(20px,-30px) scale(1.06); }
}
@media (prefers-reduced-motion: reduce){ body.home-page::after{ animation:none; } }

body.home-page > *{ position:relative; z-index:1; }

/* ----- Floating nav -------------------------------------------------- */
body.home-page .navbar.navbar-custom{
	position:fixed; top:0; left:0; right:0; z-index:50;
	background:transparent !important;
	border-bottom:0 !important;
	padding:1rem 0;
	transition:all .3s var(--ease-out);
}
body.home-page .navbar.navbar-custom.is-scrolled{
	background:rgba(7,12,24,.78) !important;
	border-bottom:1px solid var(--c-border) !important;
	backdrop-filter:blur(20px) saturate(180%);
	-webkit-backdrop-filter:blur(20px) saturate(180%);
	padding:.55rem 0;
	box-shadow:0 14px 32px -20px rgba(2,6,23,.8);
}
body.home-page .navbar.navbar-custom > .container{
	max-width:1480px; padding:0 clamp(1rem, 2vw, 2.5rem);
}
body.home-page .navbar-brand{
	display:inline-flex; align-items:center; gap:.7rem;
	color:#fff !important; text-decoration:none;
	font-family:'Roboto Slab','Roboto',Georgia,serif;
}
body.home-page .navbar-brand img{ height:30px; width:auto; }
body.home-page .navbar-brand span{
	background:linear-gradient(110deg,#e0f2fe 0%,#93c5fd 30%,#c4b5fd 60%,#f0abfc 100%);
	background-clip:text; -webkit-background-clip:text; color:transparent;
	font-weight:700; letter-spacing:-.01em;
}
body.home-page .navbar-nav .nav-link{
	color:rgba(186,230,253,.78) !important;
	font-size:.86rem; font-weight:500; letter-spacing:.02em;
	padding:.55rem 1rem !important; border-radius:999px;
	transition:all .2s ease;
	position:relative;
}
body.home-page .navbar-nav .nav-link::after{
	content:""; position:absolute; left:50%; bottom:.35rem;
	width:0; height:2px; background:linear-gradient(90deg,var(--c-cyan),var(--c-violet));
	transform:translateX(-50%); transition:width .25s ease;
}
body.home-page .navbar-nav .nav-link:hover{ color:#fff !important; }
body.home-page .navbar-nav .nav-link:hover::after{ width:60%; }
body.home-page .btn-login{
	background:transparent !important;
	border:1px solid rgba(125,211,252,.4) !important;
	color:#cfe9ff !important;
	border-radius:999px !important;
	padding:.5rem 1.2rem !important;
	font-size:.84rem !important; font-weight:600 !important;
	transition:all .2s ease;
}
body.home-page .btn-login:hover{
	background:linear-gradient(135deg,rgba(56,189,248,.2),rgba(139,92,246,.2)) !important;
	border-color:rgba(125,211,252,.7) !important;
	color:#fff !important;
	transform:translateY(-1px);
}

/* ----- Hero ---------------------------------------------------------- */
.hv3-hero{
	position:relative; padding:clamp(8rem,12vw,11rem) 0 clamp(4rem,6vw,7rem);
	overflow:hidden; isolation:isolate;
}
.hv3-hero__aurora{
	position:absolute; inset:-30%; z-index:-1; pointer-events:none;
	background:conic-gradient(
		from 200deg at 50% 50%,
		transparent 0deg,
		rgba(56,189,248,.22) 60deg,
		rgba(139,92,246,.22) 160deg,
		rgba(244,114,182,.18) 240deg,
		rgba(251,191,36,.14) 320deg,
		transparent 360deg
	);
	filter:blur(80px); animation:hv3-aurora 30s linear infinite;
}
@keyframes hv3-aurora{ to { transform:rotate(360deg); } }
@media (prefers-reduced-motion: reduce){ .hv3-hero__aurora{ animation:none; } }

.hv3-hero__container{
	width:100%; max-width:1480px; margin:0 auto;
	padding:0 clamp(1rem,2vw,2.5rem);
	display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
	gap:clamp(2rem,4vw,5rem); align-items:center;
}
@media (max-width:1080px){ .hv3-hero__container{ grid-template-columns:1fr; } }

.hv3-hero__eyebrow{
	display:inline-flex; align-items:center; gap:.55rem;
	padding:.45rem 1rem .45rem .55rem; border-radius:999px;
	background:linear-gradient(120deg,rgba(56,189,248,.16),rgba(139,92,246,.16));
	border:1px solid rgba(125,211,252,.32);
	font-size:.7rem; font-weight:700; letter-spacing:.22em; text-transform:uppercase;
	color:#cfe9ff; margin-bottom:1.2rem;
}
.hv3-hero__eyebrow-dot{
	width:8px; height:8px; border-radius:50%;
	background:linear-gradient(135deg,var(--c-cyan),var(--c-violet));
	box-shadow:0 0 14px rgba(56,189,248,.85);
	animation:hv3-dot 2.4s ease-in-out infinite;
}
@keyframes hv3-dot{ 0%,100%{transform:scale(1);opacity:1;}50%{transform:scale(1.4);opacity:.6;} }
@media (prefers-reduced-motion: reduce){ .hv3-hero__eyebrow-dot{ animation:none; } }

.hv3-hero__title{
	margin:0 0 1.2rem; font-family:'Roboto Slab','Roboto',Georgia,serif;
	font-size:clamp(2.6rem, 4.5vw + 0.5rem, 5.4rem); font-weight:800;
	letter-spacing:-.025em; line-height:1.02;
	background:linear-gradient(110deg,#e0f2fe 0%,#93c5fd 25%,#c4b5fd 50%,#f0abfc 75%,#fde68a 100%);
	background-clip:text; -webkit-background-clip:text; color:transparent;
	background-size:220% 100%; animation:hv3-title 16s ease-in-out infinite;
}
@keyframes hv3-title{
	0%,100%{ background-position:0% 50%; }
	50%{ background-position:100% 50%; }
}
@media (prefers-reduced-motion: reduce){ .hv3-hero__title{ animation:none; } }
.hv3-hero__title em{
	font-style:normal; position:relative; display:inline-block;
	color:transparent;
	background:linear-gradient(110deg,var(--c-cyan),var(--c-violet),var(--c-magenta));
	background-clip:text; -webkit-background-clip:text;
}
.hv3-hero__title em::after{
	content:""; position:absolute; left:0; right:0; bottom:-.08em;
	height:.18em; border-radius:.18em;
	background:linear-gradient(90deg,var(--c-cyan),var(--c-violet),var(--c-magenta));
	opacity:.35;
}

.hv3-hero__lead{
	margin:0 0 .85rem; max-width:64ch;
	font-size:clamp(1.05rem,.6vw + 1rem,1.28rem); line-height:1.55;
	color:rgba(214,226,247,.85);
}
.hv3-hero__sub{
	margin:0 0 2rem; max-width:60ch;
	font-size:1rem; color:rgba(186,230,253,.6);
}

.hv3-hero__cta{
	display:flex; gap:.8rem; flex-wrap:wrap; margin-bottom:2.2rem;
}
.hv3-btn{
	display:inline-flex; align-items:center; gap:.5rem;
	padding:1rem 1.8rem; border-radius:999px; font-weight:700;
	font-size:.95rem; letter-spacing:.01em;
	text-decoration:none; cursor:pointer;
	transition:all .25s var(--ease-out); position:relative; isolation:isolate;
	border:0;
}
.hv3-btn .material-icons-round{ font-size:20px; transition:transform .25s ease; }
.hv3-btn--primary{
	background:linear-gradient(135deg,var(--c-cyan),var(--c-violet));
	color:#fff;
	box-shadow:0 18px 36px -16px rgba(56,189,248,.65),inset 0 1px 0 rgba(255,255,255,.18);
}
.hv3-btn--primary::before{
	content:""; position:absolute; inset:0; border-radius:inherit; z-index:-1;
	background:linear-gradient(135deg,var(--c-magenta),var(--c-cyan));
	opacity:0; transition:opacity .3s ease;
}
.hv3-btn--primary:hover{
	transform:translateY(-3px);
	box-shadow:0 24px 48px -18px rgba(139,92,246,.7);
	color:#fff;
}
.hv3-btn--primary:hover::before{ opacity:1; }
.hv3-btn--primary:hover .material-icons-round{ transform:translateX(3px); }
.hv3-btn--ghost{
	background:rgba(7,12,24,.5);
	border:1px solid rgba(125,211,252,.32);
	color:#cfe9ff;
	backdrop-filter:blur(10px);
	-webkit-backdrop-filter:blur(10px);
}
.hv3-btn--ghost:hover{
	background:rgba(56,189,248,.16);
	border-color:rgba(125,211,252,.6);
	color:#fff; transform:translateY(-2px);
}

/* Hero metrics */
.hv3-hero__metrics{
	display:grid; grid-template-columns:repeat(4,1fr); gap:1rem;
	padding-top:2rem; border-top:1px dashed rgba(125,211,252,.18);
	max-width:680px;
}
@media (max-width:680px){ .hv3-hero__metrics{ grid-template-columns:repeat(2,1fr); } }
.hv3-metric{ position:relative; }
.hv3-metric__value{
	font-family:'Roboto Slab','Roboto',Georgia,serif;
	font-size:clamp(1.6rem,1.4vw + .8rem,2.2rem); font-weight:800;
	background:linear-gradient(110deg,var(--c-cyan),var(--c-violet),var(--c-magenta));
	background-clip:text; -webkit-background-clip:text; color:transparent;
	line-height:1; font-variant-numeric:tabular-nums; letter-spacing:-.02em;
}
.hv3-metric__label{
	font-size:.7rem; letter-spacing:.16em; text-transform:uppercase;
	color:rgba(186,230,253,.55); font-weight:600; margin-top:.4rem;
}

/* ----- Hero device mockup (right side) ------------------------------- */
.hv3-device{
	position:relative; aspect-ratio:4/3;
	background:linear-gradient(160deg, rgba(15,23,42,.95),rgba(7,12,24,.95));
	border:1px solid rgba(125,211,252,.32);
	border-radius:24px;
	padding:1.4rem;
	box-shadow:
		0 40px 80px -30px rgba(56,189,248,.5),
		0 0 0 1px rgba(125,211,252,.08),
		inset 0 1px 0 rgba(255,255,255,.05);
	overflow:hidden; isolation:isolate;
	transform:perspective(1400px) rotateY(-6deg) rotateX(2deg);
	animation:hv3-device-float 6s ease-in-out infinite alternate;
}
@keyframes hv3-device-float{
	0%{ transform:perspective(1400px) rotateY(-6deg) rotateX(2deg) translateY(0); }
	100%{ transform:perspective(1400px) rotateY(-6deg) rotateX(2deg) translateY(-12px); }
}
@media (prefers-reduced-motion: reduce){ .hv3-device{ animation:none; } }
.hv3-device::before{
	content:""; position:absolute; inset:-40%; z-index:-1; pointer-events:none;
	background:conic-gradient(from 0deg, transparent, rgba(56,189,248,.4), transparent 30%, rgba(139,92,246,.3) 60%, transparent);
	animation:hv3-aurora 16s linear infinite;
}
.hv3-device__bar{
	display:flex; align-items:center; gap:.5rem;
	padding-bottom:1rem; border-bottom:1px solid rgba(125,211,252,.16);
	margin-bottom:1rem;
}
.hv3-device__dot{
	width:10px; height:10px; border-radius:50%;
	background:rgba(186,230,253,.25);
}
.hv3-device__dot:nth-child(1){ background:#fb7185; }
.hv3-device__dot:nth-child(2){ background:#fbbf24; }
.hv3-device__dot:nth-child(3){ background:#34d399; }
.hv3-device__title{
	margin-left:auto; font-size:.74rem; letter-spacing:.16em;
	text-transform:uppercase; color:rgba(186,230,253,.6); font-weight:700;
}

.hv3-device__rows{
	display:flex; flex-direction:column; gap:.7rem;
}
.hv3-device-row{
	display:grid; grid-template-columns:auto 1fr auto; gap:.85rem;
	align-items:center; padding:.75rem .85rem; border-radius:14px;
	background:linear-gradient(120deg,rgba(20,30,52,.65),rgba(9,15,28,.65));
	border:1px solid rgba(125,211,252,.16);
	transition:all .25s ease;
	opacity:0; transform:translateY(8px);
	animation:hv3-row-in .55s var(--ease-out) forwards;
}
.hv3-device-row:nth-child(1){ animation-delay:.4s; }
.hv3-device-row:nth-child(2){ animation-delay:.55s; }
.hv3-device-row:nth-child(3){ animation-delay:.7s; }
.hv3-device-row:nth-child(4){ animation-delay:.85s; }
@keyframes hv3-row-in{ to{ opacity:1; transform:translateY(0); } }
@media (prefers-reduced-motion: reduce){ .hv3-device-row{ opacity:1; transform:none; animation:none; } }

.hv3-device-row:hover{ border-color:rgba(125,211,252,.4); transform:translateX(4px); }
.hv3-device-row__icon{
	width:34px; height:34px; border-radius:10px;
	display:flex; align-items:center; justify-content:center;
	background:linear-gradient(135deg,rgba(56,189,248,.22),rgba(139,92,246,.22));
	color:var(--c-cyan); flex-shrink:0;
}
.hv3-device-row__icon .material-icons-round{ font-size:18px; }
.hv3-device-row__body{ min-width:0; }
.hv3-device-row__title{ font-size:.82rem; color:#f5f9ff; font-weight:600; }
.hv3-device-row__meta{ font-size:.68rem; color:rgba(186,230,253,.55); margin-top:.2rem; letter-spacing:.02em; }
.hv3-pill{
	font-size:.6rem; padding:.25rem .55rem; border-radius:999px;
	font-weight:700; letter-spacing:.12em; text-transform:uppercase;
	white-space:nowrap;
}
.hv3-pill--success{ background:rgba(52,211,153,.18); color:#86efac; border:1px solid rgba(52,211,153,.32); }
.hv3-pill--warning{ background:rgba(251,191,36,.18); color:#fcd34d; border:1px solid rgba(251,191,36,.32); }
.hv3-pill--info{ background:rgba(56,189,248,.18); color:#7dd3fc; border:1px solid rgba(125,211,252,.32); }

/* Scanning line over the device */
.hv3-device__scan{
	position:absolute; left:0; right:0; height:2px;
	background:linear-gradient(90deg,transparent,var(--c-cyan),transparent);
	box-shadow:0 0 18px var(--c-cyan);
	animation:hv3-scan 4s linear infinite;
}
@keyframes hv3-scan{ 0%{ top:0; opacity:0; } 10%{ opacity:1; } 90%{ opacity:1; } 100%{ top:100%; opacity:0; } }
@media (prefers-reduced-motion: reduce){ .hv3-device__scan{ animation:none; display:none; } }

/* ----- Trusted-by strip ---------------------------------------------- */
.hv3-strip{
	position:relative; padding:2.5rem 0;
	border-top:1px solid var(--c-border);
	border-bottom:1px solid var(--c-border);
	background:rgba(7,12,24,.4);
	backdrop-filter:blur(10px);
	-webkit-backdrop-filter:blur(10px);
	overflow:hidden;
}
.hv3-strip__label{
	text-align:center; font-size:.7rem; letter-spacing:.22em;
	text-transform:uppercase; color:rgba(186,230,253,.5); font-weight:700;
	margin-bottom:1.5rem;
}
.hv3-strip__track{
	display:flex; gap:3.5rem; align-items:center;
	animation:hv3-marquee 30s linear infinite;
	white-space:nowrap; width:max-content;
}
.hv3-strip__chip{
	display:inline-flex; align-items:center; gap:.55rem;
	padding:.7rem 1.4rem; border-radius:999px;
	background:linear-gradient(120deg,rgba(15,23,42,.6),rgba(7,12,24,.6));
	border:1px solid var(--c-border);
	color:#cfe9ff; font-weight:600; font-size:.92rem;
	letter-spacing:.01em;
}
.hv3-strip__chip .material-icons-round{ font-size:18px; color:var(--c-cyan); }
@keyframes hv3-marquee{ 0%{ transform:translateX(0); } 100%{ transform:translateX(-50%); } }
@media (prefers-reduced-motion: reduce){ .hv3-strip__track{ animation:none; } }

/* ----- Section base -------------------------------------------------- */
.hv3-section{
	position:relative; padding:clamp(4rem,7vw,7rem) 0;
}
.hv3-section__container{
	width:100%; max-width:1480px; margin:0 auto;
	padding:0 clamp(1rem,2vw,2.5rem);
}

.hv3-heading{
	text-align:center; max-width:780px; margin:0 auto clamp(2.5rem,4vw,4rem);
}
.hv3-heading__eyebrow{
	display:inline-flex; align-items:center; gap:.5rem;
	padding:.4rem .9rem; border-radius:999px;
	background:linear-gradient(120deg,rgba(56,189,248,.14),rgba(139,92,246,.14));
	border:1px solid rgba(125,211,252,.3);
	font-size:.66rem; font-weight:700; letter-spacing:.22em;
	text-transform:uppercase; color:#cfe9ff; margin-bottom:1rem;
}
.hv3-heading__title{
	font-family:'Roboto Slab','Roboto',Georgia,serif;
	font-size:clamp(2rem, 2.4vw + 1rem, 3.4rem); font-weight:800;
	letter-spacing:-.02em; line-height:1.1; margin:0 0 .9rem;
	background:linear-gradient(110deg,#e0f2fe,#c4b5fd 60%,#f0abfc);
	background-clip:text; -webkit-background-clip:text; color:transparent;
}
.hv3-heading__sub{
	margin:0; font-size:1.08rem; color:rgba(186,230,253,.7);
	line-height:1.55;
}

/* ----- Features grid (bento style) ----------------------------------- */
.hv3-bento{
	display:grid; gap:1.2rem;
	grid-template-columns:repeat(6,1fr);
	grid-auto-rows:minmax(220px,auto);
}
@media (max-width:1200px){ .hv3-bento{ grid-template-columns:repeat(4,1fr); } }
@media (max-width:760px){ .hv3-bento{ grid-template-columns:1fr; } }

.hv3-card{
	position:relative; overflow:hidden; isolation:isolate;
	padding:1.6rem 1.6rem 1.5rem;
	border-radius:22px;
	background:linear-gradient(160deg,rgba(15,23,42,.78),rgba(7,12,24,.78));
	border:1px solid var(--c-border);
	transition:all .35s var(--ease-out);
	display:flex; flex-direction:column; gap:.9rem;
}
.hv3-card::before{
	content:""; position:absolute; inset:-40% -40% auto auto; width:380px; height:380px;
	z-index:-1; pointer-events:none;
	background:radial-gradient(circle, rgba(56,189,248,.2), transparent 60%);
	filter:blur(40px); opacity:.5; transition:opacity .3s ease;
}
.hv3-card::after{
	content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
	background:linear-gradient(135deg, transparent 60%, rgba(125,211,252,.06) 100%);
	opacity:0; transition:opacity .3s ease;
}
.hv3-card:hover{
	transform:translateY(-4px);
	border-color:rgba(125,211,252,.4);
	box-shadow:0 30px 60px -30px rgba(56,189,248,.45);
}
.hv3-card:hover::before{ opacity:.85; }
.hv3-card:hover::after{ opacity:1; }

.hv3-card[data-span="3"]{ grid-column:span 3; }
.hv3-card[data-span="2"]{ grid-column:span 2; }
.hv3-card[data-span="4"]{ grid-column:span 4; }
.hv3-card[data-span="6"]{ grid-column:span 6; }
.hv3-card[data-tall="true"]{ grid-row:span 2; }

@media (max-width:1200px){
	.hv3-card[data-span]{ grid-column:span 2; }
	.hv3-card[data-span="4"], .hv3-card[data-span="6"]{ grid-column:span 4; }
}
@media (max-width:760px){
	.hv3-card[data-span]{ grid-column:span 1; }
	.hv3-card[data-tall]{ grid-row:auto; }
}

/* Tonal accents */
.hv3-card[data-tone="cyan"]::before{ background:radial-gradient(circle, rgba(56,189,248,.24), transparent 60%); }
.hv3-card[data-tone="violet"]::before{ background:radial-gradient(circle, rgba(139,92,246,.24), transparent 60%); }
.hv3-card[data-tone="magenta"]::before{ background:radial-gradient(circle, rgba(244,114,182,.22), transparent 60%); }
.hv3-card[data-tone="emerald"]::before{ background:radial-gradient(circle, rgba(52,211,153,.22), transparent 60%); }
.hv3-card[data-tone="amber"]::before{ background:radial-gradient(circle, rgba(251,191,36,.22), transparent 60%); }

.hv3-card__icon{
	width:56px; height:56px; border-radius:18px;
	display:flex; align-items:center; justify-content:center;
	background:linear-gradient(135deg,rgba(56,189,248,.2),rgba(139,92,246,.2));
	border:1px solid rgba(125,211,252,.32);
	color:var(--c-cyan); flex-shrink:0;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.hv3-card__icon .material-icons-round{ font-size:28px; }
.hv3-card[data-tone="violet"] .hv3-card__icon{ background:linear-gradient(135deg,rgba(139,92,246,.22),rgba(56,189,248,.18)); color:#c4b5fd; }
.hv3-card[data-tone="magenta"] .hv3-card__icon{ background:linear-gradient(135deg,rgba(244,114,182,.22),rgba(139,92,246,.18)); color:#fbcfe8; }
.hv3-card[data-tone="emerald"] .hv3-card__icon{ background:linear-gradient(135deg,rgba(52,211,153,.22),rgba(34,211,238,.18)); color:#86efac; }
.hv3-card[data-tone="amber"] .hv3-card__icon{ background:linear-gradient(135deg,rgba(251,191,36,.22),rgba(244,114,182,.18)); color:#fde68a; }

.hv3-card__title{
	font-family:'Roboto Slab','Roboto',Georgia,serif;
	font-size:1.35rem; font-weight:700; color:#f5f9ff; margin:0;
	letter-spacing:-.01em;
}
.hv3-card__body{
	font-size:.94rem; color:rgba(186,230,253,.72); line-height:1.55; margin:0;
}
.hv3-card__list{
	list-style:none; padding:0; margin:auto 0 0;
	display:flex; flex-direction:column; gap:.45rem;
}
.hv3-card__list li{
	display:flex; gap:.55rem; align-items:flex-start;
	font-size:.84rem; color:rgba(214,226,247,.78); line-height:1.45;
}
.hv3-card__list li::before{
	content:""; flex-shrink:0; width:6px; height:6px; border-radius:50%; margin-top:.5em;
	background:linear-gradient(135deg,var(--c-cyan),var(--c-violet));
	box-shadow:0 0 8px rgba(56,189,248,.6);
}
.hv3-card[data-tone="violet"] .hv3-card__list li::before{ background:linear-gradient(135deg,var(--c-violet),var(--c-cyan)); }
.hv3-card[data-tone="magenta"] .hv3-card__list li::before{ background:linear-gradient(135deg,var(--c-magenta),var(--c-violet)); }
.hv3-card[data-tone="emerald"] .hv3-card__list li::before{ background:linear-gradient(135deg,var(--c-emerald),#22d3ee); }
.hv3-card[data-tone="amber"] .hv3-card__list li::before{ background:linear-gradient(135deg,var(--c-amber),var(--c-magenta)); }

/* ----- Workflow timeline -------------------------------------------- */
.hv3-flow{
	display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem;
	position:relative;
}
@media (max-width:900px){ .hv3-flow{ grid-template-columns:1fr; } }
.hv3-flow::before{
	content:""; position:absolute; top:64px; left:8%; right:8%; height:2px;
	background:linear-gradient(90deg, transparent, rgba(125,211,252,.4), rgba(167,139,250,.4), transparent);
	z-index:0;
}
@media (max-width:900px){ .hv3-flow::before{ display:none; } }

.hv3-flow__step{
	position:relative; z-index:1;
	background:linear-gradient(160deg,rgba(15,23,42,.85),rgba(7,12,24,.85));
	border:1px solid var(--c-border);
	border-radius:22px; padding:1.8rem 1.6rem 1.6rem;
	text-align:center; isolation:isolate;
	transition:all .3s var(--ease-out);
}
.hv3-flow__step::before{
	content:""; position:absolute; inset:-30% auto auto 30%; width:300px; height:300px; z-index:-1;
	background:radial-gradient(circle, rgba(56,189,248,.16), transparent 60%);
	filter:blur(40px); opacity:.6;
}
.hv3-flow__step:hover{ transform:translateY(-4px); border-color:rgba(125,211,252,.4); box-shadow:0 30px 60px -30px rgba(56,189,248,.45); }

.hv3-flow__num{
	width:64px; height:64px; border-radius:50%;
	display:flex; align-items:center; justify-content:center;
	margin:0 auto 1.2rem; font-family:'Roboto Slab',serif;
	font-size:1.6rem; font-weight:800;
	background:linear-gradient(135deg,var(--c-cyan),var(--c-violet));
	color:#fff;
	box-shadow:0 0 0 6px rgba(7,12,24,.95), 0 0 0 7px rgba(125,211,252,.18), 0 14px 30px -10px rgba(56,189,248,.6);
}
.hv3-flow__step:nth-child(2) .hv3-flow__num{ background:linear-gradient(135deg,var(--c-violet),var(--c-magenta)); box-shadow:0 0 0 6px rgba(7,12,24,.95), 0 0 0 7px rgba(167,139,250,.22), 0 14px 30px -10px rgba(139,92,246,.6); }
.hv3-flow__step:nth-child(3) .hv3-flow__num{ background:linear-gradient(135deg,var(--c-magenta),var(--c-amber)); box-shadow:0 0 0 6px rgba(7,12,24,.95), 0 0 0 7px rgba(244,114,182,.22), 0 14px 30px -10px rgba(244,114,182,.6); }

.hv3-flow__icon{
	width:48px; height:48px; border-radius:14px; margin:0 auto .9rem;
	display:flex; align-items:center; justify-content:center;
	background:linear-gradient(135deg,rgba(56,189,248,.2),rgba(139,92,246,.2));
	color:var(--c-cyan);
}
.hv3-flow__icon .material-icons-round{ font-size:24px; }
.hv3-flow__title{
	font-family:'Roboto Slab',serif; font-size:1.25rem; font-weight:700;
	color:#f5f9ff; margin:0 0 .6rem; letter-spacing:-.01em;
}
.hv3-flow__body{
	font-size:.92rem; color:rgba(186,230,253,.72); line-height:1.55; margin:0 0 1rem;
}
.hv3-flow__meta{
	font-size:.72rem; letter-spacing:.04em; color:rgba(186,230,253,.5);
	padding-top:.9rem; border-top:1px dashed rgba(125,211,252,.2);
}

/* ----- Testimonials -------------------------------------------------- */
.hv3-quotes{
	display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem;
}
@media (max-width:900px){ .hv3-quotes{ grid-template-columns:1fr; } }
.hv3-quote{
	position:relative; overflow:hidden;
	background:linear-gradient(160deg,rgba(15,23,42,.78),rgba(7,12,24,.78));
	border:1px solid var(--c-border);
	border-radius:22px; padding:2rem 1.7rem 1.6rem;
	transition:all .3s var(--ease-out); isolation:isolate;
}
.hv3-quote::before{
	content:"\201C"; position:absolute; top:-30px; left:-10px;
	font-family:'Roboto Slab',serif; font-size:14rem; line-height:1;
	color:rgba(125,211,252,.08); pointer-events:none;
}
.hv3-quote:hover{ transform:translateY(-4px); border-color:rgba(125,211,252,.35); box-shadow:0 26px 50px -28px rgba(56,189,248,.35); }
.hv3-quote__stars{
	display:inline-flex; gap:.15rem; margin-bottom:1.1rem; color:var(--c-amber);
}
.hv3-quote__stars .material-icons-round{ font-size:18px; }
.hv3-quote__body{
	margin:0 0 1.3rem; font-size:1.05rem; color:#e6efff; line-height:1.55;
	font-weight:500;
}
.hv3-quote__foot{
	display:flex; align-items:center; gap:.8rem;
	padding-top:1rem; border-top:1px solid rgba(125,211,252,.12);
}
.hv3-quote__avatar{
	width:42px; height:42px; border-radius:50%;
	background:linear-gradient(135deg,var(--c-cyan),var(--c-violet));
	color:#fff; font-weight:700; font-size:.95rem;
	display:flex; align-items:center; justify-content:center;
	font-family:'Roboto Slab',serif;
}
.hv3-quote:nth-child(2) .hv3-quote__avatar{ background:linear-gradient(135deg,var(--c-violet),var(--c-magenta)); }
.hv3-quote:nth-child(3) .hv3-quote__avatar{ background:linear-gradient(135deg,var(--c-emerald),var(--c-cyan)); }
.hv3-quote__name{
	font-weight:700; color:#f5f9ff; font-size:.94rem;
}
.hv3-quote__role{
	font-size:.74rem; color:rgba(186,230,253,.55); letter-spacing:.04em;
}

/* ----- Pricing ------------------------------------------------------- */
.hv3-pricing{
	max-width:520px; margin:0 auto;
	background:linear-gradient(160deg,rgba(15,23,42,.92),rgba(7,12,24,.92));
	border:1px solid rgba(125,211,252,.36);
	border-radius:28px; padding:2.4rem 2rem 2rem;
	position:relative; overflow:hidden; isolation:isolate;
	box-shadow:0 40px 80px -30px rgba(56,189,248,.45);
}
.hv3-pricing::before{
	content:""; position:absolute; inset:-50%; z-index:-1; pointer-events:none;
	background:conic-gradient(from 0deg, transparent, rgba(56,189,248,.25), transparent 25%, rgba(139,92,246,.25) 50%, transparent 75%, rgba(244,114,182,.2), transparent);
	animation:hv3-aurora 20s linear infinite;
}
.hv3-pricing__badge{
	display:inline-flex; align-items:center; gap:.4rem;
	padding:.4rem .9rem; border-radius:999px;
	background:linear-gradient(120deg,rgba(52,211,153,.18),rgba(56,189,248,.16));
	border:1px solid rgba(52,211,153,.32);
	color:#86efac; font-size:.64rem; letter-spacing:.18em; text-transform:uppercase; font-weight:800;
	margin-bottom:1.4rem;
}
.hv3-pricing__price{
	display:flex; align-items:baseline; gap:.5rem;
	margin-bottom:.6rem;
}
.hv3-pricing__amount{
	font-family:'Roboto Slab',serif; font-size:clamp(3.4rem,3vw + 1.4rem,4.6rem);
	font-weight:800; letter-spacing:-.025em; line-height:1;
	background:linear-gradient(110deg,var(--c-cyan),var(--c-violet),var(--c-magenta));
	background-clip:text; -webkit-background-clip:text; color:transparent;
}
.hv3-pricing__per{
	color:rgba(186,230,253,.6); font-size:.95rem; font-weight:500;
}
.hv3-pricing__trial{
	color:rgba(214,226,247,.7); margin:0 0 1.6rem; font-size:.92rem;
}
.hv3-pricing__list{
	list-style:none; padding:0; margin:0 0 1.8rem;
	display:flex; flex-direction:column; gap:.7rem;
}
.hv3-pricing__list li{
	display:flex; gap:.6rem; align-items:flex-start;
	font-size:.92rem; color:#dbe6ff;
}
.hv3-pricing__list .material-icons-round{
	color:#86efac; font-size:20px; flex-shrink:0;
}
.hv3-pricing__cta{
	width:100%; justify-content:center;
}
.hv3-pricing__sales{
	text-align:center; font-size:.78rem; color:rgba(186,230,253,.6); margin:1rem 0 0;
}
.hv3-pricing__sales a{ color:var(--c-cyan); text-decoration:none; font-weight:600; }
.hv3-pricing__sales a:hover{ text-decoration:underline; }

/* ----- CTA banner ---------------------------------------------------- */
.hv3-cta{
	position:relative; padding:clamp(4rem,7vw,6rem) 0;
	overflow:hidden; isolation:isolate;
}
.hv3-cta__container{
	width:100%; max-width:1480px; margin:0 auto;
	padding:0 clamp(1rem,2vw,2.5rem);
}
.hv3-cta__inner{
	position:relative; overflow:hidden; isolation:isolate;
	padding:clamp(3rem,4.5vw,5rem) clamp(2rem,3vw,4rem);
	border-radius:32px;
	background:linear-gradient(135deg, rgba(15,23,42,.92), rgba(7,12,24,.92));
	border:1px solid rgba(125,211,252,.36);
	box-shadow:0 40px 100px -40px rgba(56,189,248,.6);
	text-align:center;
}
.hv3-cta__inner::before{
	content:""; position:absolute; inset:-40%; z-index:-1;
	background:conic-gradient(from 130deg, transparent, rgba(56,189,248,.3), transparent 25%, rgba(139,92,246,.3) 50%, transparent 75%, rgba(244,114,182,.25), transparent);
	animation:hv3-aurora 24s linear infinite;
	filter:blur(40px);
}
.hv3-cta__inner::after{
	content:""; position:absolute; inset:0; pointer-events:none; z-index:0;
	background:
		linear-gradient(rgba(125,211,252,.04) 1px,transparent 1px),
		linear-gradient(90deg, rgba(125,211,252,.04) 1px, transparent 1px);
	background-size:40px 40px;
	mask-image:radial-gradient(ellipse at center, #000, transparent 70%);
	-webkit-mask-image:radial-gradient(ellipse at center, #000, transparent 70%);
}
.hv3-cta__inner > *{ position:relative; z-index:1; }
.hv3-cta__title{
	font-family:'Roboto Slab',serif; font-size:clamp(2rem,2.6vw + 1rem, 3.4rem);
	font-weight:800; margin:0 0 1rem; letter-spacing:-.02em; line-height:1.1;
	background:linear-gradient(110deg,#e0f2fe,#93c5fd,#c4b5fd,#f0abfc,#fde68a);
	background-clip:text; -webkit-background-clip:text; color:transparent;
	background-size:220% 100%; animation:hv3-title 14s ease-in-out infinite;
}
.hv3-cta__sub{
	margin:0 auto 2rem; max-width:60ch;
	font-size:1.1rem; color:rgba(214,226,247,.78); line-height:1.55;
}
.hv3-cta__actions{
	display:flex; gap:.8rem; justify-content:center; flex-wrap:wrap;
}

/* ----- Footer mini --------------------------------------------------- */
.hv3-foot{
	padding:2rem 0 3rem; text-align:center;
	color:rgba(186,230,253,.4); font-size:.84rem;
}
.hv3-foot a{ color:rgba(186,230,253,.6); text-decoration:none; transition:color .2s ease; }
.hv3-foot a:hover{ color:#fff; }
.hv3-foot__links{ display:inline-flex; gap:1.5rem; margin-top:.5rem; }

/* ----- Scroll reveals (used by JS observer) -------------------------- */
.hv3-reveal{
	opacity:0; transform:translateY(24px);
	transition:opacity .7s var(--ease-out), transform .7s var(--ease-out);
}
.hv3-reveal.is-visible{ opacity:1; transform:translateY(0); }
@media (prefers-reduced-motion: reduce){ .hv3-reveal{ opacity:1; transform:none; transition:none; } }

/* ----- Section dividers --------------------------------------------- */
.hv3-divider{
	height:1px; width:100%; max-width:1480px; margin:0 auto;
	background:linear-gradient(90deg, transparent, rgba(125,211,252,.18), transparent);
}

/* ----- Mobile fine tuning ------------------------------------------- */
@media (max-width:760px){
	body.home-page .navbar-nav{ padding:1rem 0; }
	body.home-page .navbar-nav .nav-link{ padding:.7rem 0 !important; }
	body.home-page .navbar.navbar-custom.is-scrolled .navbar-collapse{
		background:rgba(7,12,24,.95);
		border-radius:14px; margin-top:.6rem; padding:.6rem 1rem;
	}
	.hv3-hero{ padding-top:6rem; }
	.hv3-device{ transform:none; animation:none; }
}
