/* Home "Designed to Remove Every Barrier" as a standout feature: two full-screen sections
   (.hp-bx = title + 5 benefit cards, .hp-setx = "Set It. Forget It." panel).
   Hidden reveal states apply only under html.hp-bx-js (added by js/home-barriers.js), so no JS = fully visible. */
@media (min-width:992px) {
	html body .hp > .hp-bx, html body .hp > .hp-setx { box-sizing:border-box; height:var(--fit-h); min-height:0; padding-block:clamp(16px,4vh,56px); display:flex; flex-direction:column; justify-content:center; }
	html body .hp-bx .hp-wrap, html body .hp-setx .hp-wrap { width:100%; max-width:1520px; box-sizing:border-box !important; }

	/* --- benefits --- */
	html body .hp-bx .hp-barriers__row { display:flex; flex-direction:column; align-items:center; gap:clamp(18px,5vh,72px); margin:0; }
	html body .hp-bx .hp-barriers__copy { align-items:center; text-align:center; gap:clamp(10px,2.2vh,24px); }
	html body .hp-bx .hp-h2 { font-size:clamp(34px,min(4.4vw,8.6vh),84px); line-height:1.06; letter-spacing:-.03em; font-weight:800; }
	html body .hp-bx .hp-h2 span { display:inline; }
	html body .hp-bx .hp-rich p { font-size:clamp(15px,min(1.35vw,2.9vh),22px); line-height:1.5; max-width:none; }
	html body .hp-bx .hp-pill-g { gap:14px; padding:5px 24px 5px 5px; font-size:clamp(13px,min(1.05vw,2.3vh),17px); line-height:1.4; }
	html body .hp-bx .hp-pill-g .hp-badge { width:clamp(34px,6vh,52px); height:clamp(34px,6vh,52px); }
	html body .hp-bx .hp-pill-g .hp-badge img { width:58%; height:auto; }
	html body .hp-bx .hp-feats { width:100%; gap:clamp(12px,1.6vw,28px); background:none; border:0; border-radius:0; }
	html body .hp-bx .hp-feats li { --rs:clamp(48px,min(5vw,10vh),96px); border:1px solid rgba(15,23,42,.07); border-radius:clamp(20px,1.6vw,28px); background:linear-gradient(180deg,#fff 0%,#fafbfd 100%); box-shadow:0 1px 2px rgba(15,23,42,.03),0 14px 36px -20px rgba(15,23,42,.16); padding:clamp(14px,3.4vh,44px) clamp(12px,1.2vw,24px); gap:clamp(8px,1.6vh,18px); justify-content:flex-start; transition:transform .35s cubic-bezier(.22,.61,.36,1), box-shadow .35s ease, border-color .35s ease; }
	html body .hp-bx .hp-feats li + li { border-left:1px solid rgba(15,23,42,.07); }
	html body .hp-bx .hp-feats li:hover { transform:translateY(-6px); box-shadow:0 1px 2px rgba(15,23,42,.04),0 26px 48px -20px rgba(13,23,88,.22); border-color:rgba(15,23,42,.1); }
	html body .hp-bx .hp-ring { padding:calc(var(--rs) * .14); }
	html body .hp-bx .hp-ring > span { width:var(--rs); height:var(--rs); }
	html body .hp-bx .hp-ring img { width:calc(var(--rs) * .46); height:auto; }
	html body .hp-bx .hp-ring img[width="20"] { width:calc(var(--rs) * .3); }
	html body .hp-bx .hp-feats h3 { font-size:clamp(17px,min(1.65vw,3.4vh),30px); line-height:1.2; font-weight:800; }
	html body .hp-bx .hp-feats li p { font-size:clamp(13px,min(1.05vw,2.3vh),18px); line-height:1.5; }

	/* --- Set It. Forget It. --- */
	html body .hp-setx .hp-set { margin:0; gap:clamp(16px,4.6vh,56px); padding:clamp(20px,5.4vh,72px) clamp(24px,4vw,88px); border-radius:clamp(24px,2vw,40px); border:1px solid rgba(98,133,251,.12); background:radial-gradient(120% 140% at 100% 0%, rgba(98,133,251,.12) 0%, rgba(98,133,251,.03) 45%, #fff 80%); box-shadow:0 30px 60px -40px rgba(13,23,88,.25); }
	html body .hp-setx .hp-set__top { flex-wrap:nowrap; gap:clamp(20px,3vw,56px); }
	html body .hp-setx .hp-set__lead { gap:clamp(18px,2.2vw,40px); }
	html body .hp-setx .hp-set__ic { width:clamp(64px,min(7vw,13vh),124px); height:clamp(64px,min(7vw,13vh),124px); box-shadow:0 16px 32px -14px rgba(98,133,251,.6); }
	html body .hp-setx .hp-set__ic img { width:44%; height:auto; }
	html body .hp-setx .hp-set__t { font-size:clamp(32px,min(4vw,8.4vh),80px); line-height:1.05; letter-spacing:-.03em; font-weight:800; }
	html body .hp-setx .hp-set__s { margin-top:clamp(8px,2vh,22px); font-size:clamp(15px,min(1.35vw,2.9vh),22px); line-height:1.55; max-width:clamp(420px,40vw,720px); }
	html body .hp-setx .hp-set__vr { height:clamp(80px,18vh,180px); }
	html body .hp-setx .hp-set__art { transform:none; margin:0; zoom:1.05; }
	html body .hp-setx .hp-set__pills { flex-wrap:nowrap; gap:clamp(12px,1.6vw,28px); }
	html body .hp-setx .hp-set__pills li { flex:1 1 0; width:auto; height:clamp(52px,10vh,92px); padding:6px 24px 6px 6px; gap:clamp(10px,1.2vw,20px); font-size:clamp(14px,min(1.3vw,2.7vh),21px); transition:transform .35s cubic-bezier(.22,.61,.36,1), box-shadow .35s ease; }
	html body .hp-setx .hp-set__pills li:hover { transform:translateY(-4px); box-shadow:0 18px 36px -18px rgba(13,23,88,.2); }
	html body .hp-setx .hp-set__pills li > img { width:auto; height:calc(100% - 4px); aspect-ratio:1; }
}
@media (min-width:1280px) { html body .hp-setx .hp-set__art { zoom:1.3; } }
@media (min-width:1600px) { html body .hp-setx .hp-set__art { zoom:1.65; } }
@media (min-width:992px) and (max-height:540px) { html body .hp-setx .hp-set__art { zoom:.95; } }

/* data dots flowing gateway -> cloud (decorative) */
.hp-set__flow { position:absolute; left:91px; top:71.8px; width:60px; height:6px; pointer-events:none; z-index:2; }
.hp-set__flow i { position:absolute; left:0; top:0; width:6px; height:6px; border-radius:50%; background:#6285fb; box-shadow:0 0 8px 2px rgba(98,133,251,.55); opacity:0; }

@media (prefers-reduced-motion: no-preference) {
	.hp-set__flow i { animation:hpbx-flow 1.8s linear infinite; }
	.hp-set__flow i:nth-child(2) { animation-delay:.6s; } .hp-set__flow i:nth-child(3) { animation-delay:1.2s; }
	.hp-set__cloud { animation:hpbx-float 5s ease-in-out infinite; }
	.hp-set__ic { animation:hpbx-glow 3.2s ease-in-out infinite; }
	.hp-bx .hp-ring { position:relative; }
	.hp-bx .hp-ring::after { content:""; position:absolute; inset:0; border-radius:100px; border:2px solid currentColor; opacity:0; animation:hpbx-ripple 3.6s ease-out infinite; animation-delay:calc(var(--i,0) * .5s + 1.2s); pointer-events:none; }
	.hp-bx .hp-ring--g { color:rgba(31,171,61,.45); } .hp-bx .hp-ring--s { color:rgba(33,158,252,.45); } .hp-bx .hp-ring--o { color:rgba(255,127,39,.45); } .hp-bx .hp-ring--p { color:rgba(98,133,251,.45); }
	.hp-bx .hp-ring > span img { animation:hpbx-bob 3.6s ease-in-out infinite; animation-delay:calc(var(--i,0) * .25s); }
	.hp-bx .hp-feats li:hover .hp-ring > span { transform:scale(1.08) rotate(-4deg); }
	.hp-bx .hp-ring > span { transition:transform .4s cubic-bezier(.34,1.56,.64,1); }

	/* scroll reveal (JS-gated) */
	html.hp-bx-js [data-bx] .hp-barriers__copy > *, html.hp-bx-js [data-bx] .hp-feats li, html.hp-bx-js [data-bx] .hp-set, html.hp-bx-js [data-bx] .hp-set__lead, html.hp-bx-js [data-bx] .hp-set__art, html.hp-bx-js [data-bx] .hp-set__pills li {
		transition-property:opacity, transform, box-shadow, border-color; transition-duration:700ms, 700ms, .35s, .35s; transition-timing-function:cubic-bezier(.22,.61,.36,1);
	}
	html.hp-bx-js [data-bx]:not(.is-in) .hp-barriers__copy > * { opacity:0; transform:translateY(22px); }
	html.hp-bx-js [data-bx] .hp-barriers__copy > :nth-child(2) { transition-delay:100ms; }
	html.hp-bx-js [data-bx] .hp-barriers__copy > :nth-child(3) { transition-delay:200ms; }
	html.hp-bx-js [data-bx]:not(.is-in) .hp-feats li { opacity:0; transform:translateY(36px) scale(.97); }
	html.hp-bx-js [data-bx]:not(.is-done) .hp-feats li { transition-delay:calc(300ms + var(--i,0) * 110ms), calc(300ms + var(--i,0) * 110ms), 0s, 0s; }
	html.hp-bx-js [data-bx]:not(.is-in) .hp-set { opacity:0; transform:translateY(28px); }
	html.hp-bx-js [data-bx]:not(.is-in) .hp-set__lead { opacity:0; transform:translateX(-24px); }
	html.hp-bx-js [data-bx] .hp-set__lead { transition-delay:200ms; }
	html.hp-bx-js [data-bx]:not(.is-in) .hp-set__art { opacity:0; transform:translateX(24px); }
	html.hp-bx-js [data-bx] .hp-set__art { transition-delay:350ms; }
	html.hp-bx-js [data-bx]:not(.is-in) .hp-set__pills li { opacity:0; transform:translateY(20px); }
	html.hp-bx-js [data-bx]:not(.is-done) .hp-set__pills li { transition-delay:calc(550ms + var(--i,0) * 130ms), calc(550ms + var(--i,0) * 130ms), 0s, 0s; }
}
@keyframes hpbx-flow { 0% { transform:translateX(-4px); opacity:0; } 15% { opacity:1; } 85% { opacity:1; } 100% { transform:translateX(58px); opacity:0; } }
@keyframes hpbx-float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-4px); } }
@keyframes hpbx-bob { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-3px); } }
@keyframes hpbx-ripple { 0% { transform:scale(1); opacity:.9; } 70%,100% { transform:scale(1.35); opacity:0; } }
@keyframes hpbx-glow { 0%,100% { box-shadow:0 16px 32px -14px rgba(98,133,251,.6), 0 0 0 0 rgba(98,133,251,.35); } 50% { box-shadow:0 16px 32px -14px rgba(98,133,251,.6), 0 0 0 12px rgba(98,133,251,0); } }
/* ==========================================================================
   v2 "wow" layer. Everything below animates transform/opacity (orbs are static blur).
   ========================================================================== */
