/* ============================================================
   WASAREC THEME — assets/css/wasarec.css
   ============================================================ */

* { box-sizing: border-box; }
body { font-family: "Montserrat", sans-serif; background: #f8faff; color: #0b0e54; }
h1, h2, h3, h4, h5, .font-headline { font-family: "Cormorant Garamond", serif; }
.material-symbols-outlined { font-variation-settings: "FILL" 0, "wght" 300, "GRAD" 0, "opsz" 24; display: inline-block; line-height: 1; vertical-align: middle; }

.signature-gradient { background: linear-gradient(135deg, #0b0e54 0%, #0096e1 100%); }
.premium-gradient   { background: linear-gradient(135deg, #0b0e54 0%, #0096e1 100%); }

.hover-lift { transition: all 0.35s cubic-bezier(0.165, 0.84, 0.44, 1); }
.hover-lift:hover { transform: translateY(-6px); box-shadow: 0 20px 48px -8px rgba(11,14,84,0.14); }

.cta-glow { transition: all 0.3s ease; }
.cta-glow:hover { box-shadow: 0 0 24px rgba(0,150,225,0.45); transform: scale(1.04); }

.img-cover    { width: 100%; height: 100%; object-fit: cover; display: block; }
.section-img  { width: 100%; height: auto; max-height: 520px; object-fit: cover; border-radius: 0.5rem; display: block; }
.card-img     { width: 100%; aspect-ratio: 16/9; object-fit: cover; display: block; }
.prose-img    { max-height: 480px; width: 100%; object-fit: cover; border-radius: 0.5rem; display: block; }

::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #f1f1f1; }
::-webkit-scrollbar-thumb { background: #0b0e54; border-radius: 10px; }

section { position: relative; }
.hero-section { min-height: 70vh; max-height: 90vh; }
.section-label { display: flex; align-items: center; gap: 0.75rem; }
.section-label::before { content: ""; display: block; width: 1.5rem; height: 2px; background: currentColor; opacity: 0.5; }

main { padding-top: 72px; }

.section-py { padding-top: 5rem; padding-bottom: 5rem; }
@media (min-width: 768px) { .section-py { padding-top: 7rem; padding-bottom: 7rem; } }

.img-frame { position: relative; overflow: hidden; border-radius: 0.5rem; }
.img-frame img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.6s ease; }
.img-frame:hover img { transform: scale(1.04); }

.hero-img-wrap { position: relative; width: 100%; overflow: hidden; max-height: 90vh; }
.hero-img-wrap img { width: 100%; height: 100%; object-fit: cover; display: block; }

section img.hero-bg, .hero-img { max-height: 100vh; }

.card-img-slot { width: 100%; aspect-ratio: 16/9; overflow: hidden; }
.card-img-slot img { width: 100%; height: 100%; object-fit: cover; display: block; }

img { max-width: 100%; height: auto; }
img[class*="h-full"] { height: 100%; }
img[class*="w-full"] { width: 100%; }
.overflow-hidden > img { max-height: inherit; }

a, button { transition: all 0.22s ease; }

.btn-primary {
    display: inline-flex; align-items: center; gap: 0.5rem;
    background: #0b0e54; color: #fff;
    padding: 0.75rem 1.75rem; border-radius: 9999px;
    font-size: 0.75rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
}
.btn-primary:hover { opacity: 0.88; transform: translateY(-2px); box-shadow: 0 12px 32px rgba(11,14,84,0.22); }

.btn-secondary {
    display: inline-flex; align-items: center; gap: 0.5rem;
    border: 2px solid #0096e1; color: #0096e1;
    padding: 0.72rem 1.7rem; border-radius: 9999px;
    font-size: 0.75rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
}
.btn-secondary:hover { background: #0096e1; color: #fff; }

/* Hero slideshow */
.hero-slide { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: 0; transition: opacity 1.4s ease-in-out; }
.hero-slide.active { opacity: 0.72; }
.slide-dot { width: 8px; height: 8px; border-radius: 9999px; background: rgba(255,255,255,0.4); border: none; cursor: pointer; transition: all 0.3s ease; padding: 0; }
.slide-dot.active { background: #fff; width: 24px; }
.slide-dot:hover { background: rgba(255,255,255,0.75); }

/* Story cards */
.story-card .story-text { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
