/* System font stack — works offline; kanji render via OS Japanese fonts */
  :root {
    --serif: 'Hiragino Mincho ProN', 'Yu Mincho', 'Noto Serif JP', Georgia, serif;
    --sans: 'Hiragino Kaku Gothic ProN', 'Yu Gothic', 'Noto Sans JP', system-ui, sans-serif;
  }

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { background: #1C1B19; font-family: var(--sans); overflow-x: hidden; }

/* NAV */
nav {
  position: fixed; top: 0; left: 0; right: 0; height: 68px;
  background: rgba(28,27,25,0.9); backdrop-filter: blur(14px);
  z-index: 100; display: flex; align-items: center; padding: 0 40px;
  border-bottom: 1px solid rgba(184,169,138,0.07);
  transition: background 0.4s, border-color 0.4s;
}
nav.scrolled { background: rgba(28,27,25,0.9); backdrop-filter: blur(14px); border-color: rgba(184,169,138,0.14); }
.nav-logo { display: flex; align-items: center; gap: 11px; text-decoration: none; flex-shrink: 0; }
.nav-logo img { height: 34px; width: auto; opacity: 0.9; }
.nav-logo span { font-family: var(--serif); color: #F4F1EA; font-size: 12.5px; letter-spacing: 0.14em; font-weight: 500; white-space: nowrap; opacity: 0.9; }
.nav-links { display: flex; flex: 1; align-items: center; justify-content: center; gap: 28px; }
.nav-links a { color: rgba(244,241,234,0.72); font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; text-decoration: none; font-family: var(--sans); transition: color 0.2s; }
.nav-links a:hover { color: #F4F1EA; }
.nav-end { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }
.lang-btn { background: none; border: none; cursor: pointer; font-family: var(--sans); font-size: 10px; letter-spacing: 0.18em; color: rgba(244,241,234,0.35); padding: 4px 8px; transition: color 0.2s; }
.lang-btn.active, .lang-btn:hover { color: #F4F1EA; }
.lang-sep { color: rgba(244,241,234,0.2); font-size: 11px; user-select: none; }
.hamburger { display: none; flex-direction: column; gap: 5px; align-items: center; justify-content: center; width: 36px; height: 36px; background: none; border: none; cursor: pointer; padding: 6px; flex-shrink: 0; }
.hb { width: 20px; height: 1px; background: #F4F1EA; transition: transform 0.25s ease, opacity 0.18s ease; }

/* MOBILE MENU */
.mob-menu { display: none; position: fixed; inset: 0; z-index: 99; background: #1C1B19; flex-direction: column; align-items: center; justify-content: center; gap: 36px; padding-top: 68px; }
.mob-menu.open { display: flex; }
.mob-menu a { color: rgba(244,241,234,0.85); font-size: 13px; letter-spacing: 0.25em; text-transform: uppercase; text-decoration: none; font-family: var(--serif); }
.mob-sep { width: 40px; height: 1px; background: rgba(184,169,138,0.25); }

/* PARALLAX SECTIONS */
.parallax { background-attachment: fixed; }

/* FADE TOP */
.img-section { position: relative; }
.img-section::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0;
  height: 18vh;
  background: linear-gradient(to bottom, #1C1B19, transparent);
  pointer-events: none; z-index: 1;
}
.img-section .inner { position: relative; z-index: 2; max-width: 1100px; margin: 0 auto; }

/* SECTION BANDS */
.band { padding: 42px 64px 38px; background: #1C1B19; }
.band-eyebrow { display: flex; align-items: baseline; gap: 20px; margin-bottom: 16px; }
.band-rule { width: 22px; height: 1px; background: #8B1F1F; margin-bottom: 9px; }
.band-label { font-family: var(--sans); font-size: 9px; letter-spacing: 0.32em; text-transform: uppercase; color: #B8A98A; }
.band-kanji { font-family: var(--serif); font-size: 20px; color: rgba(244,241,234,0.25); letter-spacing: 0.2em; }
.band-title { font-family: var(--serif); font-size: 30px; font-weight: 400; color: #F4F1EA; line-height: 1.35; }

/* CARDS */
.card { background: #F4F1EA; border-left: 3px solid #1A2E7A; padding: 48px 56px; }
.card p { font-family: var(--sans); font-size: 14.5px; font-weight: 300; color: #1C1B19; line-height: 1.95; }
.card p + p { margin-top: 18px; }
.card-italic { font-style: italic; color: rgba(28,27,25,0.65) !important; font-size: 13.5px !important; }

/* PILLARS */
.pillars { display: grid; grid-template-columns: repeat(3, 1fr); max-width: 680px; margin-top: 2px; }
.pillar { background: rgba(26,46,122,0.92); padding: 28px 32px; }
.pillar-rule { width: 20px; height: 1px; background: #8B1F1F; margin-bottom: 14px; }
.pillar h3 { font-family: var(--serif); font-size: 15px; font-weight: 500; color: #F4F1EA; margin-bottom: 10px; letter-spacing: 0.1em; }
.pillar p { font-family: var(--sans); font-size: 12.5px; font-weight: 300; color: rgba(244,241,234,0.72); line-height: 1.85; }

/* PRATICA SPLIT */
.pratica-split { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; max-width: 900px; }
.equip-panel { background: #1C1B19; display: flex; flex-direction: column; }
.equip-header { padding: 22px 32px; border-bottom: 1px solid rgba(184,169,138,0.14); font-family: var(--sans); font-size: 9px; letter-spacing: 0.3em; text-transform: uppercase; color: #B8A98A; }
.equip-item { padding: 20px 32px; border-bottom: 1px solid rgba(184,169,138,0.08); display: flex; gap: 16px; align-items: flex-start; }
.equip-line { width: 1px; background: #8B1F1F; flex-shrink: 0; align-self: stretch; margin-top: 2px; min-height: 40px; }
.equip-name { display: block; font-family: var(--serif); font-size: 15px; color: #F4F1EA; letter-spacing: 0.08em; margin-bottom: 5px; }
.equip-desc { font-family: var(--sans); font-size: 12px; font-weight: 300; color: rgba(244,241,234,0.6); line-height: 1.75; }

/* DOJO GRID */
.dojo-grid { display: grid; grid-template-columns: repeat(3, 1fr); max-width: 820px; }
.dojo-city { background: rgba(26,46,122,0.9); padding: 24px 28px; }
.dojo-city-name { display: block; font-family: var(--serif); font-size: 17px; color: #F4F1EA; margin-bottom: 7px; letter-spacing: 0.06em; }
.dojo-phone { display: flex; align-items: center; gap: 6px; margin-top: 12px; font-family: var(--sans); font-size: 12px; font-weight: 400; color: #F4F1EA; letter-spacing: 0.04em; text-decoration: none; }
.dojo-phone::before { content: '☎'; font-size: 11px; color: #B8A98A; }

/* EVENTS */
.event-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; }
.event-card { background: #F4F1EA; padding: 36px 32px; }
.event-date { display: block; font-family: var(--sans); font-size: 9.5px; letter-spacing: 0.2em; color: #8B1F1F; text-transform: uppercase; margin-bottom: 14px; }
.event-title { font-family: var(--serif); font-size: 16px; font-weight: 500; color: #1C1B19; line-height: 1.45; margin-bottom: 14px; }
.event-body { font-family: var(--sans); font-size: 12.5px; font-weight: 300; color: rgba(28,27,25,0.72); line-height: 1.85; }
.event-empty { grid-column: 1 / -1; text-align: center; padding: 48px 32px; font-family: var(--sans); font-size: 13px; font-weight: 300; color: rgba(244,241,234,0.4); letter-spacing: 0.04em; }

.collab-grid { display: grid; grid-template-columns: repeat(3, 1fr); max-width: 820px; margin-top: 24px; }
.collab-item { background: rgba(26,46,122,0.9); padding: 24px 28px; }
.collab-name { display: block; font-family: var(--serif); font-size: 17px; color: #F4F1EA; margin-bottom: 7px; letter-spacing: 0.06em; }
.collab-activity { display: block; font-family: var(--sans); font-size: 12px; font-weight: 300; color: rgba(244,241,234,0.7); line-height: 1.6; }
.collab-website { display: flex; align-items: center; gap: 6px; margin-top: 12px; font-family: var(--sans); font-size: 12px; font-weight: 400; color: #F4F1EA; letter-spacing: 0.04em; text-decoration: none; }
.collab-website::before { content: '↗'; font-size: 11px; color: #B8A98A; }

/* CONTACT */
.contact-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; }
.form-label { display: block; font-family: var(--sans); font-size: 9px; letter-spacing: 0.28em; text-transform: uppercase; color: #B8A98A; margin-bottom: 10px; }
.form-input, .form-textarea { width: 100%; background: transparent; border: none; border-bottom: 1px solid rgba(28,27,25,0.22); padding: 9px 0; font-family: var(--sans); font-size: 14px; color: #1C1B19; outline: none; transition: border-color 0.2s; }
.form-input:focus, .form-textarea:focus { border-bottom-color: #1A2E7A; }
.form-textarea { resize: none; }
.btn-primary { background: #1A2E7A; color: #F4F1EA; border: none; padding: 13px 52px; font-family: var(--sans); font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase; cursor: pointer; transition: background 0.25s; text-decoration: none; display: inline-block; }
.btn-primary:hover { background: #24408E; }

/* FOOTER */
.social-link { font-family: var(--sans); font-size: 10.5px; letter-spacing: 0.18em; color: #1C1B19; text-decoration: none; text-transform: uppercase; border-bottom: 1px solid rgba(28,27,25,0.18); padding-bottom: 3px; width: fit-content; transition: border-color 0.2s; display: block; margin-bottom: 14px; }
.social-link:hover { border-bottom-color: #1A2E7A; }

/* SCROLL INDICATOR */
@keyframes fadeUp { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:translateY(0); } }
.hero-anim { animation: fadeUp 1.1s ease 0.25s both; }

/* RESPONSIVE */
@media (max-width: 1100px) {
  .dojo-grid { grid-template-columns: 1fr 1fr; }
  .event-grid { grid-template-columns: 1fr 1fr; }
  .collab-grid { grid-template-columns: 1fr 1fr; }
  .pillars { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  .nav-links { display: none; }
  .hamburger { display: flex; }
  .nav-logo span { font-size: 9.5px; letter-spacing: 0.08em; }
  .nav-logo { gap: 7px; }
  .nav-end { margin-left: auto; }
  .band { padding: 36px 24px 32px; }
  .band-title { font-size: 22px; }
  .section-pad { padding: 48px 24px 64px !important; }
  .card { padding: 28px 24px !important; }
  .pillars { grid-template-columns: 1fr !important; }
  .dojo-grid { grid-template-columns: 1fr !important; }
  .event-grid { grid-template-columns: 1fr !important; }
  .collab-grid { grid-template-columns: 1fr !important; }
  .pratica-split { grid-template-columns: 1fr !important; }
  .contact-layout { grid-template-columns: 1fr !important; gap: 44px !important; }
  .parallax { background-attachment: scroll !important; }
  .hero-kanji { font-size: 42px !important; }
}

/* i18n hidden */
[data-lang] { display: none; }
body.lang-it [data-lang="it"] { display: revert; }
body.lang-en [data-lang="en"] { display: revert; }
