/* Google Fonts Import */
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700&family=Crimson+Text:ital,wght@0,400;0,600;1,400&display=swap');

/* ============================================
   RESET (replaces what Tailwind's Preflight used
   to silently strip out via the CDN script)
   ============================================ */
*, *::before, *::after {
    box-sizing: border-box;
}
html, body, h1, h2, h3, h4, h5, h6, p, ul, ol, li, figure, blockquote {
    margin: 0;
    padding: 0;
}
h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
}
ul, ol {
    list-style: none;
}
a {
    color: inherit;
    text-decoration: none;
}
img, svg {
    display: block;
    max-width: 100%;
}
button {
    font: inherit;
    color: inherit;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
}

/* Base Styles */
body {
    font-family: Georgia, 'Times New Roman', serif;
    color: #003153;
    margin: 0;
}

/* Font Classes */
.font-headline {
    font-family: 'Cinzel', serif;
    letter-spacing: 0.02em;
    font-weight: 400;
}

.font-flourish {
    font-family: 'Crimson Text', serif;
    font-style: italic;
}

/* Color Classes */
.bg-navy { background-color: #003153; }
.text-navy { color: #003153; }
.bg-gold { background-color: #d4af37; }
.text-gold { color: #d4af37; }
.border-gold { border-color: #d4af37; }
.hover-gold:hover { background-color: #c49b2e; }
.bg-white { background-color: #ffffff; }
.text-white { color: #ffffff; }
.bg-gray-50 { background-color: #f9fafb; }
.text-gray-400 { color: #9ca3af; }

/* Hero Book Image */
.hero-book {
    max-width: 500px;
    filter: drop-shadow(0 20px 40px rgba(212, 175, 55, 0.3));
}
.hero-book-large {
    max-width: 900px;
    width: 100%;
    filter: drop-shadow(0 20px 40px rgba(212, 175, 55, 0.3));
}

/* Headshot Styling */
.headshot {
    border: 4px solid #d4af37;
    box-shadow: 0 10px 30px rgba(0, 49, 83, 0.2);
}

/* Subtle watercolor texture effect */
.watercolor-bg {
    position: relative;
    overflow: hidden;
}
.watercolor-bg::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background:
        radial-gradient(circle at 20% 50%, rgba(212, 175, 55, 0.08) 0%, transparent 50%),
        radial-gradient(circle at 80% 20%, rgba(212, 175, 55, 0.05) 0%, transparent 50%),
        radial-gradient(circle at 60% 80%, rgba(0, 49, 83, 0.03) 0%, transparent 50%);
    pointer-events: none;
}

html { scroll-behavior: smooth; }

.cta-button {
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(212, 175, 55, 0.3);
}
.cta-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(212, 175, 55, 0.4);
}

/* ============================================
   STATIC-SITE UTILITY CLASSES
   (replaces what the Tailwind CDN used to generate live)
   ============================================ */

/* layout */
.flex { display: flex; }
.grid { display: grid; }
.inline-block { display: inline-block; }
.relative { position: relative; }
.sticky { position: sticky; top: 0; z-index: 50; }
.flex-shrink-0 { flex-shrink: 0; }
.justify-between { justify-content: space-between; }
.justify-center { justify-content: center; }
.items-center { align-items: center; }
.items-start { align-items: flex-start; }
.text-center { text-align: center; }
.object-cover { object-fit: cover; }

/* gaps */
.gap-3 { gap: 0.75rem; }
.gap-4 { gap: 1rem; }
.gap-6 { gap: 1.5rem; }
.gap-12 { gap: 3rem; }
.gap-16 { gap: 4rem; }

/* containers */
.max-w-3xl { max-width: 48rem; }
.max-w-4xl { max-width: 56rem; }
.max-w-5xl { max-width: 64rem; }
.max-w-6xl { max-width: 72rem; }
.max-w-7xl { max-width: 80rem; }
.mx-auto { margin-left: auto; margin-right: auto; }
.px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
.px-16 { padding-left: 4rem; padding-right: 4rem; }
.py-4 { padding-top: 1rem; padding-bottom: 1rem; }
.py-6 { padding-top: 1.5rem; padding-bottom: 1.5rem; }
.py-8 { padding-top: 2rem; padding-bottom: 2rem; }
.py-20 { padding-top: 5rem; padding-bottom: 5rem; }
.p-10 { padding: 2.5rem; }
.mb-4 { margin-bottom: 1rem; }
.mb-12 { margin-bottom: 3rem; }
.mt-3 { margin-top: 0.75rem; }
.mt-6 { margin-top: 1.5rem; }

/* spacing between stacked children */
.space-y-2 > * + * { margin-top: 0.5rem; }
.space-y-4 > * + * { margin-top: 1rem; }
.space-y-6 > * + * { margin-top: 1.5rem; }
.space-y-8 > * + * { margin-top: 2rem; }
.space-y-10 > * + * { margin-top: 2.5rem; }

/* sizing */
.w-4 { width: 1rem; }
.h-4 { height: 1rem; }
.w-80 { width: 20rem; }
.h-80 { height: 20rem; }
.block { display: block; }

/* text sizes */
.text-sm { font-size: 0.875rem; line-height: 1.25rem; }
.text-base { font-size: 1rem; line-height: 1.5rem; }
.text-xl { font-size: 1.25rem; line-height: 1.75rem; }
.text-2xl { font-size: 1.5rem; line-height: 2rem; }
.text-3xl { font-size: 1.875rem; line-height: 2.25rem; }
.text-4xl { font-size: 2.25rem; line-height: 2.5rem; }
.text-5xl { font-size: 3rem; line-height: 1; }
.text-6xl { font-size: 3.75rem; line-height: 1; }
.text-7xl { font-size: 4.5rem; line-height: 1; }

/* text styling */
.uppercase { text-transform: uppercase; }
.tracking-wider { letter-spacing: 0.05em; }
.tracking-wide { letter-spacing: 0.025em; }
.leading-tight { line-height: 1.25; }
.leading-snug { line-height: 1.375; }
.leading-relaxed { line-height: 1.625; }
.font-bold { font-weight: 700; }

/* effects */
.rounded-full { border-radius: 9999px; }
.rounded-lg { border-radius: 0.5rem; }
.rounded-2xl { border-radius: 1rem; }
.shadow-lg { box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -4px rgba(0,0,0,0.1); }
.transition-colors { transition: color 0.15s ease; }

a.hover\:text-gold:hover { color: #d4af37; }

/* order (mobile-first default) */
.order-1 { order: 1; }
.order-2 { order: 2; }

/* grid default: single column on mobile */
.grid-2 { grid-template-columns: 1fr; }
.grid-5 { grid-template-columns: 1fr; }

/* additional utilities used on programs.html */
.min-h-screen { min-height: 100vh; }
.flex-col { flex-direction: column; }
.flex-grow { flex-grow: 1; }
.py-24 { padding-top: 6rem; padding-bottom: 6rem; }
.mb-10 { margin-bottom: 2.5rem; }
.space-y-7 > * + * { margin-top: 1.75rem; }
.leading-none { line-height: 1; }
.py-5 { padding-top: 1.25rem; padding-bottom: 1.25rem; }
.px-12 { padding-left: 3rem; padding-right: 3rem; }
.overflow-hidden { overflow: hidden; }
.z-10 { z-index: 10; }
.justify-start { justify-content: flex-start; }
.star-field { position: absolute; inset: 0; pointer-events: none; }
.border-t { border-top: 1px solid rgba(212, 175, 55, 0.2); }

/* ============================================
   RESPONSIVE (lg = 1024px, matches old Tailwind default)
   ============================================ */
@media (min-width: 1024px) {
    .lg\:py-32 { padding-top: 8rem; padding-bottom: 8rem; }
    .lg\:py-36 { padding-top: 9rem; padding-bottom: 9rem; }
    .lg\:text-left { text-align: left; }
    .lg\:text-2xl { font-size: 1.5rem; line-height: 2rem; }
    .lg\:text-3xl { font-size: 1.875rem; line-height: 2.25rem; }
    .lg\:text-5xl { font-size: 3rem; line-height: 1; }
    .lg\:text-6xl { font-size: 3.75rem; line-height: 1; }
    .lg\:text-7xl { font-size: 4.5rem; line-height: 1; }
    .lg\:w-96 { width: 24rem; }
    .lg\:h-96 { height: 24rem; }
    .lg\:justify-end { justify-content: flex-end; }
    .lg\:justify-start { justify-content: flex-start; }
    .lg\:order-1 { order: 1; }
    .lg\:order-2 { order: 2; }
    .grid-2 { grid-template-columns: 1fr 1fr; }
    .grid-5 { grid-template-columns: repeat(5, 1fr); }
    .lg\:col-span-2 { grid-column: span 2 / span 2; }
    .lg\:col-span-3 { grid-column: span 3 / span 3; }
}

@media (min-width: 1280px) {
    .xl\:text-5xl { font-size: 3rem; line-height: 1; }
    .xl\:text-6xl { font-size: 3.75rem; line-height: 1; }
}

/* Headshot burst animation */
.headshot-pulse-wrapper {
    position: relative;
    display: inline-block;
    cursor: pointer;
}
.gold-burst {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(1);
    width: 100%;
    height: 100%;
    border-radius: 50%;
    box-shadow: 0 0 0 0px rgba(212, 175, 55, 0);
    pointer-events: none;
    opacity: 0;
}
.headshot-pulse-wrapper.burst-active .gold-burst {
    animation: goldPulse 0.7s ease-out forwards;
}
@keyframes goldPulse {
    0%   { opacity: 1; box-shadow: 0 0 0 0px rgba(212,175,55,0.9), 0 0 0 0px rgba(212,175,55,0.5); }
    50%  { opacity: 1; box-shadow: 0 0 40px 30px rgba(212,175,55,0.6), 0 0 80px 60px rgba(212,175,55,0.2); }
    100% { opacity: 0; box-shadow: 0 0 60px 60px rgba(212,175,55,0), 0 0 120px 100px rgba(212,175,55,0); }
}