.button-quiet { color: var(--muted); background: transparent; border-color: transparent; }
.button-quiet:hover { color: var(--text); background: rgba(255, 255, 255, 0.06); }
.ritual-section { padding-top: 30px; }
.ritual-card { position: relative; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 22px; padding: 25px 28px; overflow: hidden; background: linear-gradient(105deg, rgba(255, 255, 255, 0.06), rgba(230, 57, 70, 0.09)); border: 1px solid var(--border); border-radius: var(--radius); }
.ritual-card::after { position: absolute; right: -90px; bottom: -150px; width: 300px; height: 300px; content: ""; border: 1px solid var(--primary); border-radius: 50%; opacity: .13; box-shadow: 0 0 0 25px rgba(255,255,255,.02); }
.ritual-mark { position: relative; z-index: 1; width: 46px; height: 46px; display: grid; place-items: center; color: var(--primary); background: var(--surface-light); border-radius: 14px; font-size: 1.35rem; }
.ritual-copy { position: relative; z-index: 1; }
.ritual-copy h2 { max-width: 580px; margin: 4px 0 3px; font-size: 1.25rem; }
.ritual-copy p { margin: 0; color: var(--muted); font-size: .82rem; }
.ritual-actions { position: relative; z-index: 1; display: flex; gap: 8px; }
.ritual-actions .button { min-height: 40px; padding: 0 14px; font-size: .78rem; }
@media (prefers-reduced-motion: no-preference) { .ritual-card { animation: ritual-in .65s .12s ease both; } .ritual-mark { animation: ritual-spark 3s ease-in-out infinite; } }
@keyframes ritual-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@keyframes ritual-spark { 0%, 100% { transform: rotate(0) scale(1); } 50% { transform: rotate(8deg) scale(1.06); } }
@media (max-width: 650px) { .ritual-card { grid-template-columns: auto 1fr; padding: 21px; } .ritual-actions { grid-column: 1 / -1; } .ritual-actions .button { flex: 1; } }