| body { | |
| padding: 0; | |
| font-family: -apple-system, BlinkMacSystemFont, "Arial", sans-serif; | |
| } | |
| h1 { | |
| font-size: 16px; | |
| margin-top: 0; | |
| } | |
| p { | |
| color: rgb(107, 114, 128); | |
| font-size: 15px; | |
| margin-bottom: 10px; | |
| margin-top: 5px; | |
| } | |
| .card { | |
| max-width: 620px; | |
| margin: 0 auto; | |
| padding: 16px; | |
| border: 1px solid lightgray; | |
| border-radius: 16px; | |
| } | |
| .card p:last-child { | |
| margin-bottom: 0; | |
| } | |
| .hovered-element { | |
| transition: transform 0.3s ease, box-shadow 0.3s ease; | |
| } | |
| .hovered-element:hover { | |
| transform: translateY(-5px); | |
| box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); | |
| } | |
| .btn-primary { | |
| background: var(--vlc-navy); | |
| color: #fff; | |
| padding: 0.75rem 2rem; | |
| border-radius: 0.375rem; | |
| font-size: 1.125rem; | |
| font-weight: 600; | |
| transition: all 0.3s ease; | |
| } | |
| .btn-primary:hover { | |
| background: var(--vlc-navy-700); | |
| transform: translateY(-1px); | |
| box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); | |
| } | |