/* UPLINK CURRENT / commerce and proof layer */
.current-stage{position:relative;isolation:isolate;overflow:hidden;color:#153a3b;background:linear-gradient(145deg,#f8faf5,#dff1ef 48%,#eef2fb)}
.current-stage::before{content:"";position:absolute;z-index:-1;inset:-25% -10%;background:radial-gradient(circle at 83% 16%,rgba(91,196,219,.28),transparent 29%),radial-gradient(circle at 18% 78%,rgba(155,220,181,.3),transparent 31%);filter:blur(10px)}
.current-river{position:absolute;z-index:-1;inset:0;pointer-events:none;opacity:.56}
.current-river svg{width:100%;height:100%;overflow:visible}
.current-river path{fill:none;stroke:url(#current-gradient);stroke-width:1.5;stroke-dasharray:9 13;vector-effect:non-scaling-stroke;animation:current-flow 24s linear infinite}
@keyframes current-flow{to{stroke-dashoffset:-440}}
.live-shelf{padding:clamp(6rem,11vw,10rem) 0}
.live-shelf-head{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(17rem,.52fr);align-items:end;gap:clamp(2rem,7vw,7rem);margin-bottom:clamp(3rem,6vw,5.5rem)}
.live-shelf-head h2{max-width:14ch;margin:.4rem 0 0;font-size:clamp(3.2rem,5.6vw,6rem);font-weight:470;line-height:.96;letter-spacing:-.06em;word-break:keep-all}
.live-shelf-head>div:last-child{padding:1.3rem 0 1.3rem 1.5rem;border-left:1px solid rgba(21,103,100,.24)}
.live-shelf-head p{color:#557270}
.live-label{color:#0b7f74;font:800 .72rem/1.4 ui-monospace,Consolas,monospace;letter-spacing:.16em;text-transform:uppercase}
.live-grid{display:grid;grid-template-columns:1.02fr .98fr;grid-template-rows:auto auto;gap:1rem}
.live-card{position:relative;min-height:25rem;display:flex;flex-direction:column;overflow:hidden;padding:clamp(1.5rem,3.5vw,3rem);border:1px solid rgba(28,96,95,.17);border-radius:2rem;background:rgba(255,255,255,.62);box-shadow:0 2.2rem 6rem rgba(32,73,75,.12),inset 0 1px rgba(255,255,255,.85);backdrop-filter:blur(22px) saturate(130%);transition:transform .55s cubic-bezier(.16,1,.3,1),box-shadow .55s,border-color .4s}
.live-card:hover{transform:translateY(-8px);border-color:rgba(var(--live-rgb),.38);box-shadow:0 3rem 7rem rgba(32,73,75,.17),inset 0 1px #fff}
.live-card::before{content:"";position:absolute;right:-12%;top:-20%;width:21rem;aspect-ratio:1;border-radius:44% 56% 58% 42%;background:radial-gradient(circle at 35% 30%,rgba(var(--live-rgb),.42),rgba(var(--live-rgb),.1) 46%,transparent 68%);filter:blur(2px);transform:rotate(-13deg);transition:transform .7s cubic-bezier(.16,1,.3,1)}
.live-card:hover::before{transform:translate(-6%,6%) rotate(7deg) scale(1.08)}
.live-card-aqua{--live-rgb:24,178,161;grid-row:1/3;min-height:51rem;color:#eafff9;background:linear-gradient(155deg,rgba(5,77,84,.95),rgba(4,41,58,.97))}
.live-card-aqua.is-near{background:linear-gradient(155deg,rgba(5,77,84,.95),rgba(4,41,58,.97)),url('/assets/images/aquarium-environment.webp') center/cover}
.live-card-aqua::after{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(180deg,rgba(5,62,70,.08),rgba(2,28,43,.75));pointer-events:none}
.live-card-tool{--live-rgb:146,113,255;background:linear-gradient(145deg,rgba(255,255,255,.85),rgba(236,231,255,.75))}
.live-card-web{--live-rgb:71,139,229;min-height:25rem;background:linear-gradient(145deg,rgba(255,255,255,.82),rgba(222,239,249,.74))}
.live-card>*{position:relative;z-index:1}
.live-card-top{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.live-status{display:inline-flex;align-items:center;gap:.55rem;padding:.45rem .7rem;border:1px solid currentColor;border-radius:999px;font:800 .64rem/1 ui-monospace,monospace;letter-spacing:.11em;opacity:.82}
.live-status::before{content:"";width:.45rem;aspect-ratio:1;border-radius:50%;background:currentColor;box-shadow:0 0 1rem currentColor}
.live-no{font:700 .65rem ui-monospace,monospace;letter-spacing:.12em;opacity:.62}
.live-card h3{max-width:13ch;margin:auto 0 1rem;font-size:clamp(2.25rem,4.1vw,4.5rem);font-weight:480;line-height:.98;letter-spacing:-.05em;word-break:keep-all;overflow-wrap:normal}
.live-card-tool h3,.live-card-web h3{max-width:none;font-size:clamp(2.15rem,2.6vw,2.8rem)}
.live-card p{max-width:34rem;margin:0 0 1.3rem;color:#566f70;line-height:1.9}
.live-card-aqua p{color:#c8e5df}
.live-card-meta{display:flex;flex-wrap:wrap;gap:.55rem;margin-bottom:1.4rem}
.live-card-meta span{padding:.4rem .65rem;border:1px solid rgba(23,73,73,.16);border-radius:999px;background:rgba(255,255,255,.4);font-size:.72rem;font-weight:750}
.live-card-aqua .live-card-meta span{border-color:rgba(220,255,247,.22);background:rgba(214,255,246,.08)}
.live-card-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem;margin-top:auto}
.live-card .button{min-height:3.7rem;padding:.85rem 1.35rem;font-size:.96rem;font-weight:850}
.live-card .button.primary{color:#fff;border-color:#126f68;background:#126f68}
.live-card-aqua .button.primary{color:#073832;border-color:#9cf5dc;background:#9cf5dc}
.live-price{display:flex;align-items:baseline;gap:.5rem;color:#43349d;font-weight:850}
.live-price strong{font-size:2rem;line-height:1}
.live-price small{font-size:.74rem}
.live-shelf-foot{display:flex;justify-content:space-between;align-items:center;gap:2rem;margin-top:1.5rem;padding:1.2rem 0;border-top:1px solid rgba(25,90,88,.15);color:#59716f;font-size:.82rem}
.live-shelf-foot b{color:#155f5b;letter-spacing:.06em}

.proof-stage{padding:clamp(6rem,11vw,11rem) 0;color:#effffb;background:radial-gradient(circle at 88% 14%,rgba(118,111,255,.2),transparent 30%),linear-gradient(145deg,#07191f,#102e34 57%,#101b31)}
.proof-head{display:grid;grid-template-columns:1fr .65fr;align-items:end;gap:clamp(2rem,7vw,7rem);margin-bottom:clamp(3rem,7vw,6rem)}
.proof-head h2{max-width:13ch;margin:.4rem 0;font-size:clamp(3rem,6vw,6.5rem);font-weight:470;line-height:.96;letter-spacing:-.06em}
.proof-head p{color:#b9d2cd}
.proof-canvas{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(18rem,.55fr);gap:1rem}
.proof-feature{position:relative;min-height:40rem;display:flex;flex-direction:column;overflow:hidden;padding:clamp(1.5rem,4vw,3.5rem);border:1px solid rgba(194,255,242,.18);border-radius:2rem;background:linear-gradient(145deg,rgba(33,90,94,.72),rgba(10,30,43,.88));box-shadow:0 2.5rem 7rem rgba(0,0,0,.28)}
.proof-feature::before{content:"";position:absolute;right:-7%;bottom:-18%;width:37rem;aspect-ratio:1;border:1px solid rgba(188,255,238,.24);border-radius:48% 52% 43% 57%;background:radial-gradient(circle at 40% 34%,rgba(128,255,217,.3),rgba(105,119,255,.1) 43%,transparent 67%);transform:rotate(-8deg)}
.proof-feature h3{position:relative;max-width:10ch;margin:auto 0 1rem;font-size:clamp(2.8rem,5.5vw,6.2rem);font-weight:480;line-height:.92;letter-spacing:-.06em}
.proof-feature p{position:relative;max-width:39rem;color:#cae2dd}
.proof-feature .button{position:relative;width:max-content;margin-top:1rem}
.proof-phone{position:absolute;right:clamp(1rem,6vw,6rem);top:clamp(2rem,7vw,5rem);width:min(27%,15rem);aspect-ratio:.52;padding:.7rem;border:1px solid rgba(255,255,255,.26);border-radius:2.3rem;background:#07191f;box-shadow:-1.5rem 2rem 5rem rgba(0,0,0,.38);transform:rotate(7deg)}
.proof-phone img{width:100%;height:100%;object-fit:cover;border-radius:1.65rem;opacity:.86}
.proof-list{display:grid;gap:1rem}
.proof-list a{position:relative;min-height:12.65rem;display:flex;flex-direction:column;justify-content:space-between;padding:1.4rem;border:1px solid rgba(194,255,242,.16);border-radius:1.4rem;background:rgba(184,255,237,.06);transition:background .3s,transform .35s}
.proof-list a:hover{background:rgba(184,255,237,.12);transform:translateX(-5px)}
.proof-list span{color:#9aefd6;font:700 .64rem ui-monospace,monospace;letter-spacing:.12em}
.proof-list strong{font-size:clamp(1.2rem,2vw,1.65rem);line-height:1.35}
.proof-list small{color:#a7c6c0}

/* Paid tool presentation */
.tool-sales{--tool-purple:#7159d8;--tool-ink:#24233d;color:#24233d;background:#f5f2ff}
.tool-sales .site-header{color:#183b3a}
.tool-sales .site-header :is(.logo,.nav-list a){color:#183b3a!important}
.tool-sales .site-header .logo-mark{border-color:#31877b}
.tool-sales .site-header .breadcrumbs{color:#54716e}
.tool-hero{position:relative;isolation:isolate;min-height:92svh;display:grid;align-items:center;overflow:hidden;padding:10rem 0 5rem;background:radial-gradient(circle at 78% 22%,rgba(143,121,255,.34),transparent 30%),radial-gradient(circle at 18% 82%,rgba(98,226,193,.28),transparent 32%),linear-gradient(145deg,#f9faf5,#eeeaff)}
.tool-hero::before{content:"";position:absolute;z-index:-1;inset:7rem 4vw 3rem;border:1px solid rgba(74,64,137,.14);border-radius:2.5rem;background:rgba(255,255,255,.28);box-shadow:0 3rem 8rem rgba(64,52,114,.12);backdrop-filter:blur(18px)}
.tool-hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(22rem,.72fr);align-items:center;gap:clamp(2rem,7vw,7rem)}
.tool-hero h1{max-width:12ch;margin:.5rem 0 1.3rem;font-size:clamp(3.1rem,5.8vw,6.1rem);font-weight:480;line-height:.94;letter-spacing:-.06em;word-break:keep-all}
.tool-hero .lead{color:#5e5a79!important}
.tool-hero .breadcrumbs,.tool-hero .breadcrumbs a{color:#55716f!important}
.tool-price-panel{padding:clamp(1.4rem,3vw,2.4rem);border:1px solid rgba(83,68,164,.17);border-radius:1.7rem;background:rgba(255,255,255,.72);box-shadow:0 2rem 6rem rgba(66,52,128,.13);backdrop-filter:blur(20px)}
.tool-price-panel>span{color:#6851ce;font:800 .68rem ui-monospace,monospace;letter-spacing:.14em}
.tool-price-panel strong{display:block;margin:.7rem 0;font-size:clamp(3rem,6vw,5rem);line-height:1;color:#40338e}
.tool-price-panel p{color:#66617f}
.tool-price-panel .button{width:100%;margin-top:.55rem}
.tool-price-panel .button.primary{color:#fff!important;border-color:#5e4ac7!important;background:#5e4ac7!important}
.tool-section{padding:clamp(5rem,10vw,9rem) 0}
.tool-section:nth-child(even){background:#fff}
.tool-section h2{max-width:15ch;margin:.5rem 0 1.4rem;font-size:clamp(2.6rem,5vw,5.4rem);font-weight:480;line-height:1;letter-spacing:-.055em}
.tool-section p{color:#615e78}
.tool-demo{display:grid;grid-template-columns:.72fr 1.28fr;gap:1rem;margin-top:3rem}
.tool-demo-panel,.tool-demo-output{padding:clamp(1.3rem,3vw,2.3rem);border:1px solid rgba(83,68,164,.16);border-radius:1.6rem;background:rgba(255,255,255,.76);box-shadow:0 1.5rem 4.5rem rgba(60,51,110,.1)}
.tool-demo-panel label{display:grid;gap:.45rem;margin-bottom:1rem;font-weight:800}
.tool-demo-panel select{width:100%;min-height:3.2rem;padding:.7rem;border:1px solid rgba(83,68,164,.25);border-radius:.65rem;color:#24233d;background:#fff}
.tool-demo-output{position:relative;background:linear-gradient(145deg,#26334a,#20243f);color:#f6f5ff}
.tool-demo-output span{color:#b8a2ff;font:700 .68rem ui-monospace,monospace;letter-spacing:.13em}
.tool-demo-output h3{font-size:1.4rem}
.tool-demo-output p{color:#d6d4e8}
.tool-compare{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:3rem}
.tool-compare article{padding:clamp(1.4rem,3vw,2.4rem);border:1px solid rgba(83,68,164,.16);border-radius:1.5rem;background:rgba(255,255,255,.7)}
.tool-compare article:last-child{color:#fff;background:linear-gradient(145deg,#5c4bbb,#39317b)}
.tool-compare article:last-child :is(h3,p,li){color:#f5f3ff}
.tool-compare ul{padding-left:1.2rem;color:#5e5a79}
.tool-flow{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:3rem;background:rgba(83,68,164,.18)}
.tool-flow article{padding:2rem;background:#fff}
.tool-flow span{color:#6851ce;font:800 .7rem ui-monospace,monospace}

/* The page index stays available without covering content */
.section-compass{width:3.15rem;padding:.5rem;overflow:hidden;opacity:.82;transition:width .35s cubic-bezier(.16,1,.3,1),opacity .25s}
.section-compass::before{content:"INDEX";width:2rem;overflow:hidden;padding:.25rem .25rem .45rem;white-space:nowrap}
.section-compass a{width:11.5rem;grid-template-columns:1.45rem 9.2rem;padding:.36rem .35rem}
.section-compass a span:last-child{opacity:0;transition:opacity .2s}
.section-compass:hover,.section-compass:focus-within{width:13rem;opacity:1}
.section-compass:hover a span:last-child,.section-compass:focus-within a span:last-child{opacity:1}

@media(max-width:900px){
  .live-shelf-head,.proof-head,.proof-canvas,.tool-hero-grid,.tool-demo{grid-template-columns:1fr}
  .live-grid{grid-template-columns:1fr;grid-template-rows:auto}.live-card-aqua{grid-row:auto;min-height:36rem}.live-card{min-height:28rem}
  .proof-feature{min-height:36rem}.proof-phone{width:10rem;opacity:.56}.tool-hero::before{inset:6.5rem 1rem 1rem}
}
@media(max-width:640px){
  .live-shelf{padding-block:5rem}.live-shelf-head h2{font-size:clamp(2.8rem,13vw,4.7rem)}.live-shelf-head>div:last-child{border-left:0;border-top:1px solid rgba(21,103,100,.2);padding:1.2rem 0}
  .live-card{min-height:30rem;border-radius:1.35rem}.live-card h3{font-size:clamp(2rem,8.3vw,2.5rem)}.live-card-actions{align-items:stretch;flex-direction:column}.live-card .button{width:100%}
  .live-shelf-foot{align-items:flex-start;flex-direction:column}.proof-canvas{display:block}.proof-feature{min-height:39rem;border-radius:1.4rem}.proof-phone{right:-2rem;top:3rem;width:9rem;opacity:.42}.proof-list{margin-top:1rem}
  .tool-hero{min-height:auto;padding-top:8rem}.tool-hero h1{font-size:clamp(2.7rem,11.5vw,4rem)}.tool-price-panel{border-radius:1.25rem}.tool-compare,.tool-flow{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){.current-river path{animation:none}.live-card,.live-card::before,.proof-list a{transition:none}.live-card:hover,.proof-list a:hover{transform:none}}