/* =============================================================================
   FujinoKintarou Theme — Custom CSS
   (Tailwind utilities are loaded via CDN; this file holds custom styles only)
   ========================================================================== */

html {
    scroll-behavior: smooth;
    scroll-padding-top: 86px;
}

body {
    font-family: 'Noto Sans JP', sans-serif;
    background: #0a0e17;
    color: #f9fafb;
    -webkit-font-smoothing: antialiased;
}

/* ===== NOISE TEXTURE OVERLAY ===== */
body::after {
    content: '';
    position: fixed;
    inset: 0;
    z-index: 9999;
    pointer-events: none;
    opacity: 0.035;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ===== SECTION GRADIENTS ===== */
.section-gradient-warm {
    background: linear-gradient(180deg, #111827 0%, #1a1020 50%, #111827 100%);
}

.section-gradient-cool {
    background: linear-gradient(180deg, #1f2937 0%, #172030 50%, #1f2937 100%);
}

/* ===== GLASSMORPHISM CARDS ===== */
.glass-card {
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.06);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.04),
        0 20px 50px -12px rgba(0, 0, 0, 0.5);
    transition: transform 0.5s cubic-bezier(0.22, 1, 0.36, 1),
                box-shadow 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

.glass-card:not(.no-hover):hover {
    transform: translateY(-8px);
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.08),
        0 30px 70px -15px rgba(220, 38, 38, 0.12);
}

/* ===== IMAGE HOVER ZOOM ===== */
.img-zoom {
    overflow: hidden;
}

.img-zoom img {
    transition: transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}

.img-zoom:hover img {
    transform: scale(1.08);
}

/* ===== HERO KEN BURNS ===== */
@keyframes kenBurns {
    0%   { transform: scale(1)    translate(0, 0); }
    50%  { transform: scale(1.08) translate(-1%, -1%); }
    100% { transform: scale(1)    translate(0, 0); }
}

.ken-burns {
    animation: kenBurns 20s ease-in-out infinite;
}

/* ===== SCROLL ANIMATIONS ===== */
[data-animate] {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1),
                transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

[data-animate].is-visible {
    opacity: 1;
    transform: translateY(0);
}

[data-animate-left] {
    opacity: 0;
    transform: translateX(-60px);
    transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1),
                transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

[data-animate-left].is-visible {
    opacity: 1;
    transform: translateX(0);
}

[data-animate-right] {
    opacity: 0;
    transform: translateX(60px);
    transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1),
                transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

[data-animate-right].is-visible {
    opacity: 1;
    transform: translateX(0);
}

/* ===== HEADING CHARACTER ANIMATION ===== */
.char-animate span {
    display: inline-block;
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.4s ease, transform 0.4s ease;
}

.char-animate.is-visible span {
    opacity: 1;
    transform: translateY(0);
}

/* ===== COUNT UP ===== */
.count-up {
    font-variant-numeric: tabular-nums;
}

/* ===== PARALLAX ===== */
.parallax-img {
    transition: transform 0.1s linear;
    will-change: transform;
}

/* ===== FAQ ACCORDION ===== */
details summary::-webkit-details-marker {
    display: none;
}

details summary {
    list-style: none;
}

/* ===== NEWS PAGE ===== */
.news-filter.is-active {
    background-color: #dc2626;
    color: #fff;
    border-color: #dc2626;
}

/* ===== WP-PageNavi ===== */
.wp-pagenavi {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.4rem;
    flex-wrap: wrap;
    margin-top: 4rem;
    font-family: 'Cormorant Garamond', serif;
}

@media (min-width: 768px) {
    .wp-pagenavi { margin-top: 5rem; gap: 0.5rem; }
}

.wp-pagenavi .pages {
    display: inline-flex;
    align-items: center;
    height: 2.5rem;
    padding: 0 1rem;
    font-size: 0.75rem;
    color: #6b7280;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    font-weight: 700;
    margin-right: 0.5rem;
    border-right: 1px solid #1a1f2e;
}

.wp-pagenavi a,
.wp-pagenavi span:not(.pages) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.5rem;
    height: 2.5rem;
    padding: 0 0.75rem;
    font-size: 0.875rem;
    font-weight: 600;
    border-radius: 9999px;
    transition: all 0.2s ease;
    text-decoration: none;
    line-height: 1;
}

