/* Homepage long sections — layout + scroll motion */

.frx-home-long{
  position:relative;padding:100px 0;overflow:hidden;
  border-top:1px solid var(--frx-border);
}
.frx-home-long--a{background:linear-gradient(180deg,var(--frx-bg) 0%,#eef4fa 50%,var(--frx-bg) 100%)}
.frx-home-long--b{background:var(--frx-bg-dark-2);color:var(--frx-text-muted-dark)}

.frx-home-long-orb{
  position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none;
  opacity:0.45;animation:frx-orb-float 14s ease-in-out infinite;
}
.frx-home-long-orb--1{
  width:420px;height:420px;top:-80px;right:-100px;
  background:radial-gradient(circle,rgba(110,193,228,0.35),transparent 70%);
}
.frx-home-long-orb--2{
  width:320px;height:320px;bottom:10%;left:-80px;
  background:radial-gradient(circle,rgba(110,193,228,0.2),transparent 70%);
  animation-delay:-5s;animation-duration:18s;
}
.frx-home-long--b .frx-home-long-orb--1{opacity:0.25}
.frx-home-long--b .frx-home-long-orb--2{opacity:0.2}

@keyframes frx-orb-float{
  0%,100%{transform:translate(0,0) scale(1)}
  50%{transform:translate(-24px,20px) scale(1.08)}
}

.frx-home-long-grid{
  position:absolute;inset:0;opacity:0.04;pointer-events:none;
  background-image:
    linear-gradient(rgba(110,193,228,0.5) 1px,transparent 1px),
    linear-gradient(90deg,rgba(110,193,228,0.5) 1px,transparent 1px);
  background-size:48px 48px;
  animation:frx-grid-drift 40s linear infinite;
}
.frx-home-long--b .frx-home-long-grid{opacity:0.06}
@keyframes frx-grid-drift{
  from{background-position:0 0}
  to{background-position:48px 48px}
}

.frx-home-long-wrap{position:relative;z-index:2}
.frx-home-long-header{
  max-width:720px;margin:0 auto 56px;text-align:center;
}
.frx-home-long-kicker{
  display:inline-block;font-size:11px;font-weight:800;letter-spacing:3px;
  text-transform:uppercase;color:var(--frx-accent);margin-bottom:14px;
}
.frx-home-long--b .frx-home-long-kicker{color:var(--frx-accent-light)}
.frx-home-long-intro{
  font-size:18px;line-height:1.75;color:var(--frx-text-muted);margin-top:16px;
}
.frx-home-long--b .frx-home-long-intro{color:var(--frx-text-muted-dark)}
.frx-home-long--b .frx-h2{color:#fff}

/* Section hero banner */
.frx-home-long-banner{
  position:relative;max-width:1100px;margin:0 auto 48px;
  border-radius:var(--frx-radius-lg);overflow:hidden;
  border:1px solid rgba(15,22,35,0.08);
  box-shadow:0 20px 60px rgba(6,10,16,0.12);
  aspect-ratio:21/8;min-height:200px;
}
.frx-home-long--b .frx-home-long-banner{
  border-color:var(--frx-border);
  box-shadow:0 24px 64px rgba(0,0,0,0.35);
}
.frx-home-long-banner img{
  width:100%;height:100%;object-fit:cover;display:block;
  transform:scale(1.02);
  transition:transform 8s ease;
}
.frx-home-long-banner.frx-motion--visible img{transform:scale(1)}
.frx-home-long-banner-shade{
  position:absolute;inset:0;
  background:linear-gradient(105deg,rgba(6,10,16,0.75) 0%,rgba(6,10,16,0.2) 55%,transparent 100%);
  pointer-events:none;
}
.frx-home-long-banner-label{
  position:absolute;left:28px;bottom:24px;right:28px;margin:0;
  font-size:13px;font-weight:700;letter-spacing:1px;text-transform:uppercase;
  color:rgba(255,255,255,0.85);max-width:480px;line-height:1.5;
}

/* Subsection images */
.frx-home-long-fig{
  margin:0 0 20px;border-radius:var(--frx-radius);
  overflow:hidden;border:1px solid rgba(15,22,35,0.08);
  background:var(--frx-bg);
  box-shadow:0 8px 28px rgba(6,10,16,0.08);
}
.frx-home-long--b .frx-home-long-fig{
  border-color:var(--frx-border);
  box-shadow:0 12px 32px rgba(0,0,0,0.25);
}
.frx-home-long-fig img{
  width:100%;height:auto;display:block;aspect-ratio:16/10;object-fit:cover;
  transition:transform .6s cubic-bezier(.22,1,.36,1);
}
.frx-home-long-block.frx-motion--visible .frx-home-long-fig:hover img{
  transform:scale(1.04);
}
.frx-home-long-fig figcaption{
  padding:12px 16px;font-size:12px;font-weight:600;
  color:var(--frx-text-muted);background:rgba(110,193,228,0.06);
  border-top:1px solid rgba(110,193,228,0.15);
}
.frx-home-long--b .frx-home-long-fig figcaption{
  color:var(--frx-text-muted-dark);
  background:rgba(110,193,228,0.05);
}

.frx-home-long-block-inner{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);
  gap:28px;align-items:start;
}
.frx-home-long-block--flip .frx-home-long-block-inner{
  direction:rtl;
}
.frx-home-long-block--flip .frx-home-long-block-inner > *{
  direction:ltr;
}
.frx-home-long-block--stack .frx-home-long-fig{
  margin-bottom:24px;
}
.frx-home-long-block--stack .frx-home-long-fig--wide img{
  aspect-ratio:21/9;max-height:320px;
}

.frx-home-long-gallery{
  display:grid;gap:12px;margin-bottom:24px;
  border-radius:var(--frx-radius);overflow:hidden;
}
.frx-home-long-gallery--3{grid-template-columns:repeat(3,1fr)}
.frx-home-long-gallery img{
  width:100%;height:100%;object-fit:cover;aspect-ratio:4/3;
  border-radius:var(--frx-radius-sm,8px);
  border:1px solid rgba(15,22,35,0.08);
  transition:transform .45s ease, box-shadow .45s ease;
}
.frx-home-long--b .frx-home-long-gallery img{border-color:var(--frx-border)}
.frx-home-long-gallery img:hover{
  transform:translateY(-3px);
  box-shadow:0 12px 32px rgba(110,193,228,0.2);
}

.frx-home-long-pad--has-img .frx-home-long-fig{
  margin-bottom:20px;
}
.frx-home-long-pad--has-img .frx-home-long-fig img{
  aspect-ratio:21/7;max-height:220px;
}

.frx-home-long-layout{
  display:grid;grid-template-columns:240px 1fr;gap:48px;align-items:start;
  max-width:1100px;margin:0 auto;
}

.frx-home-long-toc{
  position:sticky;top:88px;
  background:var(--frx-surface);border:1px solid rgba(15,22,35,0.08);
  border-radius:var(--frx-radius);padding:24px 20px;
  box-shadow:var(--frx-shadow);
}
.frx-home-long--b .frx-home-long-toc{
  background:var(--frx-bg-card);border-color:var(--frx-border);
}
.frx-home-long-toc-title{
  font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:2px;
  color:var(--frx-text-muted);margin:0 0 14px;
}
.frx-home-long--b .frx-home-long-toc-title{color:rgba(139,156,179,0.8)}
.frx-home-long-toc ol{
  margin:0;padding-left:18px;font-size:13px;line-height:1.65;
  max-height:min(70vh,520px);overflow-y:auto;
}
.frx-home-long-toc a{
  color:var(--frx-text-muted);text-decoration:none;font-weight:500;
  transition:color .2s, padding-left .2s;display:inline-block;
}
.frx-home-long--b .frx-home-long-toc a{color:var(--frx-text-muted-dark)}
.frx-home-long-toc a:hover{color:var(--frx-accent-dark);padding-left:4px}
.frx-home-long--b .frx-home-long-toc a:hover{color:var(--frx-accent)}
.frx-home-long-toc a.is-active{
  color:var(--frx-accent-dark);font-weight:700;
}
.frx-home-long--b .frx-home-long-toc a.is-active{color:var(--frx-accent)}

.frx-home-long-blocks{
  counter-reset:frx-block;
}

.frx-home-long-block{
  counter-increment:frx-block;
  background:var(--frx-surface);border:1px solid rgba(15,22,35,0.08);
  border-radius:var(--frx-radius-lg);padding:32px 36px;margin-bottom:24px;
  box-shadow:0 4px 24px rgba(6,10,16,0.04);
  transition:transform .45s cubic-bezier(.22,1,.36,1), box-shadow .45s ease, border-color .3s;
}
.frx-home-long--b .frx-home-long-block{
  background:var(--frx-bg-card);border-color:var(--frx-border);
  box-shadow:0 8px 32px rgba(0,0,0,0.2);
}
.frx-home-long-block.frx-motion--visible:hover{
  transform:translateY(-4px);
  box-shadow:0 16px 48px rgba(110,193,228,0.12);
  border-color:rgba(110,193,228,0.35);
}
.frx-home-long--b .frx-home-long-block.frx-motion--visible:hover{
  box-shadow:0 20px 56px rgba(0,0,0,0.35);
}

.frx-home-long-block-head{
  display:flex;align-items:flex-start;gap:16px;margin-bottom:20px;
  padding-bottom:16px;border-bottom:1px solid rgba(15,22,35,0.06);
}
.frx-home-long--b .frx-home-long-block-head{border-color:var(--frx-border)}
.frx-home-long-block-num::before{
  content:counter(frx-block, decimal-leading-zero);
  display:flex;align-items:center;justify-content:center;
  width:40px;height:40px;border-radius:10px;flex-shrink:0;
  font-size:13px;font-weight:900;
  background:var(--frx-gradient-accent);color:#060A10;
}
.frx-home-long-block-head h3{
  font-size:20px;font-weight:800;line-height:1.3;margin:0;
  letter-spacing:-0.3px;color:var(--frx-text);
}
.frx-home-long--b .frx-home-long-block-head h3{color:#fff}

.frx-home-long-block-body{
  font-size:16px;line-height:1.8;color:var(--frx-text-muted);
}
.frx-home-long--b .frx-home-long-block-body{color:var(--frx-text-muted-dark)}
.frx-home-long-block-body p{margin-bottom:16px}
.frx-home-long-block-body p:last-child{margin-bottom:0}
.frx-home-long-block-body h4{
  font-size:16px;font-weight:700;margin:20px 0 10px;color:var(--frx-text);
}
.frx-home-long--b .frx-home-long-block-body h4{color:var(--frx-accent-light)}
.frx-home-long-block-body strong{color:var(--frx-text);font-weight:700}
.frx-home-long--b .frx-home-long-block-body strong{color:#fff}
.frx-home-long-block-body a{
  color:var(--frx-accent-dark);font-weight:600;text-decoration:underline;
}
.frx-home-long--b .frx-home-long-block-body a{color:var(--frx-accent)}

.frx-home-long-pad{
  padding:28px 36px;border-radius:var(--frx-radius);
  background:rgba(110,193,228,0.06);border:1px dashed rgba(110,193,228,0.25);
  margin-bottom:24px;
}
.frx-home-long--b .frx-home-long-pad{
  background:rgba(110,193,228,0.04);border-color:rgba(110,193,228,0.15);
}
.frx-home-long-pad .frx-home-long-block-body{
  column-count:1;column-gap:32px;
}
@media(min-width:900px){
  .frx-home-long-pad .frx-home-long-block-body{columns:2}
}

/* Scroll-reveal motion */
.frx-motion{
  opacity:0;transform:translateY(36px);
  transition:opacity .7s cubic-bezier(.22,1,.36,1),
    transform .7s cubic-bezier(.22,1,.36,1);
}
.frx-motion--visible{
  opacity:1;transform:translateY(0);
}
.frx-home-long-header.frx-motion--visible{
  animation:frx-header-glow 1.2s ease .2s both;
}
@keyframes frx-header-glow{
  from{filter:blur(4px);opacity:0;transform:translateY(20px)}
  to{filter:blur(0);opacity:1;transform:translateY(0)}
}

[data-frx-delay]:nth-child(1){transition-delay:.05s}
[data-frx-delay]:nth-child(2){transition-delay:.1s}
[data-frx-delay]:nth-child(3){transition-delay:.15s}
[data-frx-delay]:nth-child(4){transition-delay:.2s}
[data-frx-delay]:nth-child(5){transition-delay:.25s}
[data-frx-delay]:nth-child(6){transition-delay:.3s}
.frx-home-long-block.frx-motion--visible:nth-child(n+7){transition-delay:.35s}

.frx-home-long-progress{
  position:fixed;left:0;right:0;top:0;height:3px;z-index:200;
  background:transparent;pointer-events:none;
}
.frx-home-long-progress span{
  display:block;height:100%;width:0;
  background:var(--frx-gradient-accent);
  transition:width .15s linear;
}

@media(max-width:960px){
  .frx-home-long-layout{grid-template-columns:1fr}
  .frx-home-long-toc{
    position:relative;top:0;max-height:none;
  }
  .frx-home-long-toc ol{max-height:200px}
  .frx-home-long{padding:72px 0}
  .frx-home-long-block{padding:24px 22px}
  .frx-home-long-pad .frx-home-long-block-body{columns:1}
  .frx-home-long-block-inner{grid-template-columns:1fr;gap:20px}
  .frx-home-long-block--flip .frx-home-long-block-inner{direction:ltr}
  .frx-home-long-gallery--3{grid-template-columns:1fr}
  .frx-home-long-banner{aspect-ratio:16/10}
  .frx-home-long-banner-label{font-size:11px;left:16px;bottom:16px}
}

@media(prefers-reduced-motion:reduce){
  .frx-home-long-orb,.frx-home-long-grid{animation:none}
  .frx-motion{opacity:1;transform:none;transition:none}
  .frx-home-long-header.frx-motion--visible{animation:none}
  .frx-home-long-block.frx-motion--visible:hover{transform:none}
  .frx-home-long-banner img,.frx-home-long-fig img{transform:none;transition:none}
}