/* Custom styles beyond Tailwind */
.aspect-w-1 {
    position: relative;
    padding-bottom: calc(var(--tw-aspect-h) / var(--tw-aspect-w) * 100%);
}

.aspect-w-1 > * {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.aspect-w-1 {
    --tw-aspect-w: 1;
}

.aspect-h-1 {
    --tw-aspect-h: 1;
}

/* Custom animations */
.transition-transform {
    transition-property: transform;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.duration-200 {
    transition-duration: 200ms;
}

.-rotate-180 {
    --tw-rotate: -180deg;
    transform: rotate(var(--tw-rotate));
}

/* Prose styles for rich text */
.prose {
    max-width: 65ch;
    color: #374151;
}

.prose p {
    margin-top: 1.25em;
    margin-bottom: 1.25em;
}

.prose a {
    color: #2563eb;
    text-decoration: underline;
    font-weight: 500;
}

.prose strong {
    font-weight: 600;
}

.prose ul {
    margin-top: 1.25em;
    margin-bottom: 1.25em;
    list-style-type: disc;
    padding-left: 1.625em;
}

.prose li {
    margin-top: 0.5em;
    margin-bottom: 0.5em;
}

.max-w-none {
    max-width: none;
}