Feature full-funnel conversion tracking service
This commit is contained in:
@@ -43,3 +43,12 @@ footer{background:radial-gradient(circle at 15% 0,rgba(112,64,232,.16),transpare
|
||||
|
||||
/* Keep the white CTA readable against the dark partnership section. */
|
||||
.dark .btn.pale{color:var(--ink)}
|
||||
|
||||
/* Featured full-funnel conversion service */
|
||||
.funnel-feature{position:relative;color:#fff;background:radial-gradient(circle at 82% 18%,rgba(155,101,255,.38),transparent 30%),linear-gradient(135deg,#15121c 0%,#20172f 58%,#37215d 100%);overflow:hidden}
|
||||
.funnel-feature:before{content:"";position:absolute;width:520px;height:520px;right:-180px;bottom:-300px;border:1px solid rgba(255,255,255,.12);border-radius:50%;box-shadow:0 0 0 70px rgba(255,255,255,.025),0 0 0 140px rgba(255,255,255,.018)}
|
||||
.funnel-head{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:100px;align-items:end;margin-bottom:72px}.funnel-head h2{margin:0;font:700 clamp(44px,4.8vw,70px)/1.18 "Songti SC","STSong",serif;letter-spacing:-.055em}.funnel-head>p{margin:0;color:#c9c2d2;font-size:18px;line-height:1.9}
|
||||
.funnel-track{position:relative;z-index:1;display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.funnel-track article{position:relative;min-height:190px;padding:26px 24px;display:flex;flex-direction:column;border:1px solid rgba(255,255,255,.17);border-radius:20px;background:rgba(255,255,255,.055);backdrop-filter:blur(10px)}.funnel-track article:last-child{color:var(--ink);background:linear-gradient(145deg,#a875ff,#c5a3ff);border-color:transparent;box-shadow:0 20px 55px rgba(143,86,238,.32)}.funnel-track span{color:#a875ff;font:600 16px Georgia}.funnel-track article:last-child span{color:#3b1a70}.funnel-track strong{margin:auto 0 8px;font-size:23px}.funnel-track small{color:#9d96a7}.funnel-track article:last-child small{color:#432b62}.funnel-track b{position:absolute;right:-21px;top:50%;z-index:3;width:30px;height:30px;display:grid;place-items:center;color:#fff;background:#6f38e8;border-radius:50%;transform:translateY(-50%)}
|
||||
.funnel-results{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:22px}.funnel-results span{padding:17px 20px;text-align:center;color:#ddd6e7;border:1px solid rgba(255,255,255,.13);border-radius:999px;background:rgba(255,255,255,.04)}
|
||||
@media(max-width:1040px){.funnel-head{gap:50px}.funnel-track{grid-template-columns:repeat(5,minmax(150px,1fr));overflow-x:auto;padding-bottom:8px}.funnel-track article{min-height:170px}.funnel-track b{display:none}}
|
||||
@media(max-width:760px){.funnel-head{grid-template-columns:1fr;gap:28px;margin-bottom:45px}.funnel-head>p{font-size:16px}.funnel-track{grid-template-columns:1fr;overflow:visible}.funnel-track article{min-height:135px}.funnel-results{grid-template-columns:1fr}.funnel-results span{border-radius:16px;text-align:left}}
|
||||
|
||||
Reference in New Issue
Block a user