2 lines
1.4 KiB
CSS
2 lines
1.4 KiB
CSS
.download-hero .container{min-height:440px;padding-top:74px;padding-bottom:74px}.hero-copy{position:relative;padding-left:28px}.hero-copy:before{content:"";position:absolute;left:0;top:58px;width:4px;height:132px;border-radius:999px;background:linear-gradient(180deg,var(--red),var(--gold))}.detail-actions{display:flex;gap:14px;margin-top:30px;flex-wrap:wrap}.qr-card{display:grid;place-items:center;text-align:center}.qr-box{width:170px;height:170px;padding:16px;border-radius:24px;background:linear-gradient(90deg,var(--green) 12px,transparent 12px) 0 0 / 32px 32px,linear-gradient(var(--green) 12px,transparent 12px) 0 0 / 32px 32px,#fffdf8;border:1px solid var(--line);display:grid;place-items:center;box-shadow:inset 0 0 0 12px #fffdf8}.qr-box span{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;color:#fff;background:var(--red);font-weight:900}.qr-card p,.download-card p{color:var(--muted);line-height:1.8}.download-card{transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease}.download-card:hover{border-color:#c492456b}.tilt-card{transform:perspective(900px) rotateX(var(--tilt-x, 0deg)) rotateY(var(--tilt-y, 0deg)) translateY(var(--lift, 0));transition:transform .18s ease,box-shadow .24s ease,border-color .24s ease}.tilt-card:hover{--lift: -6px}@media(max-width:720px){.hero-copy{padding-left:0}.hero-copy:before{display:none}}
|