/* TailwindCSS CDN - For production, compile with PostCSS */
@import url('https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css');

/* Custom Tailwind Extensions */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Aspect Ratios */
.aspect-square {
    aspect-ratio: 1 / 1;
}

.aspect-video {
    aspect-ratio: 16 / 9;
}

.aspect-3-4 {
    aspect-ratio: 3 / 4;
}

.aspect-4-3,
.aspect-\[4\/3\] {
    aspect-ratio: 4 / 3;
}

.aspect-\[4\/5\] {
    aspect-ratio: 4 / 5;
}

/* Prose styles for content */
.prose {
    max-width: 65ch;
}

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

.prose h2 {
    font-size: 1.5em;
    font-weight: 700;
    margin-top: 2em;
    margin-bottom: 1em;
}

.prose h3 {
    font-size: 1.25em;
    font-weight: 600;
    margin-top: 1.6em;
    margin-bottom: 0.6em;
}

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

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

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