/* ============================================================
   HOME SHOWPIECE — hero water, giant type, horizontal rail
   ============================================================ */

#water{position:fixed;inset:0;z-index:0;pointer-events:none;}

.hero-stage{
  position:relative;z-index:1;
  min-height:100vh;min-height:100svh;
  display:flex;flex-direction:column;justify-content:center;
  padding:120px 56px 80px;
  max-width:none;
}
.hero-giant{
  font-family:'Fraunces',serif;
  font-weight:400;
  font-size:clamp(64px,13.5vw,220px);
  line-height:0.92;
  letter-spacing:-0.01em;
  color:var(--lily);
  user-select:none;
}
.hero-giant .hollow{
  color:transparent;
  -webkit-text-stroke:1.5px var(--moss-soft);
  font-style:italic;font-weight:300;
}
.hero-sub{
  margin-top:36px;display:flex;align-items:flex-end;justify-content:space-between;
  gap:32px;flex-wrap:wrap;
}
.hero-sub .lede{margin-top:0;}
.scroll-cue{
  font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:0.2em;
  text-transform:uppercase;color:var(--moss-soft);
  display:flex;align-items:center;gap:12px;white-space:nowrap;
}
.scroll-cue .cue-line{
  width:1px;height:44px;background:var(--moss-soft);overflow:hidden;position:relative;
}
.scroll-cue .cue-line::after{
  content:"";position:absolute;left:0;top:-100%;width:100%;height:100%;
  background:var(--accent);animation:cueDrop 1.6s cubic-bezier(0.76,0,0.24,1) infinite;
}
@keyframes cueDrop{to{top:100%;}}

.pond-hint{
  position:absolute;bottom:28px;left:56px;
  font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:0.14em;
  text-transform:uppercase;color:var(--lily-dim);opacity:0.65;
}

/* ---------- horizontal venture rail ---------- */
.rail-section{position:relative;z-index:1;background:var(--pond-dark);}
.rail-head{padding:100px 56px 40px;max-width:none;}
.rail-head h2{
  font-family:'Fraunces',serif;font-weight:400;
  font-size:clamp(38px,6vw,84px);line-height:1;
}
.rail-head h2 em{font-style:italic;color:var(--moss-soft);font-weight:300;}
.rail-viewport{overflow:hidden;}
.rail-track{
  display:flex;gap:28px;padding:20px 56px 110px;
  width:max-content;will-change:transform;
}
.rail-card{
  width:min(430px,78vw);flex-shrink:0;
  border:1px solid var(--line);
  border-radius:36px 8px 36px 8px;
  padding:44px 38px;min-height:340px;
  display:flex;flex-direction:column;justify-content:space-between;
  background:linear-gradient(160deg, rgba(95,214,163,0.09), transparent 60%);
  text-decoration:none;color:inherit;
  transition:border-color 0.3s, background 0.3s;
  position:relative;overflow:hidden;
}
.rail-card:hover{border-color:var(--rc,var(--moss));}
.rail-card .rc-num{
  font-family:'Fraunces',serif;font-size:clamp(60px,7vw,96px);font-weight:300;
  line-height:1;color:transparent;
  -webkit-text-stroke:1px var(--moss-soft);
  opacity:0.85;
}
.rail-card h3{font-family:'Fraunces',serif;font-size:30px;font-weight:500;margin:22px 0 12px;}
.rail-card p{color:var(--lily-dim);font-size:14.5px;line-height:1.65;}
.rail-card .rc-go{
  margin-top:26px;font-family:'JetBrains Mono',monospace;font-size:12px;
  letter-spacing:0.12em;text-transform:uppercase;color:var(--rc,var(--moss-soft));
  display:inline-flex;align-items:center;gap:8px;
}
.rail-card .rc-go::after{content:"→";transition:transform 0.3s;}
.rail-card:hover .rc-go::after{transform:translateX(6px);}
.rail-card::after{
  content:"";position:absolute;right:-30px;bottom:-30px;width:150px;height:150px;
  border-radius:50%;background:var(--rc,var(--moss));opacity:0.07;
  transition:transform 0.5s cubic-bezier(0.22,1,0.36,1);
}
.rail-card:hover::after{transform:scale(1.6);}

.rail-progress{
  position:relative;height:1px;background:var(--line);margin:0 56px;
}
.rail-progress span{
  position:absolute;left:0;top:0;height:100%;width:0;
  background:var(--accent);box-shadow:0 0 10px var(--accent);
}

/* ---------- kinetic velocity strip ---------- */
.kinetic{
  position:relative;z-index:1;background:var(--pond-dark);
  padding:130px 0;overflow:hidden;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
}
.kinetic .k-line{
  white-space:nowrap;font-family:'Fraunces',serif;font-weight:300;
  font-size:clamp(58px,10vw,160px);line-height:1.06;
  will-change:transform;
}
.kinetic .k-line.hollow{
  color:transparent;-webkit-text-stroke:1.2px var(--moss);font-style:italic;
}
.kinetic .k-line.solid{color:var(--lily);}
.kinetic .k-line span{padding-right:0.6em;}

/* ---------- ensure strip + footer sit above water ---------- */
main > .page, .strip, footer{position:relative;z-index:1;background:var(--pond-dark);}
main > .fm-marquee{position:relative;z-index:1;background:var(--pond-dark);}

@media(max-width:768px){
  /* Hero */
  .hero-stage{padding:100px 20px 60px;}
  .hero-giant{font-size:clamp(48px,14vw,80px);line-height:1;}
  .hero-sub{flex-direction:column;align-items:flex-start;gap:24px;}
  .lede{font-size:16px;}
  .scroll-cue{display:none;}
  .pond-hint{left:20px;bottom:20px;}

  /* Rail */
  .rail-head{padding:60px 20px 24px;}
  .rail-head h2{font-size:clamp(32px,9vw,56px);}
  .rail-track{padding:14px 20px 60px;gap:14px;}
  .rail-card{
    width:min(320px,85vw);
    padding:28px 22px;
    min-height:240px;
    border-radius:24px 6px 24px 6px;
  }
  .rail-card h3{font-size:22px;margin:14px 0 8px;}
  .rail-card .rc-num{font-size:clamp(48px,12vw,72px);}
  .rail-progress{margin:0 20px;}

  /* Kinetic text */
  .kinetic{padding:60px 0;}
  .kinetic .k-line{font-size:clamp(44px,13vw,100px);}

  /* Hero CTA buttons stack */
  .hero-cta{flex-direction:column;align-items:flex-start;gap:12px;}
  .btn{width:100%;justify-content:center;}
}

@media(max-width:400px){
  .hero-stage{padding:90px 16px 48px;}
  .rail-track{padding:12px 16px 48px;}
  .rail-card{width:calc(100vw - 48px);}
}
@media (prefers-reduced-motion:reduce){
  .scroll-cue .cue-line::after{animation:none;}
  .rail-track{width:auto;flex-wrap:nowrap;overflow-x:auto;}
}
.kinetic .k-line{margin-left:-12%;}
