/* ============================================================
   KNIVES — Japanese Knives World theme
   Steel · Carbon · Lacquer red · Wasabi green accents
   ============================================================ */

.knives-themed {
    --knives-steel:      #C7CED6;
    --knives-steel-dark: #8B95A1;
    --knives-carbon:     #1A1D21;
    --knives-ink:        #0D0F12;
    --knives-lacquer:    #C23B22;
    --knives-lacquer-dk: #8C1D0A;
    --knives-wasabi:     #8FA85E;
    --knives-bamboo:     #C9A96E;
    --knives-washi:      #F5F0E6;
    --knives-sumi:       #2A2D32;

    --spark-c1: var(--knives-carbon);
    --spark-c2: var(--knives-lacquer);
    --spark-c3: var(--knives-steel);
}

/* 1) TYPOGRAPHY — editorial serif + clean sans */
.knives-themed .font-display,
.knives-themed h1, .knives-themed h2, .knives-themed h3 {
    font-family: 'Playfair Display', 'EB Garamond', Georgia, serif;
    letter-spacing: -0.015em;
}
.knives-themed {
    font-feature-settings: 'liga' 1, 'kern' 1;
}

/* 2) SECTION ORDER — knives-landing reorders pillars */
.knives-themed .niche-landing { display: flex; flex-direction: column; }
.knives-themed [data-section="hero"]        { order: 1; }
.knives-themed [data-section="pilares"]     { order: 2; }
.knives-themed [data-section="featured"]    { order: 3; }
.knives-themed [data-section="roadmap"]     { order: 4; }
.knives-themed [data-section="mostread"]    { order: 5; }
.knives-themed [data-section="concepts"]    { order: 6; }
.knives-themed [data-section="tools"]       { order: 7; }
.knives-themed [data-section="cta-final"]   { order: 8; }
.knives-themed [data-section="faq"]         { order: 9; }
.knives-themed [data-section="newsletter"]  { order: 10; }

/* 3) HERO SCENE — real Japanese knife photo, subtle float */
.knives-hero-scene {
    position: relative; width: 100%; height: 100%;
    display: flex; align-items: center; justify-content: center;
    pointer-events: none;
}
.knives-hero-img {
    position: relative; z-index: 2;
    width: auto; height: 76%; max-height: 460px;
    object-fit: contain;
    filter: drop-shadow(0 24px 40px rgba(26, 29, 33, 0.35));
    transform-origin: 50% 92%;
    animation: knives-blade-float 6s ease-in-out infinite;
    will-change: transform;
}
@keyframes knives-blade-float {
    0%, 100% { transform: translateY(0)    rotate(-2deg); }
    50%      { transform: translateY(-10px) rotate(2deg); }
}
.knives-glow {
    position: absolute; inset: 0;
    background:
        radial-gradient(ellipse 60% 50% at 50% 50%, rgba(199, 206, 214, 0.55), transparent 60%),
        radial-gradient(ellipse 40% 30% at 50% 80%, rgba(194, 59, 34, 0.18), transparent 65%);
    animation: knives-glow-breathe 5s ease-in-out infinite;
    pointer-events: none;
}
@keyframes knives-glow-breathe {
    0%, 100% { opacity: 0.8; }
    50%      { opacity: 1; }
}

/* Floating sakura petals */
.knives-petal {
    position: absolute;
    width: 22px; height: 22px;
    background: radial-gradient(ellipse at 30% 30%, #FFD6E0 0%, #F5A3B8 60%, #D9748D 100%);
    clip-path: path("M11 2 Q14 8 20 10 Q14 12 11 20 Q8 12 2 10 Q8 8 11 2 Z");
    opacity: 0.85;
    animation: knives-petal-fall 8s linear infinite;
}
.knives-petal--1 { top: -8%; left: 18%; animation-delay: 0s; animation-duration: 9s; }
.knives-petal--2 { top: -12%; left: 52%; animation-delay: 2.5s; animation-duration: 11s; }
.knives-petal--3 { top: -6%; left: 76%; animation-delay: 5s; animation-duration: 10s; }

@keyframes knives-petal-fall {
    0%   { transform: translate3d(0, 0, 0) rotate(0); opacity: 0; }
    10%  { opacity: 0.85; }
    100% { transform: translate3d(-60px, 110vh, 0) rotate(540deg); opacity: 0; }
}

/* Sumi ink splash (accent) */
.knives-ink-splash {
    position: absolute; left: 6%; top: 22%;
    width: 160px; height: 110px;
    background: radial-gradient(ellipse at 40% 50%, rgba(26, 29, 33, 0.2), transparent 65%);
    filter: blur(4px);
    animation: knives-ink-breathe 5s ease-in-out infinite;
}
@keyframes knives-ink-breathe {
    0%, 100% { transform: scale(1); opacity: 0.6; }
    50%      { transform: scale(1.08); opacity: 0.85; }
}

/* 4) BUTTONS — lacquer red accent */
.knives-themed .brand-btn {
    background: linear-gradient(135deg, var(--knives-lacquer) 0%, var(--knives-lacquer-dk) 100%);
    color: #fff;
    letter-spacing: 0.02em;
}
.knives-themed .brand-btn:hover { filter: brightness(1.06); }

/* 5) CATEGORY CHIP — washi paper look */
.knives-themed .spark-cat-chip,
.knives-themed [style*="color-mix"] {
    background-color: color-mix(in srgb, var(--knives-lacquer) 10%, var(--knives-washi)) !important;
}

/* 6) HEADINGS — use carbon ink */
.knives-themed h1, .knives-themed h2 {
    color: var(--knives-ink);
}
html.dark .knives-themed h1, html.dark .knives-themed h2 {
    color: var(--knives-washi);
}

/* 7) RESPONSIVE — scale down knife on mobile */
@media (max-width: 1023px) {
    .knives-hero-img { max-height: 360px; }
    .knives-ink-splash { display: none; }
}
@media (max-width: 639px) {
    .knives-hero-img { max-height: 280px; }
    .knives-petal--3 { display: none; }
}

/* 8) REDUCED MOTION — respect preference */
@media (prefers-reduced-motion: reduce) {
    .knives-hero-img, .knives-glow, .knives-petal, .knives-ink-splash {
        animation: none !important;
    }
    .knives-petal { opacity: 0.4; }
}

/* 9) FOOTER — subtle steel line */
.knives-themed footer { border-top: 2px solid var(--knives-steel); }

/* 9.1) NEWSLETTER section — force dark bg, white text (defensive fallback in case --spark-c1/c2 aren't picked up) */
.knives-themed [data-section="newsletter"] {
    background: linear-gradient(135deg, var(--knives-carbon) 0%, var(--knives-lacquer-dk) 100%) !important;
    color: #ffffff !important;
}
.knives-themed [data-section="newsletter"] h2,
.knives-themed [data-section="newsletter"] h3,
.knives-themed [data-section="newsletter"] p,
.knives-themed [data-section="newsletter"] span,
.knives-themed [data-section="newsletter"] div {
    color: inherit;
}
.knives-themed [data-section="newsletter"] .spark-gradient-text {
    background: linear-gradient(90deg, #FFD180, #F5F0E6);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}
/* Also: CTA-final section keeps readable contrast if dark bg applied */
.knives-themed [data-section="cta-final"] { color: inherit; }

/* 10) LINKS in articles — lacquer underline */
.knives-themed .prose-article a {
    color: var(--knives-lacquer);
    text-decoration-color: color-mix(in srgb, var(--knives-lacquer) 45%, transparent);
}