.hp-bx, .hp-setx { position:relative; }
.hp-bx > .hp-wrap, .hp-setx > .hp-wrap { position:relative; z-index:1; }
.bx-bg { position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:0; }
.bx-bg i { position:absolute; width:30%; aspect-ratio:1; border-radius:50%; filter:blur(70px); opacity:.28; will-change:transform; }
.bx-bg i:nth-child(1) { left:4%; top:12%; background:#1fab3d; }
.bx-bg i:nth-child(2) { left:38%; top:30%; background:#219efc; opacity:.18; }
.bx-bg i:nth-child(3) { left:66%; top:8%; background:#6285fb; opacity:.22; }
.hp-setx .bx-bg i:nth-child(1) { left:60%; top:20%; background:#6285fb; }
.hp-setx .bx-bg i:nth-child(2) { left:10%; top:40%; background:#219efc; }
.hp-setx .bx-bg i:nth-child(3) { left:36%; top:6%; background:#1fab3d; opacity:.14; }
.bx-w { display:inline-block; overflow:hidden; vertical-align:bottom; padding-bottom:.14em; margin-bottom:-.14em; }
.bx-w > * { display:inline-block; }
.bx-w--acc .hp-acc--g { position:relative; }
.bx-led { position:absolute; left:80px; top:60px; width:5px; height:5px; border-radius:50%; background:#3ddc6a; box-shadow:0 0 6px 2px rgba(61,220,106,.7); z-index:3; }

@media (prefers-reduced-motion: no-preference) {
	.bx-bg i:nth-child(1) { animation:bx-drift1 22s ease-in-out infinite; }
	.bx-bg i:nth-child(2) { animation:bx-drift2 26s ease-in-out infinite; }
	.bx-bg i:nth-child(3) { animation:bx-drift3 30s ease-in-out infinite; }

	/* title: word mask slide-up, accent gradient sweep + underline draw */
	html.hp-bx-js .bx-w > * { transition:transform 900ms cubic-bezier(.16,1,.3,1); transition-delay:calc(var(--w,0) * 90ms); }
	html.hp-bx-js [data-bx]:not(.is-in) .bx-w > * { transform:translateY(110%); }
	html.hp-bx-js .hp-bx .hp-barriers__copy > .hp-h2 { opacity:1 !important; transform:none !important; }
	html.hp-bx-js .hp-setx .hp-set__lead { transform:none; }
	.hp-bx .bx-w--acc .hp-acc--g { background:linear-gradient(100deg,#1fab3d 0%,#1fab3d 38%,#9bf0ae 50%,#1fab3d 62%,#1fab3d 100%) 100% 0 / 260% 100%; -webkit-background-clip:text; background-clip:text; color:transparent; animation:bx-sweep 5s ease-in-out 1.4s infinite; }
	.hp-bx .bx-w--acc .hp-acc--g::after { content:""; position:absolute; left:2%; right:2%; bottom:-.04em; height:.09em; border-radius:9px; background:linear-gradient(90deg,#1fab3d,#7fdc93 60%,#219efc); transform:scaleX(0); transform-origin:left; transition:transform 1s cubic-bezier(.65,0,.35,1) 900ms; }
	.hp-bx.is-in .bx-w--acc .hp-acc--g::after, html:not(.hp-bx-js) .hp-bx .bx-w--acc .hp-acc--g::after { transform:scaleX(1); }

	/* cards: 3D flip-up stagger, sheen, cursor tilt + glow */
	html body .hp-bx .hp-feats { perspective:1100px; }
	html body .hp-bx .hp-feats li { position:relative; overflow:hidden; transform-style:preserve-3d; will-change:transform; }
	html.hp-bx-js body .hp-bx:not(.is-in) .hp-feats li { opacity:0; transform:rotateX(32deg) translateY(56px) scale(.93); transform-origin:50% 100%; }
	html.hp-bx-js body .hp-bx:not(.is-done) .hp-feats li { transition-duration:1000ms, 1000ms, .35s, .35s; transition-timing-function:cubic-bezier(.16,1,.3,1); transition-delay:calc(450ms + var(--i,0) * 130ms), calc(450ms + var(--i,0) * 130ms), 0s, 0s; }
	html body .hp-bx.is-done .hp-feats li, html:not(.hp-bx-js) body .hp-bx .hp-feats li { transition:transform .25s ease-out, box-shadow .35s ease; transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--ty,0px)); }
	html body .hp-bx.is-done .hp-feats li:hover { --ty:-8px; box-shadow:0 2px 4px rgba(15,23,42,.04),0 34px 60px -24px rgba(13,23,88,.28); }
	.hp-bx .hp-feats li::before { content:""; position:absolute; inset:-2px; background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.95) 50%,transparent 65%); transform:translateX(-130%); pointer-events:none; z-index:2; }
	.hp-bx.is-in .hp-feats li::before { animation:bx-sheen 1.1s ease-out both; animation-delay:calc(1000ms + var(--i,0) * 130ms); }
	.hp-bx.is-done .hp-feats li:hover::before { animation:bx-sheen .9s ease-out both; }
	.hp-bx .hp-feats li::after { content:""; position:absolute; inset:0; background:radial-gradient(260px circle at var(--mx,50%) var(--my,30%), rgba(98,133,251,.13), transparent 60%); opacity:0; transition:opacity .3s ease; pointer-events:none; }
	.hp-bx .hp-feats li:hover::after { opacity:1; }
	.hp-bx .hp-feats li > * { position:relative; z-index:1; }

	/* icon circles burst in, then each icon does its own thing */
	html.hp-bx-js .hp-bx:not(.is-in) .hp-ring > span { transform:scale(0); }
	.hp-bx.is-in .hp-ring > span { animation:bx-burst 800ms cubic-bezier(.34,1.56,.64,1) both; animation-delay:calc(700ms + var(--i,0) * 130ms); }
	.hp-bx .hp-ring > span img { animation:none; }
	.hp-bx .hp-feats li:nth-child(1) .hp-ring img { animation:bx-coin 4.5s ease-in-out 2.2s infinite; }
	.hp-bx .hp-feats li:nth-child(2) .hp-ring img { transform-origin:50% 100%; animation:bx-bars 3s ease-in-out 2.4s infinite; }
	.hp-bx .hp-feats li:nth-child(3) .hp-ring img { animation:bx-shield 3.6s ease-in-out 2.6s infinite; }
	.hp-bx .hp-feats li:nth-child(4) .hp-ring img { animation:bx-bolt 3.2s linear 2.8s infinite; }
	.hp-bx .hp-feats li:nth-child(5) .hp-ring img { animation:bx-spark 2.8s ease-in-out 3s infinite; }

	/* Set It. Forget It.: line draws, particles stream, LED blinks, cloud pulses on arrival */
	html.hp-bx-js .hp-setx:not(.is-in) .hp-set__line { transform:scaleX(0); }
	.hp-setx .hp-set__line { transform-origin:0 50%; transition:transform 900ms cubic-bezier(.65,0,.35,1) 700ms; }
	html.hp-bx-js .hp-setx:not(.is-done) .hp-set__flow i { animation-play-state:paused; opacity:0; }
	.hp-set__flow i { animation-duration:1.5s; }
	.hp-set__flow i:nth-child(2) { animation-delay:.5s; } .hp-set__flow i:nth-child(3) { animation-delay:1s; }
	.bx-led { animation:bx-led 1.5s steps(1) infinite; }
	.hp-setx .hp-set__c0 { transform-origin:50% 60%; animation:bx-cloud 1.5s ease-out 1.3s infinite; }
	.hp-setx .hp-set__logo { animation:bx-logo 1.5s ease-out 1.3s infinite; }
	.hp-setx .hp-set__pills li { position:relative; overflow:hidden; }
	.hp-setx .hp-set__pills li::after { content:""; position:absolute; inset:0; background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.9) 50%,transparent 65%); transform:translateX(-130%); pointer-events:none; }
	.hp-setx.is-in .hp-set__pills li::after { animation:bx-sheen 1s ease-out both; animation-delay:calc(1100ms + var(--i,0) * 160ms); }
	.hp-setx.is-in .hp-set__pills li > img { animation:bx-nope 900ms cubic-bezier(.34,1.56,.64,1) both; animation-delay:calc(800ms + var(--i,0) * 160ms); }
	.hp-setx .hp-set__pills li:hover > img { animation:bx-nope 700ms cubic-bezier(.34,1.56,.64,1) both; }
}
@keyframes bx-drift1 { 0%,100% { transform:translate(0,0) scale(1); } 50% { transform:translate(18%,10%) scale(1.15); } }
@keyframes bx-drift2 { 0%,100% { transform:translate(0,0) scale(1.1); } 50% { transform:translate(-14%,-12%) scale(.95); } }
@keyframes bx-drift3 { 0%,100% { transform:translate(0,0); } 50% { transform:translate(-10%,16%) scale(1.12); } }
@keyframes bx-sweep { 0% { background-position:100% 0; } 45%,100% { background-position:0% 0; } }
@keyframes bx-sheen { from { transform:translateX(-130%); } to { transform:translateX(130%); } }
@keyframes bx-burst { 0% { transform:scale(0) rotate(-30deg); } 70% { transform:scale(1.18) rotate(4deg); } 100% { transform:scale(1) rotate(0); } }
@keyframes bx-coin { 0%,70%,100% { transform:perspective(200px) rotateY(0); } 85% { transform:perspective(200px) rotateY(360deg) scale(1.1); } }
@keyframes bx-bars { 0%,100% { transform:scaleY(1); } 20% { transform:scaleY(.45); } 45% { transform:scaleY(1.12); } 60% { transform:scaleY(1); } }
@keyframes bx-shield { 0%,60%,100% { transform:scale(1) rotate(0); } 70% { transform:scale(1.2) rotate(-10deg); } 80% { transform:scale(.95) rotate(6deg); } 90% { transform:scale(1.05) rotate(0); } }
@keyframes bx-bolt { 0%,58%,100% { opacity:1; transform:scale(1); } 60% { opacity:.2; } 62% { opacity:1; transform:scale(1.25); } 64% { opacity:.3; } 67% { opacity:1; transform:scale(1.1); } 75% { transform:scale(1); } }
@keyframes bx-spark { 0%,100% { transform:scale(1) rotate(0); opacity:1; } 30% { transform:scale(1.25) rotate(18deg); opacity:.75; } 55% { transform:scale(.9) rotate(-8deg); opacity:1; } }
@keyframes bx-led { 0% { opacity:1; } 50% { opacity:.15; } }
@keyframes bx-cloud { 0%,70% { transform:scale(1); filter:none; } 82% { transform:scale(1.05); } 100% { transform:scale(1); } }
@keyframes bx-logo { 0%,70%,100% { transform:scale(1); } 82% { transform:scale(1.06); } }
@keyframes bx-nope { 0% { transform:scale(.4) rotate(-20deg); opacity:0; } 60% { transform:scale(1.15) rotate(8deg); opacity:1; } 80% { transform:rotate(-6deg); } 100% { transform:none; } }
