/* Typography */
body {
    font-family: 'Inter', sans-serif;
}

.font-serif-elegant {
    font-family: 'Playfair Display', serif;
}

/* Core behavior */
html {
    scroll-behavior: smooth;
}

/* Animations */
@keyframes fade-in {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fade-in-down {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes scale-x {
    from {
        transform: scaleX(0);
    }
    to {
        transform: scaleX(1);
    }
}

.animate-fade-in {
    animation: fade-in 0.8s ease-out forwards;
    opacity: 0;
}

.animate-fade-in-down {
    animation: fade-in-down 0.8s ease-out forwards;
}

.animate-scale-x {
    animation: scale-x 1s ease-out forwards;
    animation-delay: 0.3s;
}

.delay-100 {
    animation-delay: 100ms;
}

.delay-200 {
    animation-delay: 200ms;
}

.delay-300 {
    animation-delay: 300ms;
}

.delay-500 {
    animation-delay: 500ms;
}

/* Scrollbar styles */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

::-webkit-scrollbar-track {
    background: #FAFAFA;
}

::-webkit-scrollbar-thumb {
    background: #E68A5C;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #d67a4c;
}

/* Hide scrollbar but keep functionality */
.scrollbar-hide::-webkit-scrollbar {
    display: none;
}

.scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Hero and media helpers */
.hero-image-container {
    mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
    -webkit-mask-image: linear-gradient(to bottom, black 80%, transparent 100%);
}

.mask-left {
    mask-image: linear-gradient(to right, black 60%, transparent 100%);
    -webkit-mask-image: linear-gradient(to right, black 60%, transparent 100%);
}

.mask-right {
    mask-image: linear-gradient(to left, black 60%, transparent 100%);
    -webkit-mask-image: linear-gradient(to left, black 60%, transparent 100%);
}

.hero-dog {
    max-width: clamp(140px, 18vw, 220px);
    max-height: clamp(160px, 28vh, 260px);
    transform: translateY(1.5rem) scale(2.5);
    transform-origin: bottom center;
}

.hero-dog--left {
    transform: translateY(1.5rem) scale(2.5) scaleX(-1);
}

.hero-glass {
    background: rgba(255, 255, 255, 0.55);
    border: 1px solid rgba(255, 255, 255, 0.65);
    box-shadow: 0 20px 60px rgba(31, 41, 55, 0.15);
    backdrop-filter: blur(18px) saturate(140%);
    -webkit-backdrop-filter: blur(18px) saturate(140%);
    border-radius: 32px;
}

/* Navigation */
.nav-brand-text {
    font-family: 'Inter', sans-serif;
    font-weight: 600;
    color: #1f2937;
    white-space: nowrap;
    letter-spacing: -0.01em;
    font-size: clamp(0.85rem, 3vw, 1rem);
}

/* Form helpers */
input[type="radio"]:checked,
input[type="checkbox"]:checked {
    accent-color: #E68A5C;
}

/* Rich text helpers */
.prose h3 {
    font-family: 'Playfair Display', serif;
    font-size: 1.5rem;
    font-weight: 600;
    color: #1F2937;
    margin-top: 1.5em;
    margin-bottom: 0.5em;
}

.prose p {
    margin-bottom: 1em;
    line-height: 1.75;
}

.prose strong {
    font-weight: 600;
    color: #111827;
}

.prose ul {
    list-style-type: disc;
    padding-left: 1.5em;
    margin-bottom: 1em;
}

.prose ol {
    list-style-type: decimal;
    padding-left: 1.5em;
    margin-bottom: 1em;
}

.prose blockquote {
    border-left: 4px solid #E5E7EB;
    padding-left: 1em;
    font-style: italic;
    color: #4B5563;
    margin-bottom: 1em;
}