2 lines
1.5 KiB
CSS
2 lines
1.5 KiB
CSS
.ticket-hero .container{min-height:420px;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))}.ticket-tip{display:grid;place-items:center;text-align:center;background:linear-gradient(145deg,var(--green-dark),var(--green));color:#fff}.ticket-tip span{width:88px;height:88px;border-radius:50%;display:grid;place-items:center;color:var(--red);background:#fffdf8f0;font-size:28px;font-weight:900}.ticket-tip p{max-width:360px;margin:18px 0 0;color:#ffffffdb;line-height:1.8}.ticket-layout{display:grid;grid-template-columns:minmax(0,720px) 320px;gap:26px;align-items:start}.ticket-form{max-width:none}.ticket-form textarea{min-height:150px;padding-top:16px;border-radius:18px;resize:vertical}.ticket-side{padding:26px;border:1px solid var(--line);border-radius:18px;background:#fffdf8d1;box-shadow:0 20px 54px #39302414}.ticket-side p{color:var(--muted);line-height:1.8}.ticket-side a{display:inline-flex;margin-top:10px;color:var(--red);font-weight:800}.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:900px){.ticket-layout{grid-template-columns:1fr}}@media(max-width:720px){.hero-copy{padding-left:0}.hero-copy:before{display:none}}
|