/*
Theme Name: BIGGU NIKUDON
Theme URI: https://biggunikudon.id/
Author: BIGGU NIKUDON Team
Author URI: https://biggunikudon.id/
Description: Theme WordPress premium, modern, dan sangat cepat untuk BIGGU NIKUDON. Terinspirasi dari estetika arsitektur kayu tradisional Jepang (Machiya, Shoji, Noren, Kawara).
Version: 1.0.22
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: biggu-nikudon
*/

/* Custom variables and base styles matching original site */
:root {
  --background: 24 71% 95%;
  --foreground: 0 0% 6%;
  --card: 0 0% 100%;
  --card-foreground: 0 0% 6%;
  --primary: 0 100% 56%;
  --primary-foreground: 0 0% 100%;
  --secondary: 53 100% 50%;
  --secondary-foreground: 0 0% 6%;
  --muted: 24 40% 90%;
  --muted-foreground: 0 0% 32%;
  --accent: 53 100% 50%;
  --accent-foreground: 0 0% 6%;
  --destructive: 0 84% 50%;
  --destructive-foreground: 0 0% 100%;
  --border: 24 30% 84%;
  --input: 24 30% 84%;
  --ring: 0 100% 56%;
  --radius: 1rem;
}

body {
  font-family: 'Zen Kaku Gothic New', system-ui, sans-serif;
  background-color: hsl(var(--background));
  color: hsl(var(--foreground));
  overflow-x: clip;
}

.font-display {
  font-family: 'Baloo 2', 'Zen Kaku Gothic New', sans-serif;
  letter-spacing: -0.01em;
}

/* Traditional Japanese architecture motifs */
.asanoha {
  background-image:
    linear-gradient(30deg, rgba(0,0,0,.06) 1px, transparent 1px),
    linear-gradient(150deg, rgba(0,0,0,.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,0,0,.06) 1px, transparent 1px);
  background-size: 26px 45px;
}
.shoji-grid {
  background-image:
    linear-gradient(to right, rgba(0,0,0,.75) 3px, transparent 3px),
    linear-gradient(to bottom, rgba(0,0,0,.75) 3px, transparent 3px);
  background-size: 25% 33.333%;
}
.kawara-roof {
  height: 26px;
  background:
    radial-gradient(circle at 50% 120%, #000 55%, transparent 56%) 0 0/26px 26px repeat-x;
}
.noren-hem::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: -14px;
  height: 16px;
  background: radial-gradient(circle at 50% 0%, hsl(var(--primary)) 58%, transparent 59%) 0 0/28px 28px repeat-x;
}
.marquee-track {
  animation: marquee 26s linear infinite;
}
@keyframes marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
.ken-burns {
  animation: kb 24s ease-in-out infinite alternate;
}
@keyframes kb {
  from { transform: scale(1.06) translate3d(0,0,0); }
  to { transform: scale(1.22) translate3d(-2%, -2%, 0); }
}
@media (prefers-reduced-motion: reduce) {
  .marquee-track, .ken-burns { animation: none !important; }
}