.wp-pagenavi a { color: #9ca3af; }
.wp-pagenavi a:hover { background-color: #1a1f2e; color: #fff; }
.wp-pagenavi .current { background-color: #dc2626; color: #fff; font-weight: 700; box-shadow: 0 4px 14px rgba(220,38,38,0.3); }
.wp-pagenavi .extend { color: #4b5563; cursor: default; }
.wp-pagenavi .first,
.wp-pagenavi .last,
.wp-pagenavi .previouspostslink,
.wp-pagenavi .nextpostslink {
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-size: 0.7rem;
    padding: 0 1rem;
}

.wp-pagenavi .previouspostslink:hover,
.wp-pagenavi .nextpostslink:hover,
.wp-pagenavi .first:hover,
.wp-pagenavi .last:hover {
    color: #dc2626;
    background-color: transparent;
}

/* ===== ARTICLE PROSE STYLES (single-news) ===== */
.prose-article {
    font-family: 'Noto Sans JP', sans-serif;
    color: #d1d5db;
    line-height: 1.9;
    font-size: 16px;
}

.prose-article p { margin-bottom: 1.5em; }

.prose-article h2 {
    font-family: 'Shippori Mincho', serif;
    font-size: 1.75em;
    font-weight: 800;
    color: #fff;
    margin: 2em 0 0.8em;
    padding-bottom: 0.4em;
    border-bottom: 2px solid #dc2626;
}

.prose-article h3 {
    font-family: 'Shippori Mincho', serif;
    font-size: 1.35em;
    font-weight: 700;
    color: #fff;
    margin: 1.8em 0 0.6em;
    padding-left: 0.8em;
    border-left: 4px solid #dc2626;
}

.prose-article a { color: #dc2626; border-bottom: 1px solid rgba(220,38,38,0.4); transition: all 0.2s; }
.prose-article a:hover { color: #fff; border-bottom-color: #fff; }
.prose-article strong { color: #fff; font-weight: 700; }
.prose-article em { font-style: italic; color: #fecaca; }

.prose-article ul,
.prose-article ol { margin: 1.2em 0; padding-left: 1.5em; }
.prose-article li { margin-bottom: 0.6em; }
.prose-article ul li::marker { color: #dc2626; }

.prose-article blockquote {
    margin: 2em 0;
    padding: 1.5em 1.8em;
    background: rgba(255,255,255,0.03);
    border-left: 4px solid #dc2626;
    border-radius: 0 8px 8px 0;
    font-style: italic;
    color: #e5e7eb;
}

.prose-article blockquote p:last-child { margin-bottom: 0; }

.prose-article img { border-radius: 12px; margin: 2em 0; box-shadow: 0 20px 40px rgba(0,0,0,0.4); }
.prose-article figure { margin: 2em 0; }
.prose-article figcaption { text-align: center; font-size: 0.85em; color: #9ca3af; margin-top: 0.5em; font-family: 'Cormorant Garamond', serif; font-style: italic; }
.prose-article hr { margin: 3em 0; border: none; border-top: 1px solid #374151; }
.prose-article code { background: rgba(255,255,255,0.06); padding: 0.15em 0.4em; border-radius: 4px; font-size: 0.9em; }

.prose-article table { width: 100%; margin: 2em 0; border-collapse: collapse; }
.prose-article table th,
.prose-article table td { padding: 0.8em 1em; border-bottom: 1px solid #374151; text-align: left; }
.prose-article table th { background: rgba(255,255,255,0.04); color: #fff; font-weight: 700; }

/* ===== REDUCED MOTION ===== */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
    [data-animate],
    [data-animate-left],
    [data-animate-right] {
        opacity: 1 !important;
        transform: none !important;
    }
    .char-animate span {
        opacity: 1 !important;
        transform: none !important;
    }
    .ken-burns {
        animation: none;
    }
}

/* ===== BELOW-THE-FOLD PERFORMANCE ===== */
#menu, #news, #faq, #reserve {
    content-visibility: auto;
    contain-intrinsic-size: auto 600px;
}

/* ===== CUSTOM SCROLLBAR ===== */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #0a0e17; }
::-webkit-scrollbar-thumb { background: #374151; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #dc2626; }
