/* Zubonaru Apps — site styles (generated from the design components) */
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--color-bg); color: var(--color-text); font-size: 17px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
html[data-lang="en"] [lang="ja"] { display: none !important; }
html[data-lang="ja"] [lang="en"] { display: none !important; }
[lang="ja"] { font-family: "Noto Sans JP", "Figtree", sans-serif; line-height: 1.9; letter-spacing: .01em; }
[lang="ja"] h1, [lang="ja"] h2, [lang="ja"] h3, h1 [lang="ja"], h2 [lang="ja"], h3 [lang="ja"] { font-family: "Noto Sans JP", sans-serif; font-weight: 700; letter-spacing: 0; line-height: 1.4; }
.jp { font-family: "Noto Sans JP", sans-serif; }
a { color: var(--color-accent-700); }
a:hover { color: var(--color-accent-600); }
::selection { background: var(--color-accent-200); }
html[data-motion="off"] [data-bell-part] { animation: none !important; }
@keyframes zb-strike { 0% { transform: translateX(26px); opacity: 0 } 35% { transform: translateX(26px); opacity: 1 } 60% { transform: translateX(0) } 70% { transform: translateX(7px) } 100% { transform: translateX(0) } }
@keyframes zb-ring { 0% { transform: rotate(0) } 15% { transform: rotate(-2.2deg) } 35% { transform: rotate(1.6deg) } 55% { transform: rotate(-.9deg) } 75% { transform: rotate(.4deg) } 100% { transform: rotate(0) } }
@media (prefers-reduced-motion: reduce) { [data-bell-part] { animation: none !important } }
@media (max-width: 900px) { [data-col2] { grid-template-columns: 1fr !important } [data-hero] { grid-template-columns: 1fr !important } [data-values] { grid-template-columns: 1fr 1fr !important } [data-navlinks] { display: none !important } }
@media (max-width: 620px) { [data-values] { grid-template-columns: 1fr !important } [data-appcard] { grid-template-columns: 1fr !important } [data-contact] { grid-template-columns: 1fr !important } }
@media (max-width: 900px) { [data-col2] { grid-template-columns: 1fr !important } [data-facts] { position: static !important } [data-navlinks] { display: none !important } }
@media (max-width: 900px) { [data-navlinks] { display: none !important } }
[lang="ja"] { font-family: "Noto Sans JP", "Figtree", sans-serif; line-height: 1.9; }
[lang="ja"] h1, h1 [lang="ja"] { font-family: "Noto Sans JP", sans-serif; font-weight: 700; letter-spacing: 0 }

/* interaction states */
.x1:hover { background:var(--color-accent-100) !important; color:var(--color-accent-800) !important }
.x2:hover { background:var(--color-accent) !important; color:var(--color-bg) !important }
.x3:hover { background:var(--color-accent-600) !important; color:var(--color-bg) !important }
.x4:hover { background:var(--color-neutral-200) !important; color:var(--color-text) !important }
.x5:hover { color:var(--color-accent-300) !important }
.x6:hover { color:var(--color-accent-700) !important }