/**
 * ONDO PUBLIC WEBSITE STYLE
 * [한국어] 공개 홈페이지 전체 스타일입니다. 파일 아래쪽의 FINAL 섹션이 관리자 설정과 최종 로고를 제어합니다.
 * [日本語] 公開サイト全体のスタイルです。末尾の FINAL セクションが管理設定と最終ロゴを制御します。
 */
:root {
  --bg: #071019;
  --bg-soft: #0b1723;
  --surface: rgba(14, 31, 45, 0.78);
  --surface-strong: #102436;
  --line: rgba(157, 220, 255, 0.16);
  --line-strong: rgba(157, 220, 255, 0.32);
  --text: #eef8ff;
  --muted: #9fb3c3;
  --primary: #61d8ff;
  --primary-strong: #1aa8e1;
  --accent: #8bf7d1;
  --danger: #ff8a8a;
  --shadow: 0 24px 70px rgba(0, 0, 0, 0.28);
  --radius: 22px;
  --radius-sm: 14px;
  --container: 1180px;
  --header-h: 78px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  background:
    radial-gradient(circle at 78% 4%, rgba(33, 173, 226, 0.15), transparent 34%),
    radial-gradient(circle at 8% 25%, rgba(139, 247, 209, 0.08), transparent 30%),
    var(--bg);
  color: var(--text);
  font-family: Inter, "Noto Sans JP", "Noto Sans KR", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: 0.2;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size: 54px 54px;
  mask-image: linear-gradient(to bottom, black, transparent 72%);
  z-index: -2;
}

a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }

.container { width: min(calc(100% - 40px), var(--container)); margin: 0 auto; }
.section { padding: 112px 0; position: relative; }
.section-sm { padding: 72px 0; }
.section-head { display: flex; justify-content: space-between; align-items: end; gap: 28px; margin-bottom: 42px; }
.section-head > div:first-child { max-width: 760px; }
.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--primary);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  margin-bottom: 14px;
}
.eyebrow::before { content: ""; width: 34px; height: 1px; background: linear-gradient(90deg, var(--primary), transparent); }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { letter-spacing: -0.025em; line-height: 1.18; }
h1 { font-size: clamp(2.7rem, 6vw, 6rem); margin-bottom: 24px; }
h2 { font-size: clamp(2rem, 4vw, 3.8rem); margin-bottom: 18px; }
h3 { font-size: 1.25rem; margin-bottom: 10px; }
.lead { color: #c6d9e6; font-size: clamp(1.03rem, 1.6vw, 1.24rem); max-width: 720px; }
.muted { color: var(--muted); }

.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  height: var(--header-h);
  border-bottom: 1px solid transparent;
  transition: background .25s ease, border-color .25s ease, backdrop-filter .25s ease;
}
.site-header.scrolled {
  background: rgba(7, 16, 25, 0.8);
  border-color: var(--line);
  backdrop-filter: blur(18px);
}
.header-inner { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 12px; font-weight: 900; letter-spacing: 0.12em; }
.brand-mark {
  position: relative;
  width: 34px;
  height: 34px;
  border: 1px solid rgba(97,216,255,.55);
  border-radius: 11px;
  transform: rotate(45deg);
  background: linear-gradient(145deg, rgba(97,216,255,.22), rgba(139,247,209,.06));
  box-shadow: inset 0 0 18px rgba(97,216,255,.16), 0 0 28px rgba(97,216,255,.14);
}
.brand-mark::after { content:""; position:absolute; inset:8px; border: 1px solid var(--accent); border-radius: 5px; }
.brand-text { font-size: .97rem; }
.nav { display: flex; align-items: center; gap: 28px; }
.nav a { color: #c4d6e3; font-size: .93rem; font-weight: 700; position: relative; }
.nav a::after { content:""; position:absolute; left:0; right:100%; bottom:-8px; height:1px; background:var(--primary); transition:right .22s ease; }
.nav a:hover, .nav a[aria-current="page"] { color: #fff; }
.nav a:hover::after, .nav a[aria-current="page"]::after { right:0; }
.menu-toggle { display:none; border:0; color:#fff; background:transparent; width:44px; height:44px; border-radius:12px; }
.menu-toggle span, .menu-toggle::before, .menu-toggle::after { content:""; display:block; width:22px; height:2px; margin:5px auto; background:currentColor; transition:.2s ease; }
.menu-toggle.is-open span { opacity:0; }
.menu-toggle.is-open::before { transform: translateY(7px) rotate(45deg); }
.menu-toggle.is-open::after { transform: translateY(-7px) rotate(-45deg); }

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 50px;
  padding: 0 22px;
  border: 1px solid var(--line-strong);
  border-radius: 999px;
  color: #eaf8ff;
  background: rgba(255,255,255,.025);
  font-weight: 800;
  cursor: pointer;
  transition: transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
.btn:hover { transform: translateY(-2px); border-color: rgba(97,216,255,.62); background: rgba(97,216,255,.075); }
.btn-primary { border-color: transparent; color: #04131d; background: linear-gradient(105deg, var(--primary), var(--accent)); box-shadow: 0 14px 40px rgba(45, 191, 226, .18); }
.btn-primary:hover { background: linear-gradient(105deg, #7ee2ff, #a2ffe2); box-shadow: 0 18px 46px rgba(45, 191, 226, .26); }
.btn-arrow::after { content: "↗"; font-size: 1.08em; }

.hero { min-height: calc(100svh - var(--header-h)); display: grid; place-items: center; overflow: hidden; padding: 72px 0 100px; }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr); gap: 64px; align-items: center; }
.hero-copy { position:relative; z-index:2; }
.hero h1 .gradient-text { background: linear-gradient(100deg, #fff 20%, var(--primary) 65%, var(--accent)); -webkit-background-clip:text; background-clip:text; color:transparent; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:34px; }
.hero-meta { display:flex; flex-wrap:wrap; gap:22px; margin-top:50px; color:var(--muted); font-size:.85rem; }
.hero-meta span { display:flex; align-items:center; gap:9px; }
.hero-meta span::before { content:""; width:7px; height:7px; border-radius:50%; background:var(--accent); box-shadow:0 0 14px var(--accent); }

.hero-visual { min-height: 530px; position:relative; display:grid; place-items:center; }
.arena-core {
  position:relative;
  width:min(430px, 88vw);
  aspect-ratio:1;
  border-radius:50%;
  border:1px solid rgba(97,216,255,.2);
  display:grid;
  place-items:center;
  background: radial-gradient(circle, rgba(32,136,174,.15), transparent 64%);
  box-shadow: inset 0 0 80px rgba(44,184,222,.07);
}
.arena-core::before, .arena-core::after {
  content:"";
  position:absolute;
  border-radius:50%;
  border:1px dashed rgba(139,247,209,.22);
  animation:spin 22s linear infinite;
}
.arena-core::before { inset:34px; }
.arena-core::after { inset:74px; animation-direction:reverse; animation-duration:15s; }
.arena-stage {
  width:43%;
  aspect-ratio:1.6;
  border:1px solid rgba(97,216,255,.5);
  transform:perspective(500px) rotateX(58deg) rotateZ(-18deg);
  background: linear-gradient(135deg, rgba(97,216,255,.17), rgba(139,247,209,.04));
  box-shadow:0 0 54px rgba(97,216,255,.16), inset 0 0 38px rgba(97,216,255,.08);
}
.arena-node { position:absolute; width:11px; height:11px; border-radius:50%; background:var(--primary); box-shadow:0 0 20px var(--primary); }
.arena-node.n1 { top:16%; left:24%; }
.arena-node.n2 { top:31%; right:11%; background:var(--accent); box-shadow:0 0 20px var(--accent); }
.arena-node.n3 { bottom:12%; left:36%; }
.orbit-label { position:absolute; padding:9px 13px; border:1px solid var(--line); border-radius:999px; color:#cde8f6; font-size:.72rem; letter-spacing:.1em; background:rgba(7,16,25,.75); backdrop-filter:blur(10px); }
.orbit-label.l1 { top:9%; right:8%; }
.orbit-label.l2 { bottom:18%; left:0; }
.orbit-label.l3 { bottom:5%; right:16%; }
@keyframes spin { to { transform:rotate(360deg); } }

.stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; }
.stat { background:rgba(9,22,33,.94); padding:34px 30px; }
.stat strong { display:block; font-size:clamp(1.5rem,3vw,2.3rem); color:#fff; margin-bottom:4px; }
.stat span { color:var(--muted); font-size:.9rem; }

.card-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.card {
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:30px;
  background:linear-gradient(145deg, rgba(18,40,58,.7), rgba(8,20,30,.76));
  box-shadow:var(--shadow);
  position:relative;
  overflow:hidden;
}
.card::after { content:""; position:absolute; inset:auto -30% -70% 20%; height:180px; background:radial-gradient(circle, rgba(97,216,255,.1), transparent 62%); pointer-events:none; }
.card-number { color:var(--primary); font-weight:900; font-size:.78rem; letter-spacing:.12em; margin-bottom:48px; }
.card p { color:var(--muted); margin-bottom:0; }
.card-icon { width:42px; height:42px; border:1px solid var(--line-strong); border-radius:13px; display:grid; place-items:center; margin-bottom:26px; color:var(--accent); }

.split { display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center; }
.panel {
  border:1px solid var(--line);
  background:rgba(10,24,36,.75);
  border-radius:var(--radius);
  padding:34px;
  box-shadow:var(--shadow);
}
.signal-map { min-height:430px; position:relative; overflow:hidden; }
.signal-map::before { content:""; position:absolute; inset:8%; border:1px solid rgba(97,216,255,.16); transform:rotate(8deg); }
.signal-map::after { content:""; position:absolute; inset:16%; border:1px solid rgba(139,247,209,.15); transform:rotate(-12deg); }
.signal-line { position:absolute; height:1px; background:linear-gradient(90deg,transparent,var(--primary),transparent); transform-origin:left center; opacity:.7; }
.signal-line.s1 { width:72%; top:29%; left:13%; transform:rotate(23deg); }
.signal-line.s2 { width:58%; top:69%; left:21%; transform:rotate(-31deg); }
.signal-line.s3 { width:50%; top:43%; left:39%; transform:rotate(79deg); }
.signal-dot { position:absolute; width:12px; height:12px; border-radius:50%; background:var(--accent); box-shadow:0 0 24px var(--accent); z-index:2; }
.signal-dot.d1 { top:24%; left:25%; }
.signal-dot.d2 { top:48%; right:20%; }
.signal-dot.d3 { bottom:20%; left:38%; }
.signal-copy { position:absolute; left:32px; bottom:30px; z-index:3; }
.signal-copy strong { font-size:1.4rem; display:block; }
.signal-copy span { color:var(--muted); font-size:.86rem; }

.news-list { border-top:1px solid var(--line); }
.news-item { display:grid; grid-template-columns:130px 120px 1fr 28px; gap:18px; align-items:center; padding:24px 4px; border-bottom:1px solid var(--line); transition:background .2s ease, padding .2s ease; }
.news-item:hover { background:rgba(97,216,255,.035); padding-left:14px; padding-right:14px; }
.news-date { color:var(--muted); font-size:.86rem; }
.news-category { color:var(--primary); font-size:.72rem; font-weight:800; letter-spacing:.08em; }
.news-title { font-weight:700; }
.news-arrow { color:var(--accent); }

.cta { border:1px solid var(--line-strong); border-radius:32px; padding:60px; background:linear-gradient(120deg, rgba(21,71,92,.52), rgba(11,29,42,.86)); position:relative; overflow:hidden; }
.cta::after { content:""; position:absolute; width:360px; aspect-ratio:1; border-radius:50%; right:-120px; top:-160px; border:1px solid rgba(139,247,209,.18); box-shadow:0 0 80px rgba(97,216,255,.1) inset; }
.cta-inner { position:relative; z-index:1; display:flex; justify-content:space-between; align-items:end; gap:32px; }
.cta h2 { max-width:720px; margin-bottom:0; }

.page-hero { padding:100px 0 64px; border-bottom:1px solid var(--line); }
.page-hero h1 { font-size:clamp(2.5rem,5vw,5rem); margin-bottom:18px; }
.breadcrumb { color:var(--muted); font-size:.82rem; margin-bottom:28px; }
.breadcrumb span { color:var(--primary); }

.company-table { border-top:1px solid var(--line-strong); }
.company-row { display:grid; grid-template-columns:220px 1fr; gap:34px; padding:24px 4px; border-bottom:1px solid var(--line); }
.company-row dt { color:#cbe5f3; font-weight:800; }
.company-row dd { margin:0; color:var(--muted); }

.value-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.value-card { min-height:270px; display:flex; flex-direction:column; justify-content:flex-end; }
.value-card .value-word { font-size:clamp(2rem,4vw,3.6rem); color:rgba(255,255,255,.06); font-weight:900; letter-spacing:-.04em; position:absolute; top:20px; right:24px; }

.board-toolbar { display:flex; justify-content:space-between; gap:18px; margin-bottom:24px; }
.search-box { flex:1; max-width:420px; position:relative; }
.search-box input, .form-control {
  width:100%;
  min-height:52px;
  border:1px solid var(--line-strong);
  border-radius:14px;
  padding:0 16px;
  color:var(--text);
  background:rgba(8,20,30,.75);
  outline:none;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.form-control:focus, .search-box input:focus { border-color:var(--primary); box-shadow:0 0 0 4px rgba(97,216,255,.08); }
textarea.form-control { min-height:160px; resize:vertical; padding-top:14px; }
.board-table { border-top:1px solid var(--line-strong); }
.board-row { display:grid; grid-template-columns:80px 1fr 140px 110px; gap:18px; padding:20px 8px; border-bottom:1px solid var(--line); align-items:center; }
.board-row.board-head { color:var(--muted); font-size:.8rem; font-weight:700; }
.board-row:not(.board-head) { cursor:pointer; }
.board-row:not(.board-head):hover { background:rgba(97,216,255,.035); }
.board-title { font-weight:750; }
.badge { display:inline-flex; align-items:center; min-height:25px; padding:0 9px; border:1px solid rgba(97,216,255,.28); border-radius:999px; color:var(--primary); font-size:.67rem; font-weight:800; margin-right:8px; }
.board-empty { padding:60px 0; text-align:center; color:var(--muted); border-bottom:1px solid var(--line); }
.pagination { display:flex; justify-content:center; gap:8px; margin-top:30px; }
.pagination button { width:40px; height:40px; border-radius:12px; border:1px solid var(--line); background:rgba(255,255,255,.02); color:var(--muted); cursor:pointer; }
.pagination button.active { color:#06131c; background:var(--primary); border-color:var(--primary); }
.article { max-width:880px; margin:0 auto; }
.article-head { padding-bottom:32px; border-bottom:1px solid var(--line); margin-bottom:36px; }
.article-head h1 { font-size:clamp(2rem,4vw,3.6rem); }
.article-meta { display:flex; gap:20px; color:var(--muted); font-size:.86rem; }
.article-body { color:#c8dae5; font-size:1.03rem; }
.article-body h2 { font-size:1.6rem; margin-top:44px; }
.article-body p { margin-bottom:22px; }

.contact-grid { display:grid; grid-template-columns:.85fr 1.15fr; gap:24px; }
.contact-info { display:flex; flex-direction:column; gap:16px; }
.info-card { padding:24px; border:1px solid var(--line); border-radius:var(--radius-sm); background:rgba(10,24,36,.65); }
.info-card span { display:block; color:var(--muted); font-size:.76rem; letter-spacing:.08em; text-transform:uppercase; margin-bottom:6px; }
.info-card strong { font-size:1.05rem; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.form-group { display:flex; flex-direction:column; gap:8px; }
.form-group.full { grid-column:1/-1; }
.form-group label { color:#cfe2ee; font-size:.88rem; font-weight:750; }
.required { color:var(--accent); margin-left:5px; }
.form-note { color:var(--muted); font-size:.78rem; }
.form-status { min-height:26px; margin-top:14px; font-size:.9rem; }
.form-status.success { color:var(--accent); }
.form-status.error { color:var(--danger); }
.map-wrap { min-height:420px; overflow:hidden; border-radius:var(--radius); border:1px solid var(--line); background:#0a1924; }
.map-wrap iframe { width:100%; height:420px; border:0; filter:saturate(.55) invert(.88) hue-rotate(160deg) brightness(.72) contrast(1.25); }

.placeholder-page { min-height:calc(100svh - var(--header-h)); display:grid; place-items:center; text-align:center; padding:80px 0; }
.placeholder-orb { width:116px; aspect-ratio:1; margin:0 auto 28px; border-radius:50%; border:1px solid var(--line-strong); background:radial-gradient(circle, rgba(97,216,255,.18), transparent 62%); box-shadow:0 0 70px rgba(97,216,255,.1); position:relative; }
.placeholder-orb::after { content:""; position:absolute; inset:26px; border:1px dashed var(--accent); border-radius:50%; animation:spin 8s linear infinite; }

.site-footer { border-top:1px solid var(--line); padding:56px 0 28px; background:rgba(4,11,17,.5); }
.footer-grid { display:grid; grid-template-columns:1.3fr .7fr .7fr; gap:42px; margin-bottom:52px; }
.footer-brand p { color:var(--muted); max-width:440px; margin:18px 0 0; }
.footer-title { color:#fff; font-size:.82rem; letter-spacing:.1em; margin-bottom:16px; }
.footer-links { display:grid; gap:9px; }
.footer-links a { color:var(--muted); font-size:.9rem; }
.footer-links a:hover { color:var(--primary); }
.footer-bottom { display:flex; justify-content:space-between; gap:20px; color:#718798; font-size:.78rem; padding-top:24px; border-top:1px solid var(--line); }

.reveal { opacity:0; transform:translateY(20px); transition:opacity .7s ease, transform .7s ease; }
.reveal.is-visible { opacity:1; transform:none; }

@media (max-width: 980px) {
  .hero-grid, .split, .contact-grid { grid-template-columns:1fr; }
  .hero { padding-top:50px; }
  .hero-visual { min-height:420px; order:-1; }
  .arena-core { width:min(360px,80vw); }
  .stats-grid { grid-template-columns:repeat(2,1fr); }
  .card-grid, .value-grid { grid-template-columns:1fr 1fr; }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .footer-brand { grid-column:1/-1; }
}

@media (max-width: 760px) {
  :root { --header-h:68px; }
  .container { width:min(calc(100% - 28px), var(--container)); }
  .section { padding:84px 0; }
  .section-head { display:block; }
  .section-head .btn { margin-top:18px; }
  .menu-toggle { display:block; }
  .nav {
    position:fixed;
    top:var(--header-h);
    left:14px;
    right:14px;
    display:grid;
    gap:0;
    padding:10px;
    border:1px solid var(--line);
    border-radius:18px;
    background:rgba(7,16,25,.96);
    backdrop-filter:blur(18px);
    transform:translateY(-12px);
    opacity:0;
    pointer-events:none;
    transition:.2s ease;
    box-shadow:var(--shadow);
  }
  .nav.is-open { transform:none; opacity:1; pointer-events:auto; }
  .nav a { padding:13px 12px; border-radius:10px; }
  .nav a:hover { background:rgba(97,216,255,.06); }
  .nav a::after { display:none; }
  .hero-grid { gap:26px; }
  .hero-visual { min-height:330px; }
  .orbit-label { display:none; }
  .hero-meta { margin-top:34px; gap:12px; }
  .stats-grid, .card-grid, .value-grid, .footer-grid { grid-template-columns:1fr; }
  .split { gap:34px; }
  .cta { padding:36px 24px; }
  .cta-inner { display:block; }
  .cta .btn { margin-top:24px; }
  .company-row { grid-template-columns:1fr; gap:6px; }
  .board-toolbar { display:block; }
  .search-box { max-width:none; }
  .board-row { grid-template-columns:56px 1fr 90px; }
  .board-row > :nth-child(3) { display:none; }
  .board-row.board-head > :nth-child(3) { display:none; }
  .form-grid { grid-template-columns:1fr; }
  .form-group.full { grid-column:auto; }
  .footer-bottom { display:block; }
}

@media (max-width: 480px) {
  h1 { font-size:2.55rem; }
  .hero-actions .btn { width:100%; }
  .stat { padding:26px 22px; }
  .card { padding:24px; }
  .board-row { grid-template-columns:48px 1fr; }
  .board-row > :last-child { display:none; }
  .board-row.board-head > :last-child { display:none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  .reveal { opacity:1; transform:none; }
}

/* ===== 2026-07 visual refresh ===== */
:root {
  --bg: #071727;
  --bg-soft: #0f2840;
  --surface: rgba(18, 40, 62, 0.68);
  --surface-strong: rgba(24, 52, 78, 0.92);
  --line: rgba(179, 230, 255, 0.18);
  --line-strong: rgba(154, 223, 255, 0.38);
  --text: #f5fbff;
  --muted: #b4c8d9;
  --primary: #6ed8ff;
  --primary-strong: #2ab5f1;
  --accent: #8cf6e6;
  --shadow: 0 28px 90px rgba(2, 14, 28, 0.3);
}

body {
  background:
    radial-gradient(circle at 50% -6%, rgba(140, 210, 255, 0.32), transparent 30%),
    radial-gradient(circle at 85% 12%, rgba(92, 196, 255, 0.24), transparent 25%),
    radial-gradient(circle at 12% 20%, rgba(140, 246, 230, 0.14), transparent 28%),
    linear-gradient(180deg, #12365a 0%, #0a1b2c 18%, #071524 46%, #08111b 100%);
}

body::before { opacity: 0.14; }

.site-header.scrolled {
  background: rgba(10, 28, 44, 0.76);
  border-color: rgba(171, 225, 255, 0.17);
  backdrop-filter: blur(18px) saturate(1.15);
}

.nav a { color: #deedf8; }
.btn {
  background: rgba(255,255,255,.045);
  box-shadow: 0 10px 26px rgba(6, 18, 31, 0.08);
}
.btn:hover { background: rgba(130, 219, 255, 0.12); }
.btn-primary {
  background: linear-gradient(105deg, #8fe5ff 0%, #a5ffee 100%);
  box-shadow: 0 18px 42px rgba(81, 205, 249, 0.28);
}
.btn-primary:hover {
  background: linear-gradient(105deg, #b0eeff 0%, #bbfff1 100%);
}

.hero {
  position: relative;
  min-height: calc(100svh - var(--header-h));
  padding: 52px 0 100px;
  background:
    radial-gradient(circle at center 22%, rgba(132, 218, 255, 0.22), transparent 22%),
    linear-gradient(180deg, rgba(255,255,255,0.035), transparent 55%);
}
.hero-home::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 50% 18%, rgba(255,255,255,.18), transparent 18%),
    linear-gradient(180deg, rgba(255,255,255,.08), transparent 24%);
  pointer-events: none;
}
.hero-center {
  position: relative;
  z-index: 1;
  min-height: calc(100svh - var(--header-h) - 52px);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.hero-eyebrow {
  justify-content: center;
  color: #dff4ff;
  text-shadow: 0 4px 18px rgba(50, 161, 245, 0.16);
}
.hero-eyebrow::before,
.hero-eyebrow::after {
  content: "";
  width: 42px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.85), transparent);
}
.hero-monument {
  position: relative;
  width: min(1040px, 100%);
  min-height: 330px;
  margin: 16px auto 18px;
  display: grid;
  place-items: center;
  isolation: isolate;
}
.hero-beam {
  position: absolute;
  top: 4%;
  width: min(26vw, 260px);
  height: 260px;
  background: linear-gradient(180deg, rgba(255,255,255,.22), rgba(112, 220, 255, .03) 78%, transparent);
  filter: blur(10px);
  opacity: .75;
  transform-origin: top center;
}
.beam-left { left: 18%; transform: skewX(-18deg) rotate(6deg); }
.beam-right { right: 18%; transform: skewX(18deg) rotate(-6deg); }
.hero-ring {
  position: absolute;
  border-radius: 50%;
  border: 1px solid rgba(170, 230, 255, 0.24);
  box-shadow: inset 0 0 50px rgba(103, 215, 255, .05), 0 0 50px rgba(103, 215, 255, .09);
}
.ring-1 {
  width: min(720px, 90vw);
  height: min(280px, 38vw);
  bottom: 22px;
}
.ring-2 {
  width: min(560px, 74vw);
  height: min(210px, 29vw);
  bottom: 58px;
  border-style: dashed;
  animation: spin 28s linear infinite;
}
.hero-stage-glow {
  position: absolute;
  width: min(740px, 96vw);
  height: 180px;
  bottom: 10px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(123, 220, 255, .42), rgba(111, 215, 255, .08) 46%, transparent 72%);
  filter: blur(14px);
}
.hero-wordmark {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
.hero-wordmark-top,
.hero-wordmark-bottom {
  display: inline-block;
  font-size: .86rem;
  letter-spacing: .44em;
  font-weight: 800;
  text-transform: uppercase;
  color: #d6f0ff;
}
.hero-wordmark-bottom { letter-spacing: .22em; font-size: .8rem; }
.ondo-3d {
  display: inline-block;
  font-size: clamp(4.8rem, 16vw, 10.2rem);
  line-height: .92;
  letter-spacing: .08em;
  font-weight: 1000;
  color: #f9fdff;
  text-transform: uppercase;
  text-shadow:
    0 1px 0 #dff4ff,
    0 2px 0 #c8ecff,
    0 3px 0 #b4e3ff,
    0 4px 0 #97d4fa,
    0 5px 0 #7bc5f0,
    0 12px 24px rgba(15, 56, 89, 0.32),
    0 24px 50px rgba(73, 196, 255, 0.18);
  transform: perspective(900px) rotateX(16deg);
}
.hero-title {
  margin-bottom: 18px;
  text-shadow: 0 10px 40px rgba(0,0,0,.28);
}
.hero-title .gradient-text {
  background: linear-gradient(92deg, #ffffff 12%, #8be3ff 65%, #c3fff1 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.hero-lead {
  max-width: 900px;
  color: #e0edf7;
}
.hero-actions-center, .hero-meta-center { justify-content: center; }
.hero-meta-center {
  margin-top: 32px;
  gap: 18px 24px;
  color: #d2e5f3;
}
.hero-meta-center span {
  padding: 10px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(177, 229, 255, .15);
  backdrop-filter: blur(10px);
}

.stats-grid {
  background: linear-gradient(180deg, rgba(166, 225, 255, .12), rgba(166, 225, 255, .06));
  border-color: rgba(187, 233, 255, 0.16);
  box-shadow: var(--shadow);
}
.stat {
  background: linear-gradient(180deg, rgba(20, 42, 62, .88), rgba(11, 24, 38, .92));
}
.card,
.panel,
.info-card,
.map-wrap,
.cta {
  background: linear-gradient(180deg, rgba(24, 48, 70, 0.82), rgba(10, 24, 37, 0.9));
  border-color: rgba(180, 229, 255, 0.16);
  box-shadow: var(--shadow);
}
.card:hover, .panel:hover, .info-card:hover {
  transform: translateY(-4px);
  transition: transform .22s ease, border-color .22s ease;
  border-color: rgba(140, 222, 255, 0.34);
}
.cta {
  background: linear-gradient(120deg, rgba(40, 95, 134, .52), rgba(15, 34, 52, .9));
}
.news-item { background: rgba(255,255,255,.03); }
.site-footer {
  background: linear-gradient(180deg, rgba(9, 19, 31, 0.4), rgba(7, 15, 24, 0.7));
}
.map-wrap iframe {
  filter: saturate(.75) invert(.9) hue-rotate(175deg) brightness(.78) contrast(1.18);
}

@media (max-width: 980px) {
  .hero-center { min-height: auto; padding: 80px 0 20px; }
  .hero-monument { min-height: 290px; }
  .ondo-3d { font-size: clamp(4.4rem, 18vw, 7rem); }
  .hero-wordmark-top, .hero-wordmark-bottom { letter-spacing: .18em; }
}

@media (max-width: 760px) {
  .hero { padding-top: 28px; }
  .hero-monument { min-height: 240px; margin-top: 4px; }
  .beam-left { left: 6%; }
  .beam-right { right: 6%; }
  .hero-wordmark-top, .hero-wordmark-bottom { font-size: .72rem; }
  .hero-meta-center span { width: 100%; justify-content: center; }
}

@media (max-width: 480px) {
  .ondo-3d {
    font-size: 4rem;
    text-shadow:
      0 1px 0 #dff4ff,
      0 2px 0 #c8ecff,
      0 3px 0 #b4e3ff,
      0 4px 0 #97d4fa,
      0 10px 18px rgba(15, 56, 89, 0.3),
      0 18px 34px rgba(73, 196, 255, 0.16);
  }
  .hero-title { font-size: 2.2rem; }
}

/* ===== ONDO dissolve 3D intro ===== */
.ondo-3d {
  position: relative;
  display: inline-grid;
  place-items: center;
  min-width: min(900px, 92vw);
  padding: 0.08em 0.1em 0.16em;
  overflow: visible;
}
.ondo-3d-inner {
  position: relative;
  display: inline-flex;
  gap: 0.04em;
  perspective: 1200px;
  z-index: 2;
}
.ondo-3d .letter {
  position: relative;
  display: inline-block;
  opacity: 0;
  color: #f9fdff;
  transform: translateY(34px) rotateX(76deg) scale(0.92);
  filter: blur(14px) brightness(1.38);
  will-change: transform, opacity, filter;
  animation: letterDissolveIn 1.18s cubic-bezier(.18,.78,.14,1) forwards;
  text-shadow:
    0 1px 0 #ecf8ff,
    0 2px 0 #d9f0ff,
    0 3px 0 #c7e7ff,
    0 4px 0 #afdaf8,
    0 5px 0 #92caf0,
    0 12px 22px rgba(17, 61, 94, 0.3),
    0 22px 46px rgba(73, 196, 255, 0.22);
}
.ondo-3d .letter::before,
.ondo-3d .letter::after {
  content: attr(data-char);
  position: absolute;
  inset: 0;
  pointer-events: none;
}
/* fallback because attr(data-char) is empty if not set; we duplicate via CSS below */
.ondo-3d .l1::before, .ondo-3d .l1::after { content: 'O'; }
.ondo-3d .l2::before, .ondo-3d .l2::after { content: 'N'; }
.ondo-3d .l3::before, .ondo-3d .l3::after { content: 'D'; }
.ondo-3d .l4::before, .ondo-3d .l4::after { content: 'O'; }
.ondo-3d .letter::before {
  color: rgba(122, 215, 255, 0.38);
  transform: translate3d(0, 0.06em, -8px) scaleY(0.98);
  filter: blur(5px);
  z-index: -2;
}
.ondo-3d .letter::after {
  color: rgba(255,255,255,.82);
  mix-blend-mode: screen;
  filter: blur(16px);
  opacity: 0;
  animation: letterDust 0.95s ease forwards;
}
.ondo-3d .l1 { animation-delay: .08s; }
.ondo-3d .l2 { animation-delay: .28s; }
.ondo-3d .l3 { animation-delay: .48s; }
.ondo-3d .l4 { animation-delay: .68s; }
.ondo-3d .l1::after { animation-delay: .02s; }
.ondo-3d .l2::after { animation-delay: .22s; }
.ondo-3d .l3::after { animation-delay: .42s; }
.ondo-3d .l4::after { animation-delay: .62s; }

.ondo-ghost {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  letter-spacing: .08em;
  color: rgba(163, 228, 255, 0.22);
  filter: blur(20px);
  transform: translateY(18px) scale(1.02);
  opacity: 0;
  animation: ghostTrail 1.4s ease-out .1s forwards;
  z-index: 1;
  pointer-events: none;
}
.ondo-glow {
  position: absolute;
  inset: auto;
  border-radius: 50%;
  pointer-events: none;
  opacity: 0;
}
.glow-1 {
  width: min(720px, 90vw);
  height: 96px;
  bottom: 18px;
  background: radial-gradient(circle, rgba(154, 231, 255, .55), rgba(111, 220, 255, .08) 50%, transparent 72%);
  filter: blur(18px);
  animation: floorGlowIn 1.2s ease-out .35s forwards;
}
.glow-2 {
  width: min(620px, 80vw);
  height: 180px;
  top: 50%;
  transform: translateY(-50%);
  background: radial-gradient(circle, rgba(255,255,255,.14), rgba(143, 230, 255, .08) 40%, transparent 70%);
  filter: blur(26px);
  animation: auraGlowIn 1.4s ease-out .5s forwards;
}

@keyframes letterDissolveIn {
  0% {
    opacity: 0;
    transform: translateY(34px) rotateX(76deg) scale(.92);
    filter: blur(18px) brightness(1.4);
    clip-path: inset(0 0 100% 0);
  }
  28% {
    opacity: .22;
    transform: translateY(18px) rotateX(48deg) scale(.97);
    filter: blur(10px) brightness(1.45);
    clip-path: inset(0 0 58% 0);
  }
  62% {
    opacity: .78;
    transform: translateY(6px) rotateX(18deg) scale(1.01);
    filter: blur(3px) brightness(1.16);
    clip-path: inset(0 0 16% 0);
  }
  100% {
    opacity: 1;
    transform: translateY(0) rotateX(16deg) scale(1);
    filter: blur(0) brightness(1);
    clip-path: inset(0 0 0 0);
  }
}

@keyframes letterDust {
  0% {
    opacity: .65;
    transform: translate(0, 0) scale(1);
    filter: blur(18px);
    clip-path: inset(0 0 0 0);
  }
  100% {
    opacity: 0;
    transform: translate(0, -18px) scale(1.06);
    filter: blur(28px);
    clip-path: inset(0 -8% 0 78%);
  }
}

@keyframes ghostTrail {
  0% { opacity: 0; }
  20% { opacity: .42; }
  100% { opacity: 0; transform: translateY(32px) scale(1.04); }
}
@keyframes floorGlowIn {
  0% { opacity: 0; transform: scale(.65); }
  100% { opacity: 1; transform: scale(1); }
}
@keyframes auraGlowIn {
  0% { opacity: 0; transform: translateY(-50%) scale(.8); }
  100% { opacity: 1; transform: translateY(-50%) scale(1); }
}

@media (max-width: 980px) {
  .ondo-3d { min-width: auto; }
}

@media (max-width: 760px) {
  .ondo-3d-inner { gap: .02em; }
  .glow-1 { height: 72px; bottom: 8px; }
  .glow-2 { height: 120px; }
}

@media (prefers-reduced-motion: reduce) {
  .ondo-3d .letter,
  .ondo-3d .letter::after,
  .ondo-ghost,
  .glow-1,
  .glow-2 {
    animation: none !important;
    opacity: 1;
    filter: none;
    transform: none;
    clip-path: none;
  }
  .ondo-ghost,
  .glow-2 { opacity: .35; }
}

/* ===== 2026-07 casual bright refresh ===== */
:root {
  --bg: #f6fbff;
  --bg-soft: #eef7ff;
  --surface: rgba(255, 255, 255, 0.84);
  --surface-strong: rgba(255, 255, 255, 0.96);
  --line: rgba(70, 140, 205, 0.12);
  --line-strong: rgba(70, 140, 205, 0.24);
  --text: #223447;
  --muted: #62778d;
  --primary: #30b3ff;
  --primary-strong: #1a9ce8;
  --accent: #ff6f6f;
  --danger: #ef5a5a;
  --shadow: 0 18px 42px rgba(30, 72, 110, 0.12);
}

body {
  color: var(--text);
  background:
    radial-gradient(circle at 15% 12%, rgba(255, 116, 116, 0.16), transparent 20%),
    radial-gradient(circle at 85% 10%, rgba(88, 196, 255, 0.2), transparent 22%),
    radial-gradient(circle at 50% 0%, rgba(255,255,255,0.95), rgba(244,250,255,0.98) 34%, #eff8ff 60%, #f9fcff 100%);
}
body::before {
  opacity: 0.08;
  background-image:
    radial-gradient(rgba(48,179,255,.08) 1px, transparent 1px),
    radial-gradient(rgba(255,111,111,.05) 1px, transparent 1px);
  background-size: 28px 28px, 32px 32px;
  background-position: 0 0, 16px 16px;
  mask-image: none;
}

.site-header { border-bottom: 1px solid rgba(70,140,205,.08); }
.site-header.scrolled {
  background: rgba(255,255,255,.84);
  border-color: rgba(70,140,205,.12);
  backdrop-filter: blur(16px) saturate(1.2);
}
.brand, .footer-brand .brand { color: #1a2e43; }
.brand-mark {
  border-color: rgba(255,111,111,.42);
  background: linear-gradient(145deg, rgba(255,255,255,.95), rgba(255,220,220,.8));
  box-shadow: inset 0 0 12px rgba(255,111,111,.1), 0 8px 24px rgba(255,111,111,.12);
}
.brand-mark::after { border-color: var(--primary); }
.nav a { color: #4a637c; }
.nav a:hover, .nav a[aria-current="page"] { color: #1b3248; }
.nav a::after { background: linear-gradient(90deg, var(--accent), var(--primary)); }

.btn {
  color: #21415d;
  background: rgba(255,255,255,.78);
  border-color: rgba(48,179,255,.14);
  box-shadow: 0 10px 22px rgba(70,140,205,.08);
}
.btn:hover {
  background: #ffffff;
  border-color: rgba(48,179,255,.32);
}
.btn-primary {
  color: #fff;
  border-color: transparent;
  background: linear-gradient(135deg, #ff7373 0%, #ff8a6a 20%, #32b8ff 100%);
  box-shadow: 0 14px 28px rgba(79,164,230,.2);
}
.btn-primary:hover {
  background: linear-gradient(135deg, #ff8282 0%, #ffa37b 24%, #57c5ff 100%);
}

.hero {
  min-height: calc(100svh - var(--header-h));
  background:
    radial-gradient(circle at 50% 12%, rgba(255,255,255,.92), transparent 26%),
    linear-gradient(180deg, rgba(255,255,255,.65), rgba(255,255,255,0) 36%);
}
.hero-home::before {
  background:
    radial-gradient(circle at 50% 16%, rgba(255,255,255,.9), transparent 19%),
    radial-gradient(circle at 22% 34%, rgba(255,111,111,.08), transparent 16%),
    radial-gradient(circle at 80% 28%, rgba(48,179,255,.1), transparent 18%);
}
.hero-eyebrow,
.hero-wordmark-top,
.hero-wordmark-bottom,
.hero-meta-center,
.hero-meta-center span,
.hero-lead { color: #4e6a83; }
.hero-eyebrow { font-weight: 900; }
.hero-monument { min-height: 360px; }
.hero-beam {
  background: linear-gradient(180deg, rgba(255,255,255,.88), rgba(96,205,255, .18) 70%, transparent);
  filter: blur(12px);
  opacity: .75;
}
.ring-1 {
  border-color: rgba(48,179,255,.16);
  box-shadow: inset 0 0 40px rgba(48,179,255,.04), 0 0 40px rgba(48,179,255,.08);
}
.ring-2 { border-color: rgba(255,111,111,.16); }
.hero-stage-glow {
  background: radial-gradient(circle, rgba(255,255,255,.95), rgba(94, 210, 255, .3) 38%, rgba(255,111,111,.12) 58%, transparent 74%);
  filter: blur(20px);
}
.hero-title,
.hero-title .gradient-text {
  color: #223447;
  text-shadow: none;
}
.hero-title .gradient-text {
  background: linear-gradient(95deg, #ff7373 0%, #ff9f6e 22%, #30b3ff 82%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.hero-meta-center span {
  background: rgba(255,255,255,.72);
  border-color: rgba(48,179,255,.12);
}

/* smoother dissolve */
.ondo-3d {
  color: #fff;
  text-shadow: none;
}
.ondo-3d .letter {
  color: #ffffff;
  transform: translateY(22px) scale(.965) rotateX(36deg);
  filter: blur(22px) saturate(1.08);
  opacity: 0;
  text-shadow:
    0 1px 0 #ffffff,
    0 2px 0 #f0f9ff,
    0 3px 0 #dff2ff,
    0 4px 0 #c9e8ff,
    0 8px 18px rgba(48, 102, 153, 0.18),
    0 18px 40px rgba(77, 180, 255, 0.12);
  animation: letterFloatIn 1.55s cubic-bezier(.17,.82,.19,1) forwards;
}
.ondo-3d .letter::before {
  color: rgba(48,179,255,.22);
  transform: translate3d(0, .055em, -8px) scaleY(.98);
  filter: blur(8px);
}
.ondo-3d .letter::after {
  color: rgba(255,255,255,.78);
  filter: blur(24px);
  opacity: 0;
  animation: letterMist 1.45s ease-out forwards;
}
.ondo-ghost {
  color: rgba(90, 190, 255, 0.18);
  filter: blur(26px);
  transform: translateY(10px) scale(1.01);
  animation: ghostTrailSmooth 1.7s ease-out .15s forwards;
}
.glow-1 {
  background: radial-gradient(circle, rgba(255,255,255,.95), rgba(90, 198, 255, .22) 42%, transparent 70%);
}
.glow-2 {
  background: radial-gradient(circle, rgba(255,255,255,.28), rgba(255,111,111, .07) 36%, rgba(90,198,255,.08) 58%, transparent 74%);
}

@keyframes letterFloatIn {
  0% {
    opacity: 0;
    transform: translateY(24px) scale(.965) rotateX(40deg);
    filter: blur(24px) brightness(1.16);
  }
  22% {
    opacity: .18;
    transform: translateY(18px) scale(.978) rotateX(29deg);
    filter: blur(18px) brightness(1.12);
  }
  48% {
    opacity: .56;
    transform: translateY(9px) scale(.992) rotateX(21deg);
    filter: blur(10px) brightness(1.08);
  }
  72% {
    opacity: .88;
    transform: translateY(3px) scale(1.005) rotateX(17deg);
    filter: blur(3px) brightness(1.03);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1) rotateX(16deg);
    filter: blur(0) brightness(1);
  }
}
@keyframes letterMist {
  0% {
    opacity: .45;
    transform: scale(1) translateY(0);
    filter: blur(28px);
  }
  100% {
    opacity: 0;
    transform: scale(1.06) translateY(-10px);
    filter: blur(36px);
  }
}
@keyframes ghostTrailSmooth {
  0% { opacity: 0; }
  28% { opacity: .36; }
  100% { opacity: 0; transform: translateY(18px) scale(1.03); }
}

.section-head h2,
.split h2,
.cta h2,
.page-hero h1,
.article-head h1,
.company-row dt,
.form-group label { color: #21364c; }
.lead { color: #526a82; }

.stats-grid {
  background: transparent;
  border: 0;
  gap: 18px;
  box-shadow: none;
}
.stat {
  background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(247,251,255,.92));
  border: 1px solid rgba(48,179,255,.12);
  border-radius: 24px;
  padding: 30px 26px;
  box-shadow: var(--shadow);
}
.stat strong { color: #24384d; }
.stat span { color: #62778d; }
.card,
.panel,
.info-card,
.map-wrap,
.cta,
.search-box input,
.form-control,
.article,
.board-row:not(.board-head),
.company-table,
.placeholder-orb {
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(250,252,255,.96));
}
.card,
.panel,
.info-card,
.map-wrap,
.cta {
  border-color: rgba(48,179,255,.12);
  box-shadow: var(--shadow);
}
.card::after { background: radial-gradient(circle, rgba(48,179,255,.08), transparent 62%); }
.card-number,
.news-category,
.badge,
.eyebrow,
.footer-title,
.article-meta .badge { color: var(--accent); }
.card h3,
.news-title,
.board-title,
.article-body h2,
.footer-brand p strong { color: #23394f; }
.card p,
.news-date,
.article-body,
.footer-brand p,
.footer-links a,
.footer-bottom,
.company-row dd,
.info-card span,
.info-card strong,
.board-row,
.board-empty,
.form-note,
.muted { color: #62778d; }
.news-item {
  border-radius: 18px;
  border: 1px solid rgba(48,179,255,.1);
  margin-bottom: 10px;
  padding-left: 18px;
  padding-right: 18px;
}
.news-item:hover { background: rgba(255,255,255,.96); }
.signal-map {
  min-height: 400px;
  background:
    radial-gradient(circle at 30% 30%, rgba(255,111,111,.08), transparent 18%),
    radial-gradient(circle at 70% 65%, rgba(48,179,255,.12), transparent 22%),
    linear-gradient(180deg, rgba(255,255,255,.92), rgba(246,250,255,.98));
}
.signal-map::before,
.signal-map::after { border-color: rgba(48,179,255,.1); }
.signal-line { background: linear-gradient(90deg, transparent, rgba(48,179,255,.8), transparent); }
.signal-copy strong { color: #22394f; }
.signal-copy span { color: #637890; }
.cta {
  background:
    radial-gradient(circle at 85% 20%, rgba(48,179,255,.14), transparent 16%),
    radial-gradient(circle at 15% 25%, rgba(255,111,111,.1), transparent 18%),
    linear-gradient(120deg, rgba(255,255,255,.94), rgba(247,251,255,.98));
}
.page-hero {
  border-bottom-color: rgba(48,179,255,.1);
  background: linear-gradient(180deg, rgba(255,255,255,.72), rgba(248,252,255,.98));
}
.company-table,
.board-table { border-top-color: rgba(48,179,255,.16); }
.company-row,
.board-row,
.article-head { border-bottom-color: rgba(48,179,255,.1); }
.board-row.board-head { color: #7b8fa1; }
.search-box input, .form-control {
  color: #223447;
  background: #fff;
  border-color: rgba(48,179,255,.14);
}
.form-control:focus, .search-box input:focus {
  border-color: rgba(48,179,255,.42);
  box-shadow: 0 0 0 4px rgba(48,179,255,.08);
}
.map-wrap iframe {
  filter: saturate(1) invert(.03) hue-rotate(0deg) brightness(1.02) contrast(1.02);
}
.site-footer {
  border-top-color: rgba(48,179,255,.12);
  background: linear-gradient(180deg, rgba(255,255,255,.65), rgba(244,249,255,.96));
}
.footer-title { color: #2d4863; }
.footer-links a:hover { color: #1ca0eb; }
.footer-bottom { border-top-color: rgba(48,179,255,.1); }

@media (max-width: 980px) {
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 760px) {
  .hero-monument { min-height: 280px; }
  .hero-meta-center { gap: 12px; }
  .hero-meta-center span {
    color: #4e6a83;
    width: auto;
  }
  .nav {
    background: rgba(255,255,255,.96);
    border-color: rgba(48,179,255,.12);
  }
  .stats-grid, .card-grid, .value-grid, .footer-grid { grid-template-columns: 1fr; }
}

/* ========================================================================
   ONDO homepage — editorial entertainment layout
   Inspired by modern game-publisher information architecture, with original
   ONDO colors, graphics, copy, and interactions.
   ======================================================================== */
.home-riot-layout {
  --rg-ink: #111820;
  --rg-paper: #f5f3ef;
  --rg-white: #ffffff;
  --rg-red: #ff5c5f;
  --rg-blue: #2eb8ff;
  --rg-yellow: #ffd958;
  --rg-soft-blue: #dff5ff;
  --rg-line: rgba(17, 24, 32, .12);
  background: var(--rg-paper);
  color: var(--rg-ink);
}
.home-riot-layout::before { display: none; }

.rg-container {
  width: min(calc(100% - 64px), 1320px);
  margin: 0 auto;
}

/* Header */
.riot-header {
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  height: 76px;
  z-index: 100;
  border: 0;
  background: linear-gradient(180deg, rgba(7, 12, 18, .76), rgba(7, 12, 18, .2) 76%, transparent);
}
.riot-header.scrolled {
  background: rgba(17, 24, 32, .94);
  border-bottom: 1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(16px);
}
.header-shell {
  width: min(calc(100% - 44px), 1500px);
  height: 100%;
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: 38px;
}
.riot-brand { color: #fff; flex: 0 0 auto; }
.riot-brand .brand-mark {
  width: 30px;
  height: 30px;
  border-radius: 9px;
  background: linear-gradient(145deg, var(--rg-red), #ff9374);
  border-color: transparent;
  box-shadow: none;
}
.riot-brand .brand-mark::after { border-color: rgba(255,255,255,.9); }
.riot-brand .brand-text { font-size: 1rem; }
.riot-nav { gap: 8px; margin-left: auto; }
.riot-nav a {
  color: #fff;
  font-size: .78rem;
  letter-spacing: .12em;
  font-weight: 900;
  padding: 11px 14px;
  border-radius: 10px;
}
.riot-nav a::after { display: none; }
.riot-nav a:hover { background: rgba(255,255,255,.1); }
.riot-nav .nav-contact {
  margin-left: 8px;
  background: var(--rg-red);
  color: #fff;
  padding-left: 20px;
  padding-right: 20px;
}
.riot-nav .nav-contact:hover { background: #ff7779; }

/* Hero */
.rg-hero {
  position: relative;
  min-height: 100svh;
  overflow: hidden;
  display: grid;
  place-items: center;
  isolation: isolate;
  background: #111820;
  color: #fff;
}
.rg-hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 28%;
  background: linear-gradient(180deg, transparent, rgba(8,12,18,.68));
  z-index: -1;
  pointer-events: none;
}
.rg-hero-bg { position: absolute; inset: 0; z-index: -2; overflow: hidden; }
.rg-hero-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 20% 25%, rgba(255, 92, 95, .42), transparent 22%),
    radial-gradient(circle at 76% 34%, rgba(46, 184, 255, .42), transparent 26%),
    radial-gradient(circle at 50% 74%, rgba(255, 217, 88, .16), transparent 24%),
    linear-gradient(135deg, #1c2937 0%, #101923 48%, #182536 100%);
}
.rg-grid {
  position: absolute;
  inset: 0;
  opacity: .16;
  background-image:
    linear-gradient(rgba(255,255,255,.18) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.18) 1px, transparent 1px);
  background-size: 74px 74px;
  transform: perspective(900px) rotateX(55deg) scale(1.55) translateY(18%);
  transform-origin: center bottom;
}
.rg-orb { position: absolute; border-radius: 50%; filter: blur(2px); }
.rg-orb-a {
  width: min(42vw, 640px); aspect-ratio: 1; left: -8vw; top: 10%;
  background: radial-gradient(circle at 60% 45%, rgba(255,255,255,.62), rgba(255,92,95,.54) 18%, rgba(255,92,95,.08) 56%, transparent 70%);
  animation: rgFloatA 9s ease-in-out infinite alternate;
}
.rg-orb-b {
  width: min(38vw, 580px); aspect-ratio: 1; right: -5vw; bottom: 5%;
  background: radial-gradient(circle at 40% 40%, rgba(255,255,255,.52), rgba(46,184,255,.48) 20%, rgba(46,184,255,.06) 58%, transparent 72%);
  animation: rgFloatB 10s ease-in-out infinite alternate;
}
.rg-ribbon {
  position: absolute;
  width: 80vw;
  height: 22vh;
  border: 2px solid rgba(255,255,255,.2);
  border-radius: 50%;
  filter: blur(.2px);
}
.rg-ribbon-a { left: 7%; top: 23%; transform: rotate(-18deg); }
.rg-ribbon-b { right: -13%; bottom: 15%; transform: rotate(22deg); border-color: rgba(46,184,255,.22); }
.rg-particle {
  position: absolute;
  width: 12px; height: 12px;
  border-radius: 3px;
  background: rgba(255,255,255,.78);
  box-shadow: 0 0 24px rgba(255,255,255,.38);
  animation: rgParticle 5s ease-in-out infinite alternate;
}
.rg-particle.p1 { left: 18%; top: 68%; }
.rg-particle.p2 { right: 22%; top: 22%; animation-delay: .8s; background: var(--rg-yellow); }
.rg-particle.p3 { right: 15%; bottom: 22%; animation-delay: 1.4s; background: var(--rg-red); }
@keyframes rgFloatA { to { transform: translate(5%, 3%) scale(1.06); } }
@keyframes rgFloatB { to { transform: translate(-4%, -3%) scale(.96); } }
@keyframes rgParticle { to { transform: translateY(-28px) rotate(35deg); opacity: .35; } }

.rg-hero-content {
  width: min(calc(100% - 40px), 980px);
  margin: 0 auto;
  padding: 112px 0 76px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.rg-kicker {
  margin-bottom: 12px;
  font-size: .76rem;
  font-weight: 900;
  letter-spacing: .28em;
  color: rgba(255,255,255,.72);
}
.rg-logo-stage {
  position: relative;
  width: min(900px, 94vw);
  height: clamp(160px, 25vw, 280px);
  display: grid;
  place-items: center;
  margin: 0 auto -4px;
}
.rg-logo-halo {
  position: absolute;
  width: 70%;
  height: 60%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.34), rgba(46,184,255,.12) 38%, transparent 68%);
  filter: blur(26px);
}
.home-riot-layout .ondo-3d {
  min-width: 0;
  padding: 0;
  font-size: clamp(5.2rem, 15vw, 10.8rem);
}
.home-riot-layout .ondo-3d-inner { gap: .025em; }
.home-riot-layout .ondo-3d .letter {
  color: #fff;
  text-shadow:
    0 1px 0 #fff,
    0 2px 0 #edf7ff,
    0 3px 0 #d4eafd,
    0 5px 0 #9fcbe9,
    0 14px 28px rgba(0,0,0,.22),
    0 30px 70px rgba(46,184,255,.22);
}
.home-riot-layout .ondo-3d .letter::before { color: rgba(46,184,255,.35); }
.home-riot-layout .ondo-ghost { color: rgba(255,255,255,.22); }
.home-riot-layout .glow-1 { bottom: 4px; }
.rg-hero h1 {
  max-width: 920px;
  margin: 0 0 18px;
  font-size: clamp(2.3rem, 5.4vw, 5.2rem);
  line-height: 1.04;
  letter-spacing: -.055em;
  font-weight: 1000;
}
/* [한국어] 메인 제목의 모든 span에 레드를 적용하면 자동 줄바꿈용 span까지 빨갛게 됩니다.
   [日本語] 見出し内の全spanへ赤を指定すると、自動改行用spanまで赤くなるため対象を限定します。 */
.rg-hero h1 .hero-title-accent { color: var(--rg-red); }
.rg-hero p {
  max-width: 770px;
  margin: 0;
  color: rgba(255,255,255,.78);
  font-size: clamp(.98rem, 1.4vw, 1.16rem);
  line-height: 1.85;
}
.rg-hero-actions {
  margin-top: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
}
.rg-main-button {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  min-height: 58px;
  padding: 0 12px 0 24px;
  border-radius: 18px;
  background: #fff;
  color: var(--rg-ink);
  font-weight: 900;
  box-shadow: 0 16px 36px rgba(0,0,0,.16);
  transition: transform .22s ease, box-shadow .22s ease;
}
.rg-main-button b {
  width: 38px; height: 38px;
  display: grid; place-items: center;
  border-radius: 13px;
  background: var(--rg-red);
  color: #fff;
}
.rg-main-button:hover { transform: translateY(-3px); box-shadow: 0 20px 44px rgba(0,0,0,.2); }
.rg-text-link { color: #fff; font-size: .9rem; font-weight: 900; }
.rg-text-link span { color: var(--rg-red); margin-left: 7px; }
.rg-scroll-cue {
  position: absolute;
  left: 30px;
  bottom: 30px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  color: rgba(255,255,255,.55);
  font-size: .62rem;
  letter-spacing: .18em;
  font-weight: 900;
}
.rg-scroll-cue span { width: 1px; height: 46px; background: linear-gradient(#fff, transparent); }

/* General sections */
.rg-section { padding: 112px 0; }
.rg-section-title {
  margin-bottom: 42px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 30px;
}
.rg-section-title h2 {
  margin: 0;
  color: var(--rg-ink);
  font-size: clamp(2.1rem, 4.2vw, 4.6rem);
  font-weight: 1000;
  letter-spacing: -.06em;
  line-height: 1;
}
.rg-section-title > a {
  color: var(--rg-ink);
  font-size: .86rem;
  font-weight: 900;
  border-bottom: 2px solid var(--rg-red);
  padding-bottom: 5px;
}
.rg-section-title > p {
  max-width: 480px;
  margin: 0;
  color: #647280;
  font-weight: 700;
}
.rg-overline {
  display: block;
  margin-bottom: 12px;
  color: var(--rg-red);
  font-size: .74rem;
  letter-spacing: .2em;
  font-weight: 1000;
}

/* News */
.rg-news-section { background: #fff; }
.rg-news-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(340px, .75fr);
  gap: 28px;
}
.rg-feature-news {
  display: grid;
  grid-template-columns: 1.12fr .88fr;
  min-height: 520px;
  border-radius: 30px;
  overflow: hidden;
  background: var(--rg-ink);
  color: #fff;
  box-shadow: 0 22px 48px rgba(17,24,32,.14);
}
.rg-feature-art {
  position: relative;
  overflow: hidden;
  display: grid;
  place-items: center;
  background:
    linear-gradient(145deg, rgba(255,92,95,.18), transparent 50%),
    linear-gradient(45deg, #25384c, #12202d);
}
.rg-feature-art::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .25;
  background-image:
    linear-gradient(rgba(255,255,255,.2) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.2) 1px, transparent 1px);
  background-size: 42px 42px;
  transform: rotate(12deg) scale(1.2);
}
.rg-art-circle {
  position: absolute;
  width: 76%;
  aspect-ratio: 1;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,.25);
  box-shadow: inset 0 0 70px rgba(46,184,255,.08), 0 0 80px rgba(255,92,95,.12);
}
.rg-art-word {
  position: relative;
  z-index: 1;
  font-size: clamp(4rem, 8vw, 8rem);
  font-weight: 1000;
  letter-spacing: -.07em;
  transform: rotate(-8deg);
  text-shadow: 9px 9px 0 var(--rg-red);
}
.rg-art-tag {
  position: absolute;
  left: 26px;
  bottom: 24px;
  z-index: 2;
  padding: 8px 12px;
  border-radius: 999px;
  background: var(--rg-yellow);
  color: #1d2935;
  font-size: .7rem;
  letter-spacing: .12em;
  font-weight: 1000;
}
.rg-feature-copy {
  padding: 46px 40px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: #15212d;
}
.rg-feature-copy > span,
.rg-news-card small,
.rg-media-copy small,
.rg-project-copy small {
  color: var(--rg-red);
  font-size: .7rem;
  letter-spacing: .14em;
  font-weight: 1000;
}
.rg-feature-copy h3 {
  margin: 16px 0 18px;
  font-size: clamp(2rem, 3.2vw, 3.4rem);
  line-height: 1.12;
  letter-spacing: -.05em;
}
.rg-feature-copy p { color: rgba(255,255,255,.68); }
.rg-feature-copy b { margin-top: 22px; font-size: .84rem; }
.rg-news-stack { display: grid; gap: 18px; }
.rg-news-card {
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 20px;
  align-items: center;
  min-height: 150px;
  padding: 14px;
  border: 1px solid rgba(17,24,32,.08);
  border-radius: 24px;
  background: #f8f7f4;
  transition: transform .22s ease, box-shadow .22s ease;
}
.rg-news-card:hover { transform: translateY(-4px); box-shadow: 0 16px 34px rgba(17,24,32,.1); }
.rg-news-thumb {
  height: 100%;
  min-height: 120px;
  border-radius: 17px;
  display: grid;
  place-items: center;
  overflow: hidden;
  font-weight: 1000;
  letter-spacing: -.04em;
}
.thumb-event { background: linear-gradient(135deg, #ff6e6e, #ffb36d); color: #fff; font-size: 2.5rem; }
.thumb-contact { background: linear-gradient(135deg, #2eb8ff, #7de7ff); color: #0d3954; font-size: 1.65rem; }
.thumb-company { background: #182432; color: var(--rg-yellow); font-size: 1.45rem; }
.rg-news-card h3 { margin: 10px 0 0; font-size: 1.05rem; line-height: 1.45; }

/* Projects */
.rg-projects { background: var(--rg-paper); }
.rg-project-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.rg-project-card {
  min-height: 590px;
  border-radius: 30px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 18px 44px rgba(17,24,32,.09);
  display: flex;
  flex-direction: column;
  transition: transform .28s ease;
}
.rg-project-card:hover { transform: translateY(-8px); }
.rg-project-visual { position: relative; height: 360px; overflow: hidden; }
.rg-project-copy { padding: 30px 30px 34px; }
.rg-project-copy h3 { margin: 13px 0 14px; font-size: clamp(1.65rem, 2.3vw, 2.55rem); line-height: 1.08; letter-spacing: -.045em; }
.rg-project-copy p { margin: 0; color: #667482; }
.project-live .rg-project-visual { background: linear-gradient(160deg, #18283a, #0b1118); }
.stadium-screen {
  position: absolute; inset: 20% 18% auto;
  height: 38%;
  display: grid; place-items: center;
  border: 2px solid rgba(255,255,255,.5);
  color: #fff;
  font-size: clamp(3rem, 7vw, 6rem);
  font-weight: 1000;
  background: linear-gradient(135deg, rgba(255,92,95,.85), rgba(46,184,255,.65));
  transform: perspective(500px) rotateX(8deg);
  box-shadow: 0 18px 70px rgba(46,184,255,.28);
}
.stadium-floor {
  position: absolute; left: 8%; right: 8%; bottom: -20%; height: 52%;
  border-radius: 50%; border: 1px solid rgba(255,255,255,.2);
  background: radial-gradient(circle, rgba(46,184,255,.24), transparent 64%);
}
.stadium-light { position: absolute; top: -12%; width: 20%; height: 95%; background: linear-gradient(rgba(255,255,255,.32), transparent); filter: blur(12px); }
.light-a { left: 20%; transform: rotate(17deg); }
.light-b { right: 20%; transform: rotate(-17deg); }
.project-ip .rg-project-visual { background: linear-gradient(135deg, #ffe76f, #ff8a72 50%, #ff6269); }
.ip-cube {
  position: absolute;
  width: 130px; aspect-ratio: 1;
  display: grid; place-items: center;
  border-radius: 28px;
  background: rgba(255,255,255,.9);
  color: var(--rg-ink);
  font-size: 2.1rem; font-weight: 1000;
  box-shadow: 18px 20px 0 rgba(17,24,32,.12);
  transform: rotate(-12deg);
}
.cube-a { left: 18%; top: 18%; }
.cube-b { right: 13%; top: 34%; transform: rotate(13deg); background: #dff5ff; }
.cube-c { left: 34%; bottom: 6%; transform: rotate(5deg); background: #fff4f4; }
.project-region .rg-project-visual { background: linear-gradient(150deg, #dff5ff, #90dcff); }
.region-map {
  position: absolute; inset: 13%;
  border-radius: 42% 58% 65% 35% / 48% 40% 60% 52%;
  background: rgba(255,255,255,.7);
  box-shadow: inset 0 0 0 2px rgba(17,24,32,.06);
  transform: rotate(-12deg);
}
.region-pin { position: absolute; width: 22px; height: 22px; border-radius: 50% 50% 50% 0; background: var(--rg-red); transform: rotate(-45deg); box-shadow: 0 8px 18px rgba(255,92,95,.25); }
.pin-a { left: 26%; top: 28%; }
.pin-b { right: 24%; top: 48%; background: var(--rg-yellow); }
.pin-c { left: 48%; bottom: 22%; background: var(--rg-blue); }
.project-region .rg-project-visual b {
  position: absolute; right: 22px; bottom: 18px;
  color: var(--rg-ink); font-size: 2.15rem; line-height: .88; letter-spacing: -.06em;
}

/* Entertainment */
.rg-entertainment { background: #111820; color: #fff; }
.rg-entertainment .rg-section-title h2 { color: #fff; }
.rg-media-grid { display: grid; grid-template-columns: 1.35fr .825fr .825fr; gap: 20px; }
.rg-media-card {
  min-height: 520px;
  display: flex;
  flex-direction: column;
  border-radius: 28px;
  overflow: hidden;
  background: #1a2734;
  transition: transform .25s ease;
}
.rg-media-card:hover { transform: translateY(-6px); }
.rg-media-art { position: relative; flex: 1; min-height: 350px; overflow: hidden; display: grid; place-items: center; }
.media-global { background: linear-gradient(145deg, #2eb8ff, #4555ff 55%, #ff5c5f); }
.media-globe { position: absolute; width: 72%; aspect-ratio: 1; border-radius: 50%; border: 1px solid rgba(255,255,255,.45); box-shadow: inset 0 0 70px rgba(255,255,255,.12); }
.media-globe::before, .media-globe::after { content: ""; position: absolute; inset: 15%; border-radius: 50%; border: 1px solid rgba(255,255,255,.34); transform: rotate(55deg); }
.media-globe::after { transform: rotate(-55deg); }
.media-global strong { position: relative; z-index: 2; font-size: clamp(3.5rem, 7vw, 7.5rem); line-height: .8; letter-spacing: -.07em; text-align: center; }
.media-community { background: linear-gradient(150deg, #ffce59, #ff816b); }
.media-community > strong { position: absolute; top: 24px; left: 24px; color: var(--rg-ink); font-size: clamp(2rem, 4vw, 4rem); transform: rotate(-6deg); }
.community-face { position: absolute; width: 130px; aspect-ratio: 1; border-radius: 42% 58% 52% 48%; background: #fff; box-shadow: 12px 14px 0 rgba(17,24,32,.12); }
.community-face::before { content: "••"; position: absolute; left: 0; right: 0; top: 34%; text-align: center; color: var(--rg-ink); letter-spacing: .4em; font-size: 1.2rem; }
.community-face::after { content: "⌣"; position: absolute; left: 0; right: 0; bottom: 25%; text-align: center; color: var(--rg-red); font-size: 2rem; }
.f1 { left: 12%; bottom: 10%; transform: rotate(-8deg); }
.f2 { right: 8%; bottom: 20%; transform: rotate(11deg); background: #dff5ff; }
.f3 { left: 42%; top: 34%; width: 100px; transform: rotate(4deg); background: #fff5ca; }
.media-content { background: linear-gradient(145deg, #dff5ff, #62caff); color: var(--rg-ink); }
.content-play { position: absolute; right: 24px; top: 24px; width: 62px; height: 62px; display: grid; place-items: center; border-radius: 50%; background: #fff; box-shadow: 0 12px 28px rgba(17,24,32,.12); }
.media-content strong { font-size: clamp(3rem, 5vw, 5.6rem); line-height: .84; letter-spacing: -.06em; transform: rotate(8deg); }
.rg-media-copy { padding: 24px 26px 28px; }
.rg-media-copy h3 { margin: 10px 0 16px; font-size: 1.45rem; }
.rg-media-copy span { color: rgba(255,255,255,.66); font-size: .82rem; font-weight: 800; }

/* CTA */
.rg-partner-cta { padding: 112px 0; background: var(--rg-red); color: #fff; overflow: hidden; }
.rg-partner-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; align-items: center; }
.rg-partner-copy h2 { margin: 12px 0 22px; font-size: clamp(3rem, 6vw, 6.2rem); line-height: .94; letter-spacing: -.07em; color: #fff; }
.rg-partner-copy p { color: rgba(255,255,255,.82); }
.rg-dark-button { margin-top: 22px; background: var(--rg-ink); color: #fff; }
.rg-dark-button b { background: #fff; color: var(--rg-ink); }
.rg-partner-visual { position: relative; min-height: 470px; display: grid; place-items: center; }
.rg-partner-visual::before { content:""; position:absolute; width: 390px; aspect-ratio:1; border-radius:50%; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.28); }
.rg-partner-visual > strong { position: relative; z-index: 3; font-size: clamp(4rem, 9vw, 8.5rem); letter-spacing: -.07em; transform: rotate(-8deg); text-shadow: 12px 12px 0 rgba(17,24,32,.2); }
.partner-card { position: absolute; z-index: 2; min-width: 120px; padding: 18px 20px; border-radius: 18px; background: #fff; color: var(--rg-ink); text-align: center; font-weight: 1000; box-shadow: 12px 14px 0 rgba(17,24,32,.15); }
.pc-a { top: 8%; left: 10%; transform: rotate(-9deg); }
.pc-b { top: 18%; right: 8%; transform: rotate(11deg); background: var(--rg-yellow); }
.pc-c { bottom: 10%; left: 12%; transform: rotate(7deg); background: var(--rg-soft-blue); }
.pc-d { bottom: 15%; right: 9%; transform: rotate(-12deg); }

/* Footer */
.rg-footer { background: #0d141c; border: 0; color: #fff; }
.rg-footer .brand { color: #fff; }
.rg-footer .footer-brand p,
.rg-footer .footer-links a,
.rg-footer .muted,
.rg-footer .footer-bottom { color: rgba(255,255,255,.58); }
.rg-footer .footer-title { color: #fff; }
.rg-footer .footer-bottom { border-top-color: rgba(255,255,255,.1); }

/* Sound button */
@media (max-width: 1100px) {
  .rg-news-layout { grid-template-columns: 1fr; }
  .rg-news-stack { grid-template-columns: repeat(3, 1fr); }
  .rg-news-card { grid-template-columns: 1fr; }
  .rg-news-thumb { min-height: 150px; }
  .rg-project-grid { grid-template-columns: 1fr 1fr; }
  .rg-project-card:last-child { grid-column: 1 / -1; min-height: 500px; }
  .rg-project-card:last-child .rg-project-visual { height: 300px; }
  .rg-media-grid { grid-template-columns: 1fr 1fr; }
  .rg-media-card.media-main { grid-column: 1 / -1; }
}

@media (max-width: 820px) {
  .rg-container { width: min(calc(100% - 32px), 1320px); }
  .header-shell { width: min(calc(100% - 28px), 1500px); }
  .riot-header .menu-toggle { display: block; margin-left: auto; color: #fff; }
  .riot-nav {
    position: fixed;
    top: 68px;
    left: 14px;
    right: 14px;
    display: grid;
    background: rgba(17,24,32,.98);
    padding: 12px;
    border-radius: 18px;
    border: 1px solid rgba(255,255,255,.1);
    opacity: 0;
    pointer-events: none;
    transform: translateY(-10px);
  }
  .riot-nav.is-open { opacity: 1; pointer-events: auto; transform: none; }
  .riot-nav a { padding: 14px; }
  .riot-nav .nav-contact { margin: 4px 0 0; text-align: center; }
  .rg-hero-content { padding-top: 104px; }
  .rg-hero h1 br { display: none; }
  .rg-scroll-cue { display: none; }
  .rg-section { padding: 82px 0; }
  .rg-section-title { display: block; }
  .rg-section-title > a, .rg-section-title > p { display: inline-block; margin-top: 20px; }
  .rg-feature-news { grid-template-columns: 1fr; }
  .rg-feature-art { min-height: 360px; }
  .rg-feature-copy { padding: 34px 28px; }
  .rg-news-stack { grid-template-columns: 1fr; }
  .rg-news-card { grid-template-columns: 140px 1fr; }
  .rg-project-grid { grid-template-columns: 1fr; }
  .rg-project-card:last-child { grid-column: auto; }
  .rg-media-grid { grid-template-columns: 1fr; }
  .rg-media-card.media-main { grid-column: auto; }
  .rg-partner-grid { grid-template-columns: 1fr; }
  .rg-partner-visual { min-height: 390px; }
}

@media (max-width: 540px) {
  .rg-hero-content { padding-bottom: 54px; }
  .rg-kicker { font-size: .62rem; letter-spacing: .18em; }
  .rg-logo-stage { height: 150px; }
  .home-riot-layout .ondo-3d { font-size: 4.3rem; }
  .rg-hero h1 { font-size: 2.35rem; }
  .rg-hero p br { display: none; }
  .rg-hero-actions { flex-direction: column; gap: 16px; }
  .rg-main-button { min-width: 210px; }
  .rg-feature-news { min-height: auto; }
  .rg-feature-art { min-height: 280px; }
  .rg-news-card { grid-template-columns: 1fr; }
  .rg-project-card { min-height: 520px; }
  .rg-project-visual { height: 310px; }
  .rg-media-card { min-height: 470px; }
  .rg-media-art { min-height: 310px; }
  .rg-partner-visual { min-height: 330px; }
  .rg-partner-visual::before { width: 270px; }
  .partner-card { min-width: 88px; padding: 12px 14px; font-size: .78rem; }
}

/* ======================================================================
   ONDO ADMIN-CONNECTED FINAL THEME
   [한국어] 관리자 페이지의 폰트·색상 설정과 정적인 ONDO 로고를 반영합니다.
   [日本語] 管理画面のフォント・色設定と静的なONDOロゴを反映します。
   ====================================================================== */
body { font-family: var(--font-body-admin, Inter, "Noto Sans JP", "Noto Sans KR", system-ui, sans-serif); }
h1,h2,h3,.rg-section-title,.rg-project-copy,.rg-media-copy { font-family: var(--font-heading-admin, Inter, "Noto Sans JP", "Noto Sans KR", system-ui, sans-serif); }
.home-riot-layout {
  --rg-red: var(--admin-accent, #ff4d4d);
  --rg-blue: var(--admin-primary, #2eb8ff);
  --rg-ink: var(--admin-ink, #111820);
}

/* 한국어: 관리자에서 입력한 줄바꿈은 큰 화면에서만 유지합니다.
   日本語: 管理画面で入力した改行は大画面のみ維持します。 */
.editable-multiline { white-space: pre-line; }

/* 한국어: 애니메이션·블러 없이 선명한 정적 게임 타이틀형 로고입니다.
   日本語: アニメーション・ぼかし無しの鮮明な静的ゲームタイトル風ロゴです。 */
.home-riot-layout .rg-logo-stage {
  width: min(980px, 94vw);
  height: auto;
  min-height: clamp(150px, 22vw, 250px);
  display: grid;
  place-items: center;
  margin: 6px auto 10px;
  overflow: visible;
}
.ondo-wordmark {
  display: block;
  max-width: 100%;
  padding: .04em .12em .11em .04em;
  color: var(--logo-face, #ffffff);
  font-family: var(--font-logo-admin, Impact, Haettenschweiler, "Arial Black", sans-serif);
  font-size: clamp(5.2rem, 15vw, 10.8rem);
  font-weight: 1000;
  font-style: normal;
  line-height: .82;
  letter-spacing: -.055em;
  text-transform: uppercase;
  white-space: nowrap;
  -webkit-text-stroke: 1.2px rgba(255,255,255,.94);
  text-rendering: geometricPrecision;
  -webkit-font-smoothing: antialiased;
  transform: perspective(1200px) rotateX(9deg) scaleX(.965);
  transform-origin: center bottom;
  text-shadow:
    0 1px 0 #ffffff,
    1px 2px 0 #f2f9ff,
    2px 3px 0 #e4f3ff,
    3px 4px 0 color-mix(in srgb, var(--logo-edge,#ff8585) 36%, #fff),
    4px 5px 0 color-mix(in srgb, var(--logo-edge,#ff8585) 58%, #fff),
    5px 6px 0 var(--logo-edge,#ff8585),
    6px 7px 0 color-mix(in srgb, var(--logo-depth,#2ea7e7) 55%, #fff),
    7px 8px 0 color-mix(in srgb, var(--logo-depth,#2ea7e7) 76%, #163f62),
    8px 9px 0 var(--logo-depth,#2ea7e7),
    14px 20px 30px rgba(6,31,53,.22),
    24px 34px 56px rgba(46,184,255,.12);
}

/* 한국어: 화면 폭에 따라 제목이 자연스럽게 재배치됩니다.
   日本語: 画面幅に応じて見出しが自然に折り返されます。 */
.hero-responsive-title,
.rg-section-title h2,
.rg-feature-copy h3,
.rg-news-card h3,
.rg-project-copy h3,
.rg-media-copy h3,
.rg-partner-copy h2,
.page-hero h1,
.article-head h1 {
  text-wrap: balance;
  line-break: strict;
  word-break: normal;
  overflow-wrap: break-word;
}
.hero-title-line {
  display: block;
  color: #fff !important;
}
.hero-title-accent { color: var(--rg-red) !important; }
.rg-hero p,
.rg-feature-copy p,
.rg-project-copy p,
.rg-media-copy p,
.rg-partner-copy p,
.article-body,
.card p {
  line-break: strict;
  word-break: normal;
  overflow-wrap: break-word;
}
.rg-partner-copy h2 span { display: block; }
.rg-partner-copy h2 .line-2 { margin-top: .05em; }

@media (max-width: 820px) {
  .hero-responsive-title { max-width: 13em; }
  .hero-title-line { display: inline; }
  .hero-title-line:first-child::after { content: " "; }
  .editable-multiline { white-space: normal; }
  .rg-partner-copy h2 span { display: inline; }
  .rg-partner-copy h2 span:first-child::after { content: " "; }
}

@media (max-width: 540px) {
  .home-riot-layout .rg-logo-stage {
    min-height: 126px;
    margin-bottom: 4px;
  }
  .ondo-wordmark {
    font-size: clamp(4.15rem, 22vw, 5.2rem);
    letter-spacing: -.05em;
    padding-right: .1em;
    transform: perspective(900px) rotateX(7deg) scaleX(.96);
  }
  .rg-hero-content { width: min(calc(100% - 28px), 980px); }
  .rg-hero h1 { font-size: clamp(2.2rem, 11vw, 3rem); line-height: 1.08; }
  .rg-section-title h2,
  .rg-partner-copy h2 { line-height: 1.04; }
}

@media (prefers-reduced-motion: reduce) {
  .ondo-wordmark { transform: perspective(1200px) rotateX(9deg) scaleX(.965); }
}

/* 한국어: 메인 배경 장식도 정적으로 고정해 첫 화면이 차분하게 보이도록 합니다.
   日本語: メイン背景の装飾も静止させ、落ち着いたファーストビューにします。 */
.rg-hero-bg .rg-orb,
.rg-hero-bg .rg-particle {
  animation: none !important;
}

/* ========================================================================== 
   2026-07-13 대형 화면·관리자 레이아웃 보정
   한국어: 32인치/울트라와이드에서 vw 단위가 지나치게 커지는 문제를 방지합니다.
   日本語: 32インチ/ウルトラワイドでvw単位が過度に大きくなる問題を防ぎます。
   ========================================================================== */

/* 전체 콘텐츠 폭은 관리자 페이지에서 1100~1800px 사이로 변경할 수 있습니다. */
.home-riot-layout .rg-container {
  width: min(calc(100% - 64px), var(--layout-max-width, 1440px));
}

/* 프로젝트 카드는 관리자에서 2열 또는 3열을 선택할 수 있습니다. */
.home-riot-layout .rg-project-grid {
  grid-template-columns: repeat(var(--project-columns-admin, 3), minmax(0, 1fr));
  align-items: stretch;
}

.home-riot-layout .rg-project-copy {
  padding: 32px 34px 38px;
  min-width: 0;
}

/*
  한국어: 프로젝트 제목에 입력한 Enter 줄바꿈을 그대로 반영합니다.
  日本語: プロジェクト見出しで入力したEnter改行をそのまま反映します。
*/
.home-riot-layout .rg-project-copy h3.admin-linebreak-title {
  margin: 13px 0 16px;
  font-size: clamp(1.7rem, 2.1vw, var(--project-title-size-admin, 2.35rem));
  line-height: var(--project-title-line-admin, 1.08);
  letter-spacing: -.04em;
  white-space: pre-line;
  text-wrap: initial;
  word-break: keep-all;
  overflow-wrap: normal;
}

.home-riot-layout .rg-project-copy p {
  font-size: var(--project-text-size-admin, 1rem);
  line-height: 1.72;
}

/* 2열 선택 시 마지막 카드가 어색하게 한쪽에 남지 않도록 전체 폭을 사용합니다. */
html[data-project-columns="2"] .home-riot-layout .rg-project-card:last-child {
  grid-column: 1 / -1;
}
html[data-project-columns="2"] .home-riot-layout .rg-project-card:last-child .rg-project-copy {
  max-width: 860px;
}

/* CTA는 왼쪽 문구 영역을 넓혀 일본어 제목이 불필요하게 3단으로 갈라지지 않게 합니다. */
.home-riot-layout .rg-partner-grid {
  grid-template-columns: minmax(0, var(--partner-copy-width-admin, 58%)) minmax(0, 1fr);
  gap: clamp(42px, 5vw, 86px);
  align-items: center;
}

.home-riot-layout .rg-partner-copy {
  min-width: 0;
  max-width: 100%;
}

.home-riot-layout .rg-partner-copy h2 {
  margin: 12px 0 24px;
  max-width: none;
  font-size: clamp(3.1rem, 4.6vw, var(--partner-title-size-admin, 5.2rem));
  line-height: var(--partner-title-line-admin, 1.02);
  letter-spacing: -.055em;
  text-wrap: initial;
}

.home-riot-layout .rg-partner-copy h2 span {
  display: block;
  white-space: nowrap;
}

.home-riot-layout .rg-partner-copy h2 .line-2 {
  margin-top: .06em;
}

.home-riot-layout .rg-partner-copy p {
  max-width: 46em;
  font-size: var(--partner-text-size-admin, 1.08rem);
  line-height: 1.8;
}

/* 중간 화면에서는 카드 2열, CTA 문장은 자동 축소됩니다. */
@media (max-width: 1180px) {
  .home-riot-layout .rg-container {
    width: min(calc(100% - 44px), var(--layout-max-width, 1440px));
  }
  .home-riot-layout .rg-project-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .home-riot-layout .rg-project-card:last-child {
    grid-column: 1 / -1;
  }
  .home-riot-layout .rg-project-card:last-child .rg-project-copy {
    max-width: 820px;
  }
  .home-riot-layout .rg-partner-copy h2 {
    font-size: clamp(3rem, 5vw, 4.4rem);
  }
}

/* 태블릿 이하에서는 한 열로 전환하고 강제 한 줄 고정을 해제합니다. */
@media (max-width: 820px) {
  .home-riot-layout .rg-container {
    width: min(calc(100% - 32px), var(--layout-max-width, 1440px));
  }
  .home-riot-layout .rg-project-grid {
    grid-template-columns: 1fr;
  }
  .home-riot-layout .rg-project-card:last-child {
    grid-column: auto;
  }
  .home-riot-layout .rg-project-copy h3.admin-linebreak-title {
    font-size: clamp(1.75rem, 7vw, 2.3rem);
  }
  .home-riot-layout .rg-partner-grid {
    grid-template-columns: 1fr;
  }
  .home-riot-layout .rg-partner-copy h2 span {
    display: inline;
    white-space: normal;
  }
  .home-riot-layout .rg-partner-copy h2 span:first-child::after {
    content: " ";
  }
}

@media (max-width: 540px) {
  .home-riot-layout .rg-container {
    width: min(calc(100% - 24px), var(--layout-max-width, 1440px));
  }
  .home-riot-layout .rg-project-copy {
    padding: 26px 24px 30px;
  }
  .home-riot-layout .rg-project-copy h3.admin-linebreak-title {
    font-size: clamp(1.65rem, 8vw, 2.05rem);
    line-height: 1.12;
  }
  .home-riot-layout .rg-partner-copy h2 {
    font-size: clamp(2.7rem, 14vw, 4rem);
    line-height: 1.04;
  }
}

/* ========================================================================== 
   협력사 소개 / パートナー紹介
   ========================================================================== */
.partners-page-hero {
  background:
    radial-gradient(circle at 82% 12%, rgba(46,184,255,.14), transparent 24%),
    radial-gradient(circle at 16% 26%, rgba(255,77,77,.10), transparent 20%),
    linear-gradient(180deg, rgba(255,255,255,.84), rgba(247,251,255,.98));
}
.partners-profile-grid {
  display:grid;
  grid-template-columns:1fr;
  gap:58px;
}
.partner-group { min-width:0; }
.partner-group-heading {
  display:flex;
  align-items:center;
  gap:16px;
  margin-bottom:22px;
  padding-bottom:16px;
  border-bottom:1px solid rgba(32,54,76,.18);
}
.partner-group-heading span {
  flex:0 0 auto;
  color:var(--ondo-mint,#2da39e);
  font-size:.85rem;
  font-weight:950;
  letter-spacing:.1em;
}
.partner-group-heading h3 {
  flex:1 1 auto;
  min-width:0;
  max-width:100%;
  margin:0;
  color:#20364c;
  font-size:clamp(1.45rem,2.5vw,2.25rem);
  line-height:1.18;
  letter-spacing:-.03em;
  white-space:normal;
  word-break:normal;
  overflow-wrap:break-word;
  text-wrap:balance;
}
.partner-group-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
}
.partner-group-grid[data-count="1"] {
  grid-template-columns:minmax(0,1fr);
  max-width:720px;
}
.partner-group-grid[data-count="2"] { grid-template-columns:repeat(2,minmax(0,1fr)); }
.partner-profile-card {
  min-width:0;
  max-width:100%;
  padding:24px;
  border:1px solid rgba(46,184,255,.13);
  border-radius:24px;
  background:#fff;
  box-shadow:0 18px 42px rgba(30,72,110,.10);
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}
.partner-profile-card:hover {
  transform:translateY(-5px);
  border-color:rgba(46,184,255,.30);
  box-shadow:0 24px 52px rgba(30,72,110,.15);
}
.partner-logo {
  min-height:150px;
  padding:24px;
  display:grid;
  place-items:center;
  border-radius:18px;
  background:linear-gradient(145deg,#f8fbfe,#eef6fc);
  border:1px solid rgba(46,184,255,.09);
  overflow:hidden;
}
.partner-logo img {
  display:block;
  width:100%;
  height:100px;
  object-fit:contain;
  object-position:center;
}
.partner-logo > span {
  display:block;
  max-width:100%;
  color:#37516a;
  font-weight:1000;
  font-size:clamp(2rem,4vw,3.4rem);
  letter-spacing:-.05em;
}
.partner-logo > span.partner-public-name {
  font-size:clamp(2rem,3.2vw,3rem);
  line-height:1.15;
  letter-spacing:.04em;
  text-align:center;
  white-space:normal;
  word-break:normal;
  overflow-wrap:break-word;
  text-wrap:balance;
}
.partner-profile-copy { min-width:0; padding:22px 4px 2px; }
.partner-profile-copy small {
  display:block;
  max-width:100%;
  margin-bottom:9px;
  color:var(--admin-accent,#ff4d4d);
  font-size:.72rem;
  font-weight:900;
  line-height:1.5;
  letter-spacing:.12em;
  text-transform:uppercase;
  white-space:normal;
  word-break:normal;
  overflow-wrap:anywhere;
}
.partner-profile-copy h2 {
  max-width:100%;
  margin:0 0 10px;
  color:#20364c;
  font-size:clamp(1.35rem,2.4vw,2rem);
  line-height:1.25;
  white-space:normal;
  word-break:normal;
  overflow-wrap:anywhere;
  text-wrap:balance;
}
.partner-profile-copy p {
  max-width:100%;
  margin:0 0 18px;
  color:#64798d;
  line-height:1.78;
  white-space:normal;
  word-break:normal;
  overflow-wrap:anywhere;
  text-wrap:pretty;
}
.partner-profile-copy a {
  display:inline-flex;
  align-items:center;
  min-height:42px;
  max-width:100%;
  padding:10px 15px;
  border-radius:999px;
  color:#1e4f73;
  background:#edf8ff;
  font-weight:850;
  line-height:1.35;
  text-align:center;
  white-space:normal;
  word-break:normal;
  overflow-wrap:break-word;
}
.partners-empty {
  grid-column:1/-1;
  padding:70px 24px;
  text-align:center;
  color:#72869a;
  border:1px dashed rgba(46,184,255,.25);
  border-radius:24px;
  background:rgba(255,255,255,.72);
}

.home-partners-section {
  padding:74px 0;
  background:#f7fafc;
}
.home-partners-head {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:24px;
  margin-bottom:28px;
}
.home-partners-head h2 {
  margin:0;
  color:#1f354a;
  font-size:clamp(2rem,4vw,3.5rem);
}
.home-partners-head a { color:#1e6b9c; font-weight:900; }
.home-partners-list {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
}
.home-partner-item {
  min-width:0;
  min-height:150px;
  padding:18px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
  border:1px solid rgba(46,184,255,.11);
  border-radius:20px;
  background:#fff;
  box-shadow:0 12px 28px rgba(30,72,110,.07);
}
.home-partner-item > span {
  display:block;
  width:100%;
  max-width:100%;
  color:#526b81;
  font-size:.82rem;
  font-weight:800;
  line-height:1.4;
  text-align:center;
  white-space:normal;
  word-break:normal;
  overflow-wrap:break-word;
  text-wrap:balance;
}
.partner-logo-compact {
  width:100%;
  min-height:76px;
  padding:8px;
  border:0;
  background:transparent;
}
.partner-logo-compact img { height:64px; }
.partner-logo-compact > span { font-size:1.8rem; }
.partner-logo-compact > span.partner-public-name { font-size:clamp(1.3rem,2.2vw,1.8rem); }

@media (max-width:980px) {
  .partner-group-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .home-partners-list { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:620px) {
  .partner-group-grid,.home-partners-list { grid-template-columns:1fr; }
  .partner-group-grid[data-count] { max-width:100%; }
  .home-partners-head { display:block; }
  .home-partners-head a { display:inline-block; margin-top:14px; }
  .partner-logo { min-height:130px; }
}

/* ================================================================
   T1 EVENT TEASER PAGES / T1イベント・ティザーページ
   [한국어] future-01.html(12월 메인 행사), future-02.html(9월 팝업)
   [日本語] future-01.html（12月メイン）、future-02.html（9月ポップアップ）
   ================================================================ */
:root {
  --t1-red: #e2012d;
  --t1-red-bright: #ff173f;
  --t1-black: #090b0f;
  --t1-paper: #f5f2ed;
}

/* Main project cards connected to teaser pages */
.project-link-card { color: inherit; text-decoration: none; }
.project-link-card:focus-visible { outline: 4px solid rgba(226,1,45,.35); outline-offset: 4px; }
.project-card-link {
  display: inline-flex;
  margin-top: 20px;
  color: var(--t1-red);
  font-size: .78rem;
  font-weight: 1000;
  letter-spacing: .1em;
}
.t1-event-card-visual,
.t1-popup-card-visual { isolation: isolate; }
.t1-event-card-visual > img,
.t1-popup-card-visual > img {
  position: absolute;
  z-index: 3;
  width: min(150px, 34%);
  height: auto;
  left: 24px;
  top: 24px;
  object-fit: contain;
}
.t1-event-card-visual > img { filter: drop-shadow(0 8px 18px rgba(0,0,0,.24)); }
.t1-event-card-visual .stadium-screen {
  inset: 31% 13% auto;
  height: 33%;
  color: #fff;
  background: var(--t1-red);
  border-color: rgba(255,255,255,.78);
  font-size: clamp(2.3rem, 5vw, 5rem);
  letter-spacing: -.06em;
}
.t1-popup-card-visual { background: linear-gradient(135deg, #fff 0 30%, #ffddd9 30% 47%, #ff7f78 47% 70%, var(--t1-red) 70%); }
.t1-popup-card-visual > img { width: min(142px, 32%); }
.t1-popup-card-visual .ip-cube { font-size: 1.4rem; border: 2px solid var(--t1-black); }
.project-coming-label {
  position: absolute;
  z-index: 5;
  right: 20px;
  bottom: 18px;
  padding: 9px 13px;
  border-radius: 999px;
  background: #fff;
  color: var(--t1-red);
  font-size: .7rem;
  letter-spacing: .12em;
  box-shadow: 0 8px 20px rgba(0,0,0,.15);
}
.project-coming-label.dark-label { background: var(--t1-black); color: #fff; }

.event-teaser-page {
  margin: 0;
  background: var(--t1-black);
  color: #fff;
  font-family: var(--font-body-admin, Inter, "Noto Sans JP", "Noto Sans KR", system-ui, sans-serif);
}
.event-teaser-page h1,
.event-teaser-page h2,
.event-teaser-page h3 { font-family: var(--font-heading-admin, Inter, "Noto Sans JP", sans-serif); }
.event-header {
  position: absolute;
  width: 100%;
  color: #fff;
  background: transparent;
  border-bottom: 1px solid rgba(255,255,255,.12);
}
.event-header.scrolled {
  position: fixed;
  background: rgba(9,11,15,.88);
  border-color: rgba(255,255,255,.12);
  backdrop-filter: blur(16px);
}
.event-header .brand,
.event-header .riot-nav a { color: #fff; }
.event-header .brand-mark { border-color: rgba(255,255,255,.42); }
.event-header .brand-mark::after { border-color: var(--t1-red); }
.event-header .nav-contact { background: var(--t1-red); }
.event-container { width: min(calc(100% - 48px), 1360px); margin: 0 auto; }
.event-hero {
  position: relative;
  min-height: 100svh;
  overflow: hidden;
  display: grid;
  align-items: center;
  padding: 126px 0 80px;
}
.event-red-hero {
  background:
    radial-gradient(circle at 75% 30%, rgba(226,1,45,.42), transparent 31%),
    linear-gradient(116deg, #080a0e 0 48%, #12151b 48% 59%, #e2012d 59% 100%);
}
.event-grid-noise {
  position: absolute;
  inset: 0;
  opacity: .22;
  background-image:
    linear-gradient(rgba(255,255,255,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.08) 1px, transparent 1px);
  background-size: 54px 54px;
  mask-image: linear-gradient(90deg, #000, transparent 68%);
}
.event-hero-inner {
  position: relative;
  z-index: 2;
  width: min(calc(100% - 48px), 1360px);
  margin: 0 auto;
}
.event-logo-lockup {
  display: flex;
  align-items: center;
  gap: 22px;
  margin-bottom: 36px;
}
.event-logo-lockup img {
  display: block;
  width: clamp(108px, 13vw, 188px);
  height: 88px;
  object-fit: contain;
}
.event-logo-lockup span { color: rgba(255,255,255,.48); font-size: 1.8rem; }
.event-logo-lockup strong { font-size: 1.45rem; letter-spacing: .12em; }
.event-badge {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  margin: 0 0 22px;
  padding: 0 14px;
  border: 1px solid rgba(255,255,255,.3);
  border-radius: 999px;
  font-size: .75rem;
  font-weight: 900;
  letter-spacing: .14em;
}
.event-display-title {
  max-width: 940px;
  margin: 0;
  font-size: clamp(4.4rem, 10.5vw, 10.4rem);
  line-height: .8;
  letter-spacing: -.075em;
  font-weight: 1000;
  white-space: pre-line;
  text-wrap: balance;
}
.event-jp-catch {
  max-width: 690px;
  margin: 36px 0 0;
  color: #fff;
  font-size: clamp(1.8rem, 4vw, 4.4rem);
  line-height: 1.04;
  letter-spacing: -.05em;
  font-weight: 900;
  white-space: pre-line;
  text-wrap: balance;
}
.event-facts {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  gap: 1px;
  max-width: 880px;
  margin-top: 50px;
  background: rgba(255,255,255,.2);
  border: 1px solid rgba(255,255,255,.2);
}
.event-facts > div { padding: 21px 24px; background: rgba(9,11,15,.68); }
.event-facts small { display: block; margin-bottom: 5px; color: rgba(255,255,255,.55); font-size: .64rem; letter-spacing: .16em; }
.event-facts strong { font-size: clamp(.95rem, 1.4vw, 1.2rem); }
.event-hero-word {
  position: absolute;
  z-index: 1;
  right: -3vw;
  bottom: -4vw;
  color: rgba(255,255,255,.08);
  font-size: clamp(9rem, 26vw, 28rem);
  line-height: .7;
  letter-spacing: -.09em;
  font-weight: 1000;
  pointer-events: none;
}
.event-overview-section { padding: 120px 0; background: #f7f4ef; color: var(--t1-black); }
.event-overview-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 90px; align-items: start; }
.event-section-label { color: var(--t1-red); font-size: .75rem; font-weight: 1000; letter-spacing: .16em; }
.event-overview-grid h2,
.event-video-grid h2,
.event-section-head h2,
.popup-intro-grid h2 {
  margin: 18px 0 0;
  font-size: clamp(2.4rem, 5.4vw, 5.7rem);
  line-height: .98;
  letter-spacing: -.065em;
}
.event-overview-grid p { margin: 0; color: #4c525a; font-size: clamp(1.03rem, 1.5vw, 1.22rem); line-height: 1.9; white-space: pre-line; }
.event-release-note { margin-top: 28px !important; color: var(--t1-red) !important; font-size: .8rem !important; font-weight: 1000; letter-spacing: .12em; }
.event-program-section { padding: 110px 0; background: var(--t1-black); }
.event-section-head { display: flex; justify-content: space-between; align-items: end; gap: 30px; }
.event-section-head h2 { margin: 0; }
.event-coming-panel {
  display: grid;
  grid-template-columns: 90px 1fr 120px;
  align-items: center;
  min-height: 190px;
  margin-top: 48px;
  padding: 26px 40px;
  border: 1px solid rgba(255,255,255,.16);
  background: linear-gradient(90deg, rgba(255,255,255,.04), rgba(226,1,45,.18));
}
.event-coming-panel span { color: var(--t1-red); font-weight: 1000; }
.event-coming-panel strong { font-size: clamp(2.5rem, 6vw, 6.4rem); letter-spacing: -.055em; }
.event-coming-panel i { height: 2px; background: var(--t1-red); }
.event-program-note { margin: 22px 0 0; color: rgba(255,255,255,.58); }
.event-video-section { padding: 120px 0; background: #fff; color: var(--t1-black); }
.event-video-grid { display: grid; grid-template-columns: .78fr 1.22fr; gap: 72px; align-items: center; }
.event-video-grid p { color: #5c6570; line-height: 1.8; }
.event-outline-button {
  display: inline-flex;
  margin-top: 24px;
  padding: 15px 20px;
  border: 2px solid var(--t1-black);
  color: var(--t1-black);
  font-size: .78rem;
  font-weight: 1000;
  letter-spacing: .08em;
}
.event-video-frame {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  border-radius: 6px;
  background: var(--t1-black);
  box-shadow: 20px 22px 0 var(--t1-red);
}
.event-video-frame iframe { width: 100%; height: 100%; border: 0; }
.event-video-frame.is-empty::after { content: "VIDEO COMING SOON"; position: absolute; inset: 0; display: grid; place-items: center; color: #fff; font-weight: 1000; }
.event-final-banner { padding: 70px 0; background: var(--t1-red); }
.event-final-banner .event-container { display: grid; grid-template-columns: 170px 1fr auto; gap: 34px; align-items: center; }
.event-final-banner img { width: 150px; height: 76px; object-fit: contain; filter: brightness(0) invert(1); }
.event-final-banner p { margin: 0; font-size: clamp(2.1rem, 5vw, 5rem); line-height: .9; font-weight: 1000; letter-spacing: -.06em; }
.event-final-banner a { color: #fff; font-size: .78rem; font-weight: 1000; letter-spacing: .08em; border-bottom: 1px solid #fff; }
.event-footer { padding-top: 32px; }
.event-footer .footer-bottom { margin: 0; }

/* Popup teaser */
.popup-hero {
  color: var(--t1-black);
  background:
    linear-gradient(108deg, #f8f4ef 0 54%, transparent 54%),
    linear-gradient(135deg, #ffb4a5 0 46%, var(--t1-red) 46% 100%);
}
.event-header-light .brand,
.event-header-light .riot-nav a { color: var(--t1-black); }
.event-header-light .nav-contact { color: #fff; }
.event-header-light.scrolled .brand,
.event-header-light.scrolled .riot-nav a { color: #fff; }
.popup-checker {
  position: absolute;
  inset: 0;
  opacity: .08;
  background: repeating-linear-gradient(45deg, #000 0 18px, transparent 18px 36px);
}
.popup-logo-lockup span { color: rgba(9,11,15,.32); }
.popup-badge { border-color: rgba(9,11,15,.24); }
.popup-display-title { max-width: 1060px; color: var(--t1-black); font-size: clamp(4.2rem, 10vw, 10rem); }
.popup-jp-catch { max-width: 850px; color: var(--t1-red); }
.popup-date-card {
  width: min(760px, 100%);
  margin-top: 44px;
  padding: 26px 28px;
  border: 3px solid var(--t1-black);
  background: #fff;
  box-shadow: 14px 14px 0 var(--t1-red);
}
.popup-date-card small { display: block; color: var(--t1-red); font-weight: 1000; letter-spacing: .14em; }
.popup-date-card strong { display: block; margin: 8px 0 2px; font-size: clamp(1.3rem, 2.7vw, 2.55rem); letter-spacing: -.04em; }
.popup-date-card span { color: #59616a; }
.popup-sticker {
  position: absolute;
  z-index: 3;
  padding: 13px 17px;
  border: 3px solid var(--t1-black);
  background: #fff;
  color: var(--t1-black);
  font-weight: 1000;
  box-shadow: 8px 8px 0 rgba(9,11,15,.18);
}
.sticker-one { right: 6%; top: 22%; transform: rotate(8deg); }
.sticker-two { right: 14%; bottom: 17%; color: #fff; background: var(--t1-black); transform: rotate(-7deg); }
.popup-intro-section { padding: 120px 0; background: var(--t1-red); }
.popup-intro-grid { display: grid; grid-template-columns: 180px 1fr; gap: 60px; align-items: start; }
.popup-number { font-size: clamp(6rem, 13vw, 13rem); line-height: .72; font-weight: 1000; color: rgba(255,255,255,.18); }
.popup-intro-grid .event-section-label { color: #fff; }
.popup-intro-grid h2 { color: #fff; }
.popup-intro-grid p { max-width: 850px; color: rgba(255,255,255,.82); font-size: 1.12rem; line-height: 1.9; white-space: pre-line; }
.popup-info-section { padding: 100px 0; background: #f7f4ef; color: var(--t1-black); }
.popup-info-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.popup-info-grid article { min-height: 260px; padding: 30px; border: 2px solid var(--t1-black); background: #fff; box-shadow: 9px 9px 0 rgba(9,11,15,.09); }
.popup-info-grid small { color: var(--t1-red); font-size: .72rem; font-weight: 1000; letter-spacing: .14em; }
.popup-info-grid strong { display: block; margin: 48px 0 10px; font-size: clamp(1.6rem, 3vw, 3.2rem); line-height: 1.04; letter-spacing: -.055em; }
.popup-info-grid p { margin: 0; color: #737b84; }
.popup-coming-section { padding: 110px 0; background: var(--t1-black); }
.popup-coming-section .event-container { display: flex; justify-content: space-between; align-items: end; gap: 50px; }
.popup-coming-copy img { width: 160px; height: 76px; object-fit: contain; margin-bottom: 34px; }
.popup-coming-copy > span { color: var(--t1-red); font-size: .78rem; font-weight: 1000; letter-spacing: .14em; }
.popup-coming-copy h2 { max-width: 930px; margin: 14px 0 22px; font-size: clamp(3rem, 7vw, 7.2rem); line-height: .88; letter-spacing: -.07em; }
.popup-coming-copy p { max-width: 720px; color: rgba(255,255,255,.64); }
.popup-contact-button { display: inline-flex; align-items: center; gap: 26px; padding: 20px 22px; background: var(--t1-red); color: #fff; font-weight: 1000; white-space: nowrap; }
.popup-contact-button b { display: grid; place-items: center; width: 40px; height: 40px; background: #fff; color: var(--t1-black); }

@media (max-width: 980px) {
  .event-overview-grid,
  .event-video-grid { grid-template-columns: 1fr; gap: 48px; }
  .event-facts { grid-template-columns: 1fr; }
  .event-final-banner .event-container { grid-template-columns: 130px 1fr; }
  .event-final-banner a { grid-column: 2; }
  .popup-info-grid { grid-template-columns: 1fr; }
  .popup-info-grid article { min-height: 200px; }
  .popup-info-grid strong { margin-top: 28px; }
  .popup-coming-section .event-container { align-items: start; flex-direction: column; }
  .sticker-one { right: 3%; top: 18%; }
  .sticker-two { right: 5%; bottom: 10%; }
}

@media (max-width: 820px) {
  .event-header .menu-toggle { display: block; margin-left: auto; color: #fff; }
  .event-header-light .menu-toggle { color: var(--t1-black); }
  .event-header-light.scrolled .menu-toggle { color: #fff; }
  .event-display-title { font-size: clamp(3.5rem, 17vw, 6.6rem); }
  .event-jp-catch { font-size: clamp(1.8rem, 9vw, 3.6rem); }
  .event-red-hero { background: linear-gradient(164deg, #080a0e 0 66%, #e2012d 66% 100%); }
  .event-hero-word { right: -5vw; bottom: 2vw; }
  .event-coming-panel { grid-template-columns: 55px 1fr; min-height: 150px; padding: 24px; }
  .event-coming-panel i { display: none; }
  .popup-hero { background: linear-gradient(165deg, #f8f4ef 0 73%, var(--t1-red) 73% 100%); }
  .popup-intro-grid { grid-template-columns: 1fr; gap: 20px; }
  .popup-number { font-size: 7rem; }
  .popup-sticker { display: none; }
}

@media (max-width: 540px) {
  .event-container,
  .event-hero-inner { width: min(calc(100% - 30px), 1360px); }
  .event-hero { padding-top: 104px; }
  .event-logo-lockup { gap: 12px; margin-bottom: 28px; }
  .event-logo-lockup img { width: 92px; height: 58px; }
  .event-logo-lockup strong { font-size: 1rem; }
  .event-display-title { font-size: 3.55rem; line-height: .84; }
  .event-jp-catch { margin-top: 28px; font-size: 2.25rem; }
  .event-facts { margin-top: 34px; }
  .event-overview-section,
  .event-program-section,
  .event-video-section,
  .popup-intro-section,
  .popup-info-section,
  .popup-coming-section { padding: 80px 0; }
  .event-coming-panel strong { font-size: 2.45rem; }
  .event-video-frame { box-shadow: 9px 10px 0 var(--t1-red); }
  .event-final-banner .event-container { display: block; }
  .event-final-banner img { width: 110px; height: 54px; }
  .event-final-banner p { margin: 22px 0 28px; }
  .popup-date-card { padding: 20px; box-shadow: 8px 8px 0 var(--t1-red); }
  .popup-display-title { font-size: 3.45rem; }
  .popup-info-grid article { min-height: 180px; padding: 24px; }
  .popup-coming-copy img { width: 120px; height: 58px; }
}

/* ========================================================================== 
   2026-07-14 전 페이지 반응형 타이포그래피 최종 보정
   [한국어]
   - 32인치·울트라와이드에서 vw 기반 글자가 과도하게 커지는 것을 막습니다.
   - 일본어 제목은 구 단위로 줄바꿈하고, 본문은 읽기 좋은 한 줄 폭을 유지합니다.
   - common.js의 자동 맞춤 기능과 함께 한 글자만 다음 줄에 남는 현상을 줄입니다.
   [日本語]
   - 32インチ・ウルトラワイドでvw基準の文字が過度に拡大することを防ぎます。
   - 日本語見出しは語句単位で改行し、本文は読みやすい行長を維持します。
   - common.jsの自動フィットと併用し、一文字だけが次行に残る現象を抑えます。
   ========================================================================== */

:root {
  --page-title-max-admin: 4.6rem;
  --section-title-max-admin: 4.1rem;
  --event-hero-title-max-admin: 9rem;
  --event-overview-title-max-admin: 3.8rem;
  --body-text-measure-admin: 44em;
}

html {
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

body {
  line-break: strict;
  word-break: normal;
  overflow-wrap: break-word;
  font-kerning: normal;
  font-variant-ligatures: common-ligatures;
}

/* 제목은 균형 줄바꿈, 본문은 마지막 줄까지 자연스럽게 정리합니다. */
/* 見出しはバランス改行、本文は自然な段落組みにします。 */
:where(h1, h2, h3, .board-title, .news-title, .partner-profile-card h2, .partner-profile-card h3) {
  line-break: strict;
  word-break: auto-phrase;
  overflow-wrap: normal;
  text-wrap: balance;
  hanging-punctuation: first last;
}

:where(p, li, dd, .lead, .muted, .article-body, .company-row dd, .partner-profile-card p) {
  line-break: strict;
  word-break: normal;
  overflow-wrap: anywhere;
  text-wrap: pretty;
}

.phrase-token {
  display: inline-block;
  white-space: nowrap;
}

/* --------------------------------------------------------------------------
   일반 페이지 / 一般ページ
   -------------------------------------------------------------------------- */
.container {
  width: min(calc(100% - clamp(32px, 4vw, 72px)), var(--container));
}

.page-hero {
  padding: clamp(84px, 8vw, 126px) 0 clamp(54px, 5vw, 76px);
}
.page-hero .container {
  max-width: min(var(--container), 1480px);
}
.page-hero h1 {
  max-width: 12.5em;
  margin-bottom: 20px;
  font-size: clamp(2.7rem, 3.8vw, var(--page-title-max-admin));
  line-height: 1.08;
  letter-spacing: -.045em;
}
.page-hero .lead {
  max-width: min(var(--body-text-measure-admin), 100%);
  font-size: clamp(1rem, 1.15vw, 1.2rem);
  line-height: 1.85;
}

.section-head h2,
.split h2,
.cta h2,
.placeholder-page h1 {
  max-width: 14em;
  font-size: clamp(2.15rem, 3.5vw, var(--section-title-max-admin));
  line-height: 1.08;
  letter-spacing: -.045em;
}
.section-head .lead,
.split .lead,
.split > div > p,
.cta p {
  max-width: min(var(--body-text-measure-admin), 100%);
}

.card h3,
.value-card h3,
.info-card strong {
  line-height: 1.28;
}
.card p,
.value-card p,
.info-card p {
  line-height: 1.78;
}

/* 회사 개요 / 会社概要 */
.company-row dd {
  max-width: min(64em, 100%);
  line-height: 1.8;
}
.split {
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  gap: clamp(44px, 5vw, 78px);
}

/* 게시판·본문 / お知らせ・記事 */
.board-title,
.news-title {
  line-height: 1.45;
}
.article {
  width: min(100%, 920px);
}
.article-head h1 {
  max-width: 16em;
  font-size: clamp(2.2rem, 3.3vw, 3.7rem);
  line-height: 1.12;
}
.article-body {
  max-width: min(var(--body-text-measure-admin), 100%);
  font-size: clamp(1rem, 1vw, 1.08rem);
  line-height: 1.95;
}
.article-body h2 {
  max-width: 18em;
  font-size: clamp(1.55rem, 2vw, 2rem);
  line-height: 1.28;
}

/* 협력사 / パートナー */
.partner-group-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.partner-profile-card h2,
.partner-profile-card h3 {
  font-size: clamp(1.35rem, 1.7vw, 1.85rem);
  line-height: 1.22;
}
.partner-profile-card p {
  max-width: 42em;
  line-height: 1.78;
}

/* --------------------------------------------------------------------------
   메인 페이지 / トップページ
   -------------------------------------------------------------------------- */
.home-riot-layout .rg-container {
  width: min(calc(100% - clamp(40px, 5vw, 88px)), var(--layout-max-width, 1440px));
}
.rg-hero-content {
  width: min(calc(100% - clamp(32px, 5vw, 80px)), 1040px);
}
.rg-hero h1 {
  max-width: 14em;
  font-size: clamp(2.65rem, 4.4vw, 4.95rem);
  line-height: 1.06;
}
.rg-hero p {
  max-width: min(var(--body-text-measure-admin), 780px);
  font-size: clamp(1rem, 1.1vw, 1.15rem);
  line-height: 1.86;
}
.rg-section-title h2 {
  max-width: 13em;
  font-size: clamp(2.25rem, 3.6vw, var(--section-title-max-admin));
  line-height: 1.03;
}
.rg-section-title > p {
  max-width: min(36em, 100%);
  line-height: 1.75;
}

.home-riot-layout .rg-project-grid {
  gap: clamp(18px, 1.7vw, 28px);
}
.home-riot-layout .rg-project-copy h3.admin-linebreak-title {
  max-width: 100%;
  font-size: clamp(1.65rem, 1.75vw, var(--project-title-size-admin, 2.35rem));
  line-height: var(--project-title-line-admin, 1.1);
  letter-spacing: -.035em;
}
.home-riot-layout .rg-project-copy p {
  max-width: 38em;
  line-height: 1.75;
}

.home-riot-layout .rg-partner-grid {
  grid-template-columns: minmax(0, var(--partner-copy-width-admin, 58%)) minmax(300px, 1fr);
}
.home-riot-layout .rg-partner-copy h2 {
  max-width: 10.8em;
  font-size: clamp(3rem, 4vw, var(--partner-title-size-admin, 5.2rem));
  line-height: var(--partner-title-line-admin, 1.03);
  letter-spacing: -.045em;
}
.home-riot-layout .rg-partner-copy h2 span {
  white-space: normal;
}
.home-riot-layout .rg-partner-copy p {
  max-width: min(var(--body-text-measure-admin), 100%);
}

/* --------------------------------------------------------------------------
   T1 이벤트 페이지 / T1イベントページ
   -------------------------------------------------------------------------- */
.event-container,
.event-hero-inner {
  width: min(calc(100% - clamp(40px, 5vw, 88px)), 1480px);
}
.event-hero-inner {
  padding-right: min(8vw, 120px);
}
.event-display-title {
  max-width: 9.5em;
  font-size: clamp(4.6rem, 8.6vw, var(--event-hero-title-max-admin));
  line-height: .86;
  letter-spacing: -.06em;
  text-wrap: balance;
}
.event-jp-catch {
  max-width: 12em;
  font-size: clamp(2rem, 3.2vw, 3.65rem);
  line-height: 1.08;
  letter-spacing: -.035em;
}
.event-facts {
  max-width: 980px;
}
.event-facts strong {
  line-height: 1.25;
}

.event-overview-section,
.event-video-section,
.event-program-section,
.popup-intro-section,
.popup-info-section,
.popup-coming-section {
  padding-block: clamp(88px, 7vw, 122px);
}
.event-overview-grid {
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr);
  gap: clamp(52px, 5vw, 86px);
  align-items: start;
}
.event-overview-grid h2,
.event-video-grid h2,
.event-section-head h2,
.popup-intro-grid h2 {
  max-width: 13.5em;
  margin-top: 18px;
  font-size: clamp(2.55rem, 3.4vw, var(--event-overview-title-max-admin));
  line-height: 1.08;
  letter-spacing: -.045em;
}
.event-overview-grid p,
.event-video-grid p,
.popup-intro-grid p {
  max-width: min(var(--body-text-measure-admin), 100%);
  font-size: clamp(1rem, 1vw, 1.16rem);
  line-height: 1.92;
}
.event-overview-grid p,
.popup-intro-grid p {
  white-space: pre-line;
}
.event-release-note {
  line-height: 1.5;
}

.event-section-head {
  align-items: flex-end;
}
.event-coming-panel strong {
  font-size: clamp(2.6rem, 4.6vw, 5.3rem);
  line-height: 1;
}
.event-video-grid {
  grid-template-columns: minmax(300px, .78fr) minmax(0, 1.22fr);
  gap: clamp(48px, 5vw, 78px);
}
.event-final-banner .event-container {
  grid-template-columns: minmax(120px, 170px) minmax(0, 1fr) auto;
}
.event-final-banner p {
  max-width: 15em;
  font-size: clamp(2.15rem, 3.8vw, 4.5rem);
  line-height: .98;
}

/* 팝업 페이지 / ポップアップページ */
.popup-display-title {
  max-width: 10em;
  font-size: clamp(4.4rem, 8vw, var(--event-hero-title-max-admin));
}
.popup-jp-catch {
  max-width: 13em;
}
.popup-intro-grid {
  grid-template-columns: minmax(120px, 180px) minmax(0, 1fr);
  gap: clamp(34px, 4vw, 64px);
}
.popup-intro-grid > div:last-child {
  max-width: 980px;
}
.popup-info-grid strong {
  font-size: clamp(1.65rem, 2.2vw, 2.75rem);
  line-height: 1.1;
}
.popup-coming-copy h2 {
  max-width: 13em;
  font-size: clamp(3.1rem, 5.2vw, 5.7rem);
  line-height: .96;
  letter-spacing: -.055em;
}
.popup-coming-copy p {
  max-width: min(var(--body-text-measure-admin), 720px);
  line-height: 1.8;
}

/* --------------------------------------------------------------------------
   중간 화면 / 中間サイズ
   -------------------------------------------------------------------------- */
@media (max-width: 1280px) {
  .partner-group-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .event-overview-grid {
    grid-template-columns: minmax(0, 1fr) minmax(340px, .9fr);
    gap: 52px;
  }
  .event-overview-grid h2,
  .event-video-grid h2,
  .event-section-head h2,
  .popup-intro-grid h2 {
    font-size: clamp(2.45rem, 3.6vw, 3.55rem);
  }
}

@media (max-width: 980px) {
  .split,
  .event-overview-grid,
  .event-video-grid {
    grid-template-columns: 1fr;
  }
  .home-riot-layout .rg-partner-grid {
    grid-template-columns: 1fr;
  }
  .home-riot-layout .rg-partner-copy h2 {
    max-width: 11em;
  }
  .event-hero-inner {
    padding-right: 0;
  }
  .event-overview-grid > div,
  .event-video-grid > div:first-child {
    max-width: 900px;
  }
  .event-final-banner .event-container {
    grid-template-columns: 120px minmax(0, 1fr);
  }
  .event-final-banner a {
    grid-column: 2;
  }
}

@media (max-width: 820px) {
  .container,
  .home-riot-layout .rg-container,
  .event-container,
  .event-hero-inner {
    width: min(calc(100% - 32px), var(--layout-max-width, 1440px));
  }
  .page-hero h1 {
    max-width: 100%;
    font-size: clamp(2.45rem, 9vw, 3.7rem);
  }
  .section-head h2,
  .split h2,
  .cta h2 {
    max-width: 100%;
    font-size: clamp(2.05rem, 7vw, 3.15rem);
  }
  .partner-group-grid,
  .partner-group-grid[data-count] {
    grid-template-columns: 1fr;
    max-width:100%;
  }
  .home-riot-layout .rg-project-copy h3.admin-linebreak-title {
    white-space: pre-line;
  }
  .home-riot-layout .rg-partner-copy h2 {
    font-size: clamp(2.7rem, 9.5vw, 3.9rem);
  }
  .event-display-title,
  .popup-display-title {
    max-width: 100%;
    font-size: clamp(3.7rem, 15vw, 6.1rem);
  }
  .event-jp-catch,
  .popup-jp-catch {
    max-width: 100%;
    font-size: clamp(2rem, 8vw, 3.2rem);
  }
  .popup-intro-grid {
    grid-template-columns: 1fr;
  }
  .popup-number {
    font-size: 6rem;
  }
  .event-final-banner p {
    max-width: 100%;
  }
}

@media (max-width: 540px) {
  .container,
  .home-riot-layout .rg-container,
  .event-container,
  .event-hero-inner {
    width: min(calc(100% - 26px), var(--layout-max-width, 1440px));
  }
  .page-hero h1 {
    font-size: clamp(2.25rem, 11vw, 3rem);
  }
  .rg-hero h1 {
    font-size: clamp(2.15rem, 10.5vw, 2.9rem);
  }
  .rg-section-title h2 {
    font-size: clamp(2rem, 9vw, 2.75rem);
  }
  .event-display-title,
  .popup-display-title {
    font-size: clamp(3.25rem, 16vw, 4.35rem);
    line-height: .9;
  }
  .event-jp-catch,
  .popup-jp-catch {
    font-size: clamp(1.95rem, 10vw, 2.65rem);
  }
  .event-overview-grid h2,
  .event-video-grid h2,
  .event-section-head h2,
  .popup-intro-grid h2 {
    font-size: clamp(2.15rem, 10vw, 2.85rem);
    line-height: 1.12;
  }
  .event-coming-panel {
    grid-template-columns: 42px minmax(0, 1fr);
  }
  .event-coming-panel strong {
    font-size: clamp(2rem, 10vw, 2.85rem);
  }
  .event-final-banner .event-container {
    display: block;
  }
  .event-final-banner p {
    margin: 22px 0 28px;
    font-size: clamp(2rem, 11vw, 3rem);
  }
  .popup-coming-copy h2 {
    font-size: clamp(2.75rem, 12vw, 3.75rem);
    line-height: 1;
  }
}

/* [한국어] CTA 내부의 자동 구문 span이 기존 block 규칙을 상속하지 않도록 합니다. */
/* [日本語] CTA内の自動語句spanが既存のblock指定を継承しないようにします。 */
.home-riot-layout .rg-partner-copy h2 .phrase-token {
  display: inline-block;
  white-space: nowrap;
}

/* [한국어] 자동 글자 맞춤 시 em 기반 최대폭이 함께 줄어드는 현상을 방지합니다. */
/* [日本語] 自動文字フィット時にem基準の最大幅まで縮小する現象を防ぎます。 */
.page-hero h1 { max-width: min(100%, 900px); }
.section-head h2,
.split h2,
.cta h2,
.placeholder-page h1 { max-width: min(100%, 920px); }
.home-riot-layout .rg-partner-copy h2 { max-width: 100%; }
.event-display-title,
.popup-display-title { max-width: min(100%, 1040px); }
.event-jp-catch,
.popup-jp-catch { max-width: min(100%, 780px); }
.event-overview-grid h2,
.event-video-grid h2,
.event-section-head h2,
.popup-intro-grid h2 { max-width: 100%; }
.popup-coming-copy h2 { max-width: min(100%, 1020px); }
.event-final-banner p { max-width: 100%; }

/* ========================================================================== 
   2026-07-14 본문 타이포그래피 최종 보정 / 本文タイポグラフィ最終調整
   --------------------------------------------------------------------------
   [한국어] 큰 모니터에서 작은 설명문이 지나치게 긴 한 줄이 되거나 애매한 위치에서
   끊기는 문제를 방지합니다. 관리자 페이지의 레이아웃 설정과 연동됩니다.
   [日本語] 大型モニターで説明文が長すぎる1行になったり、不自然な位置で
   改行されたりする問題を防ぎます。管理画面の設定と連動します。
   ========================================================================== */
:root {
  --body-text-size-admin: 1.05rem;
  --body-text-line-admin: 1.85;
  --event-body-text-size-admin: 1.16rem;
  --event-body-line-admin: 1.9;
  --event-body-measure-admin: 34em;
}

/* 일반 페이지의 작은 본문 / 一般ページの本文 */
.lead,
.card p,
.company-row dd,
.article-body,
.contact-info,
.info-card strong,
.partners-section-lead,
.partner-profile-copy p,
.rg-feature-copy p,
.rg-project-copy p,
.rg-media-copy p,
.rg-partner-copy p {
  font-size: clamp(.96rem, .2vw + .94rem, var(--body-text-size-admin));
  line-height: var(--body-text-line-admin);
  overflow-wrap: break-word;
  word-break: normal;
  line-break: strict;
}

/* T1 이벤트 개요 설명 / T1イベント概要説明 */
.event-overview-grid > div:last-child,
.popup-intro-grid > div:last-child {
  width: min(100%, var(--event-body-measure-admin));
  justify-self: start;
}
.event-overview-grid p.editable-multiline,
.popup-intro-grid p.editable-multiline {
  width: 100%;
  max-width: var(--event-body-measure-admin);
  margin: 0;
  font-size: clamp(1.02rem, .28vw + 1rem, var(--event-body-text-size-admin));
  line-height: var(--event-body-line-admin);
  letter-spacing: -.012em;
  white-space: pre-line;
  overflow-wrap: break-word;
  word-break: normal;
  line-break: strict;
  text-wrap: pretty;
}
.event-release-note {
  max-width: var(--event-body-measure-admin);
  margin-top: clamp(24px, 2vw, 34px) !important;
}

/* 넓은 화면에서는 본문 폭을 고정하고 좌우 칼럼을 안정적으로 배치합니다.
   大画面では本文幅を固定し、左右カラムを安定させます。 */
@media (min-width: 1281px) {
  .event-overview-grid {
    grid-template-columns: minmax(0, 1fr) minmax(30em, var(--event-body-measure-admin));
    gap: clamp(80px, 7vw, 150px);
    align-items: start;
  }
  .popup-intro-grid {
    grid-template-columns: minmax(0, 1fr) minmax(30em, var(--event-body-measure-admin));
    gap: clamp(80px, 7vw, 140px);
    align-items: start;
  }
}

/* 태블릿 이하에서는 관리자에서 지정한 수동 줄바꿈을 유지하되 화면을 넘지 않게 합니다.
   タブレット以下では手動改行を保ちながら画面内に収めます。 */
@media (max-width: 980px) {
  .event-overview-grid > div:last-child,
  .popup-intro-grid > div:last-child,
  .event-overview-grid p.editable-multiline,
  .popup-intro-grid p.editable-multiline {
    width: 100%;
    max-width: min(100%, var(--event-body-measure-admin));
  }
}

@media (max-width: 560px) {
  .event-overview-grid p.editable-multiline,
  .popup-intro-grid p.editable-multiline {
    font-size: clamp(.98rem, 4vw, 1.08rem);
    line-height: 1.82;
    letter-spacing: -.018em;
  }
}


/* ========================================================================== 
   2026-07-14 메인 타이틀 화이트·레드 조합 복원
   日本語: メインタイトルの白・赤配色を復元
   --------------------------------------------------------------------------
   [한국어] 자동 구문 분리 스크립트가 생성하는 .phrase-token에도 부모 행의 색상을
   명시적으로 상속시켜, 첫 줄 전체가 빨간색으로 바뀌는 현상을 방지합니다.
   [日本語] 自動語句分割で生成される.phrase-tokenにも親行の色を明示的に継承し、
   1行目まで全て赤くなる現象を防止します。
   ========================================================================== */
.home-riot-layout .rg-hero .hero-title-line,
.home-riot-layout .rg-hero .hero-title-line .phrase-token {
  color: #ffffff !important;
}
.home-riot-layout .rg-hero .hero-title-accent,
.home-riot-layout .rg-hero .hero-title-accent .phrase-token {
  color: var(--rg-red, #ff4d4d) !important;
}


/* ========================================================================== 
   2026-07-14 이벤트 작은 본문 행 고정 보정 / イベント小本文の行固定調整
   --------------------------------------------------------------------------
   [한국어] 32인치와 같은 넓은 화면에서 「メインイベント」가 중간에서 갈라지는
   현상을 막기 위해 관리자에서 입력한 줄을 독립된 행으로 표시합니다.
   [日本語] 32インチ等の大画面で「メインイベント」が途中分割されないよう、
   管理画面で入力した各行を独立した行として表示します。
   ========================================================================== */
:root {
  --event-body-text-size-admin: 1.06rem;
  --event-body-line-admin: 1.78;
  --event-body-measure-admin: 31em;
}
.event-overview-grid p.editable-multiline,
.popup-intro-grid p.editable-multiline {
  font-size: var(--event-body-text-size-admin);
  line-height: var(--event-body-line-admin);
  max-width: var(--event-body-measure-admin);
  white-space: normal;
  text-wrap: wrap;
}
.event-copy-line {
  display: block;
  width: max-content;
  max-width: 100%;
  white-space: nowrap;
}
.event-copy-gap {
  display: block;
  height: .78em;
}

@media (min-width: 981px) {
  .event-overview-grid > div:last-child,
  .popup-intro-grid > div:last-child {
    width: min(100%, var(--event-body-measure-admin));
  }
}

@media (max-width: 980px) {
  .event-copy-line {
    width: auto;
    white-space: normal;
  }
}

/* ========================================================================== 
   2026-07-14 메인 히어로 화이트·레드 색상 강제 고정
   日本語: メインヒーローの白・赤配色を固定
   --------------------------------------------------------------------------
   [한국어] 관리자 포인트 색상이나 자동 구문 분리와 관계없이 첫 행은 흰색,
   두 번째 행은 ONDO 고유 레드로 표시합니다.
   [日本語] 管理画面のアクセント色や自動語句分割に影響されず、1行目は白、
   2行目はONDOレッドで固定表示します。
   ========================================================================== */
.home-riot-layout .rg-hero .hero-responsive-title > .hero-title-line:first-child,
.home-riot-layout .rg-hero .hero-responsive-title > .hero-title-line:first-child .phrase-token {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
.home-riot-layout .rg-hero .hero-responsive-title > .hero-title-accent,
.home-riot-layout .rg-hero .hero-responsive-title > .hero-title-accent .phrase-token {
  color: #ff4d4d !important;
  -webkit-text-fill-color: #ff4d4d !important;
}

/* ========================================================================== 
   ONDO CI SYSTEM — 2026-08
   Brand manual source: Black #000000 / ONDO Mint #2DA39E.
   The system below deliberately replaces the former neon-blue/red visual layer.
   ========================================================================== */
:root {
  --bg: #f7f8f6;
  --bg-soft: #eef5f3;
  --surface: rgba(255,255,255,.92);
  --surface-strong: #ffffff;
  --line: rgba(0,0,0,.12);
  --line-strong: rgba(0,0,0,.28);
  --text: #000000;
  --muted: #596260;
  --primary: #2da39e;
  --primary-strong: #1f817d;
  --accent: #2da39e;
  --danger: #b73838;
  --shadow: 0 24px 70px rgba(0,0,0,.08);
  --radius: 4px;
  --radius-sm: 3px;
  --ondo-black: #000000;
  --ondo-mint: #2da39e;
  --ondo-paper: #f7f8f6;
  --ondo-font: "Avenir Next", "Helvetica Neue", "Noto Sans JP", "Noto Sans KR", Arial, sans-serif;
}

body,
.home-riot-layout {
  background: var(--ondo-paper);
  color: var(--ondo-black);
  font-family: var(--ondo-font);
}
body::before,
.home-riot-layout::before { display: none; }
h1,h2,h3,.rg-section-title,.rg-project-copy,.rg-media-copy {
  font-family: var(--ondo-font);
  font-weight: 800;
  letter-spacing: -.045em;
}
.muted,.lead,.card p,.company-row dd,.article-body,.form-note { color: var(--muted); }

/* Official wordmark use */
.brand { gap: 0; letter-spacing: 0; }
.brand-mark {
  width: 126px;
  height: 38px;
  border: 0;
  border-radius: 0;
  transform: none;
  background: url("../img/ondo-wordmark-black.png?v=2") center / contain no-repeat;
  box-shadow: none;
}
.brand-mark::after { display: none; }
.brand-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.site-footer .brand-mark {
  width: 168px;
  height: 66px;
  background-image: url("../img/ondo-logo-negative.png?v=2");
}

/* Shared header and navigation */
.site-header,
.riot-header {
  background: rgba(247,248,246,.95);
  border-bottom: 1px solid rgba(0,0,0,.12);
  backdrop-filter: blur(18px);
}
.site-header.scrolled,
.riot-header.scrolled { background: rgba(247,248,246,.98); border-color: rgba(0,0,0,.18); }
.nav a,
.riot-nav a { color: #222b29; letter-spacing: .08em; font-size: .78rem; }
.nav a:hover,.nav a[aria-current="page"],.riot-nav a:hover { color: #000; }
.nav a::after,.riot-nav a::after { background: var(--ondo-mint); height: 2px; }
.riot-nav .nav-contact,.nav-contact {
  background: #000;
  color: #fff;
  border: 1px solid #000;
  border-radius: 0;
  padding: 11px 17px;
}
.riot-nav .nav-contact:hover,.nav-contact:hover { background: var(--ondo-mint); border-color: var(--ondo-mint); color: #000; }
.menu-toggle,.riot-header .menu-toggle { color: #000; }

/* Home hero — white space and exact CI colors */
.home-riot-layout { --rg-red: var(--ondo-mint); --rg-dark: #000; --rg-paper: var(--ondo-paper); }
.rg-hero {
  min-height: calc(100svh - var(--header-h));
  background: var(--ondo-paper);
  color: #000;
  border-bottom: 1px solid rgba(0,0,0,.13);
}
.rg-hero::after {
  background: linear-gradient(90deg, var(--ondo-mint) 0 7px, transparent 7px 100%);
  opacity: 1;
}
.rg-hero-bg { opacity: .52; }
.rg-hero-bg::before {
  background-image: linear-gradient(rgba(45,163,158,.12) 1px, transparent 1px), linear-gradient(90deg, rgba(45,163,158,.12) 1px, transparent 1px);
}
.rg-orb { border-color: rgba(45,163,158,.24); background: rgba(45,163,158,.05); }
.rg-ribbon { background: var(--ondo-mint); opacity: .09; }
.rg-particle { background: var(--ondo-mint); box-shadow: none; }
.rg-kicker,.rg-overline { color: var(--ondo-mint); letter-spacing: .18em; }
.home-riot-layout .rg-logo-stage {
  width: min(520px, 78vw);
  min-height: 150px;
  margin: 22px 0 34px;
  background: url("../img/ondo-wordmark-black.png?v=2") left center / contain no-repeat;
}
.home-riot-layout .ondo-wordmark { opacity: 0; }
.home-riot-layout .rg-hero .hero-responsive-title > .hero-title-line:first-child,
.home-riot-layout .rg-hero .hero-responsive-title > .hero-title-line:first-child .phrase-token {
  color: #000 !important;
  -webkit-text-fill-color: #000 !important;
}
.home-riot-layout .rg-hero .hero-responsive-title > .hero-title-accent,
.home-riot-layout .rg-hero .hero-responsive-title > .hero-title-accent .phrase-token {
  color: var(--ondo-mint) !important;
  -webkit-text-fill-color: var(--ondo-mint) !important;
}
.rg-hero p { color: #46504e; }
.rg-scroll-cue { color: #000; }
.rg-scroll-cue span { background: var(--ondo-mint); }
.rg-main-button,.btn-primary {
  background: #000;
  color: #fff;
  border: 1px solid #000;
  border-radius: 0;
  box-shadow: none;
}
.rg-main-button:hover,.btn-primary:hover { background: var(--ondo-mint); color: #000; border-color: var(--ondo-mint); }
.rg-text-link span,.news-arrow,.eyebrow,.badge { color: var(--ondo-mint); }

/* Editorial content system */
.rg-section,.section { background: var(--ondo-paper); }
.rg-news-section { background: #fff; }
.rg-section-title { border-bottom: 1px solid rgba(0,0,0,.16); padding-bottom: 22px; }
.rg-section-title h2,.rg-section-title > p { color: #000; }
.rg-section-title > a { color: #000; border-color: var(--ondo-mint); }
.rg-feature-news,.rg-news-card,.card,.panel,.info-card {
  border: 1px solid rgba(0,0,0,.14);
  border-radius: 0;
  background: #fff;
  box-shadow: none;
}
.rg-feature-news:hover,.rg-news-card:hover,.card:hover { border-color: var(--ondo-mint); box-shadow: 10px 10px 0 rgba(45,163,158,.14); }
.rg-feature-art { background: #000; }
.rg-art-word { color: #fff; text-shadow: 8px 8px 0 var(--ondo-mint); }
.rg-news-card small,.rg-feature-copy > span,.rg-project-copy small,.rg-media-copy small { color: var(--ondo-mint); }
.rg-projects { background: var(--bg-soft); }
.rg-project-card {
  border: 1px solid rgba(0,0,0,.15);
  border-radius: 0;
  background: #fff;
  box-shadow: none;
}
.rg-project-card:hover { transform: translate(-5px,-5px); box-shadow: 10px 10px 0 var(--ondo-mint); }
.rg-project-copy { color: #000; }
.rg-project-copy p { color: #596260; }
.project-card-link { color: var(--ondo-mint); }
.rg-entertainment { background: #000; }
.rg-entertainment .rg-section-title { border-color: rgba(255,255,255,.22); }
.rg-entertainment .rg-section-title h2 { color: #fff; }
.rg-media-card { border-radius: 0; border-color: rgba(255,255,255,.18); }
.rg-media-card:hover { border-color: var(--ondo-mint); }
.rg-media-copy span { color: var(--ondo-mint); }
.rg-partner-cta { background: var(--ondo-mint); color: #000; }
.rg-partner-copy p { color: rgba(0,0,0,.72); }
.rg-dark-button { background: #000; color: #fff; }
.partner-card { border-radius: 0; border-color: rgba(0,0,0,.3); color: #000; background: rgba(255,255,255,.2); }

/* General pages */
.page-hero { background: var(--ondo-paper); border-color: rgba(0,0,0,.14); }
.breadcrumb,.company-row dd,.article-body,.info-card span { color: var(--muted); }
.breadcrumb span,.required,.form-status.success { color: var(--ondo-mint); }
.company-table,.company-row,.board-table,.board-row { border-color: rgba(0,0,0,.16); }
.company-row dt,.form-group label,.footer-title { color: #000; }
.search-box input,.form-control {
  color: #000;
  background: #fff;
  border-color: rgba(0,0,0,.24);
  border-radius: 0;
}
.form-control:focus,.search-box input:focus { border-color: var(--ondo-mint); box-shadow: 0 0 0 3px rgba(45,163,158,.14); }
.pagination button { border-radius: 0; color: #000; background: #fff; }
.pagination button.active { background: var(--ondo-mint); border-color: var(--ondo-mint); color: #000; }
.map-wrap { border-radius: 0; }

/* Footer */
.site-footer,.rg-footer { background: #000; color: #fff; border-color: #000; }
.site-footer .footer-brand p,.site-footer .muted,.site-footer .footer-bottom { color: rgba(255,255,255,.62); }
.site-footer .footer-title { color: var(--ondo-mint); }
.site-footer a:hover { color: var(--ondo-mint); }

/* Focus and motion */
:focus-visible { outline: 3px solid var(--ondo-mint); outline-offset: 4px; }
@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
@media (max-width: 820px) {
  .nav,.riot-nav { background: var(--ondo-paper); border-bottom: 1px solid rgba(0,0,0,.16); }
  .nav a,.riot-nav a { color: #000; }
  .home-riot-layout .rg-logo-stage { min-height: 112px; width: min(430px, 88vw); }
}

/* Specificity guard: legacy Riot header rules previously overrode the CI mark. */
.site-header .brand-mark,
.riot-header .riot-brand .brand-mark {
  width: 126px !important;
  height: 38px !important;
  border: 0 !important;
  border-radius: 0 !important;
  transform: none !important;
  background: url("../img/ondo-wordmark-black.png?v=2") center / contain no-repeat !important;
  box-shadow: none !important;
}
.site-header .brand-mark::after,
.riot-header .riot-brand .brand-mark::after { display: none !important; }
.site-footer .brand-mark {
  width: 168px !important;
  height: 54px !important;
  background: url("../img/ondo-wordmark-black.png?v=2") center / contain no-repeat !important;
  filter: invert(1);
}
.home-riot-layout .rg-logo-stage {
  position: relative;
  width: min(560px, 82vw);
  min-height: 176px;
  margin: 10px 0 24px;
  background: url("../img/ondo-wordmark-black.png?v=2") left center / contain no-repeat;
}
.home-riot-layout .rg-logo-stage::after {
  content: "ゲームを始めよう。未来をつくろう。";
  position: absolute;
  left: 9.5%;
  bottom: 0;
  color: var(--ondo-mint);
  font-size: clamp(.85rem, 1.45vw, 1.15rem);
  font-weight: 800;
  letter-spacing: -.02em;
}
.rg-text-link { color: #000; }
.page-hero h1,
.section h2,
.section h3,
.company-row dt { color: #000; }

/* ========================================================================== 
   HOME HERO RECOMPOSITION — balanced desktop / tablet / mobile proportions
   ========================================================================== */
.home-riot-layout .rg-hero {
  min-height: max(720px, 100svh);
  place-items: stretch;
}
.home-riot-layout .rg-hero-bg { opacity: .28; }
.home-riot-layout .rg-grid { opacity: .09; background-size: 88px 88px; }
.home-riot-layout .rg-orb { opacity: .42; }
.home-riot-layout .rg-ribbon { opacity: .045; }
.home-riot-layout .rg-hero-content {
  width: min(calc(100% - 96px), 1240px);
  min-height: max(720px, 100svh);
  padding: 152px 0 100px;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(300px, .72fr);
  grid-template-areas:
    "kicker logo"
    "title logo"
    "copy logo"
    "actions logo";
  column-gap: clamp(70px, 8vw, 140px);
  row-gap: 0;
  align-content: center;
  align-items: center;
  text-align: left;
}
.home-riot-layout .rg-kicker {
  grid-area: kicker;
  justify-self: start;
  margin: 0 0 28px;
  font-size: .72rem;
}
.home-riot-layout .rg-logo-stage {
  grid-area: logo;
  justify-self: stretch;
  align-self: center;
  width: 100%;
  min-height: 250px;
  margin: 0;
  background: url("../img/ondo-wordmark-black-transparent.png?v=1") center / contain no-repeat;
}
.home-riot-layout .rg-logo-stage::after {
  left: 0;
  right: 0;
  bottom: 22px;
  text-align: center;
  font-size: clamp(.82rem, 1.1vw, 1.03rem);
}
.home-riot-layout .rg-hero h1 {
  grid-area: title;
  width: 100%;
  max-width: 760px;
  margin: 0 0 28px;
  font-size: clamp(3.25rem, 5.2vw, 5.2rem);
  line-height: 1.02;
  letter-spacing: -.06em;
  text-wrap: balance;
}
.home-riot-layout .rg-hero p {
  grid-area: copy;
  max-width: 590px;
  margin: 0;
  font-size: clamp(.98rem, 1.1vw, 1.08rem);
  line-height: 1.78;
  text-align: left;
  text-wrap: pretty;
}
.home-riot-layout .rg-hero-actions {
  grid-area: actions;
  justify-content: flex-start;
  margin-top: 36px;
  gap: 28px;
}
.home-riot-layout .rg-main-button {
  min-height: 54px;
  padding-left: 22px;
  font-size: .9rem;
}
.home-riot-layout .rg-text-link { font-size: .84rem; }

@media (max-width: 940px) {
  .home-riot-layout .rg-hero { min-height: auto; }
  .home-riot-layout .rg-hero-content {
    width: min(calc(100% - 68px), 760px);
    min-height: auto;
    padding: 132px 0 88px;
    grid-template-columns: 1fr;
    grid-template-areas: "kicker" "logo" "title" "copy" "actions";
    align-content: start;
  }
  .home-riot-layout .rg-kicker { margin-bottom: 30px; }
  .home-riot-layout .rg-logo-stage {
    justify-self: start;
    width: min(310px, 62vw);
    min-height: 102px;
    margin: 0 0 38px;
    background-position: left center;
  }
  .home-riot-layout .rg-logo-stage::after {
    left: 2%;
    right: auto;
    bottom: -6px;
    text-align: left;
    font-size: .78rem;
  }
  .home-riot-layout .rg-hero h1 {
    max-width: 650px;
    margin-bottom: 24px;
    font-size: clamp(2.55rem, 7vw, 3.45rem);
    line-height: 1.05;
  }
  .home-riot-layout .rg-hero p { max-width: 610px; }
}

@media (max-width: 560px) {
  .home-riot-layout .rg-hero-content {
    width: min(calc(100% - 40px), 520px);
    padding: 112px 0 68px;
  }
  .home-riot-layout .rg-kicker {
    margin-bottom: 22px;
    font-size: .61rem;
    letter-spacing: .15em;
  }
  .home-riot-layout .rg-logo-stage {
    width: min(240px, 68vw);
    min-height: 80px;
    margin-bottom: 34px;
  }
  .home-riot-layout .rg-logo-stage::after { bottom: -10px; font-size: .67rem; }
  .home-riot-layout .rg-hero h1 {
    margin-bottom: 22px;
    font-size: clamp(2.18rem, 10.4vw, 2.85rem);
    line-height: 1.07;
    letter-spacing: -.055em;
  }
  .home-riot-layout .rg-hero p {
    font-size: .94rem;
    line-height: 1.76;
  }
  .home-riot-layout .rg-hero-actions {
    align-items: flex-start;
    margin-top: 30px;
    gap: 18px;
  }
  .home-riot-layout .rg-main-button { min-height: 50px; }
  .home-riot-layout .rg-scroll-cue { display: none; }
}

/* ========================================================================== 
   CENTERED ONDO HERO + CLEAN HEADER MARK
   ========================================================================== */
.site-header .brand,
.riot-header .riot-brand {
  padding: 0;
  background: transparent !important;
}
.riot-header .header-shell {
  width: min(calc(100% - 96px), 1320px);
}
.site-header .brand-mark,
.riot-header .riot-brand .brand-mark {
  width: 108px !important;
  height: 28px !important;
  background: url("../img/ondo-wordmark-black-transparent.png?v=1") center / contain no-repeat !important;
}
.home-riot-layout .rg-hero-content {
  width: min(calc(100% - 72px), 980px);
  min-height: max(720px, 100svh);
  padding: 142px 0 92px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.home-riot-layout .rg-kicker {
  order: 0;
  align-self: center;
  margin: 0 0 28px;
  text-align: center;
}
.home-riot-layout .rg-logo-stage {
  order: 1;
  align-self: center;
  width: min(360px, 56vw);
  min-height: 124px;
  margin: 0 0 42px;
  background-position: center;
}
.home-riot-layout .rg-logo-stage::after {
  left: 0;
  right: 0;
  bottom: -2px;
  text-align: center;
  font-size: .82rem;
}
.home-riot-layout .rg-hero h1 {
  order: 2;
  width: 100%;
  max-width: 840px;
  margin: 0 0 28px;
  font-size: clamp(3.15rem, 5vw, 4.55rem);
  line-height: 1.04;
  text-align: center;
  text-wrap: balance;
}
.home-riot-layout .rg-hero p {
  order: 3;
  width: 100%;
  max-width: 650px;
  margin: 0;
  text-align: center;
  text-wrap: pretty;
}
.home-riot-layout .rg-hero-actions {
  order: 4;
  justify-content: center;
  margin-top: 36px;
}

@media (max-width: 940px) {
  .home-riot-layout .rg-hero-content {
    width: min(calc(100% - 56px), 760px);
    min-height: max(690px, 100svh);
    padding: 122px 0 78px;
    align-content: unset;
  }
  .home-riot-layout .rg-logo-stage {
    align-self: center;
    justify-self: auto;
    width: min(290px, 58vw);
    min-height: 98px;
    margin-bottom: 38px;
    background-position: center;
  }
  .home-riot-layout .rg-logo-stage::after {
    left: 0;
    right: 0;
    bottom: -4px;
    text-align: center;
    font-size: .74rem;
  }
  .home-riot-layout .rg-hero h1 {
    max-width: 680px;
    font-size: clamp(2.55rem, 7vw, 3.35rem);
    text-align: center;
  }
  .home-riot-layout .rg-hero p {
    max-width: 600px;
    text-align: center;
  }
  .home-riot-layout .rg-hero-actions { justify-content: center; }
}

@media (max-width: 560px) {
  .riot-header .header-shell { width: calc(100% - 36px); }
  .site-header .brand-mark,
  .riot-header .riot-brand .brand-mark {
    width: 96px !important;
    height: 25px !important;
  }
  .home-riot-layout .rg-hero-content {
    width: min(calc(100% - 36px), 500px);
    min-height: 720px;
    padding: 106px 0 64px;
  }
  .home-riot-layout .rg-kicker { margin-bottom: 22px; }
  .home-riot-layout .rg-logo-stage {
    width: min(220px, 62vw);
    min-height: 74px;
    margin-bottom: 34px;
  }
  .home-riot-layout .rg-logo-stage::after { bottom: -10px; font-size: .64rem; }
  .home-riot-layout .rg-hero h1 {
    max-width: 360px;
    margin-bottom: 22px;
    font-size: clamp(2.12rem, 10vw, 2.65rem);
    line-height: 1.07;
  }
  .home-riot-layout .rg-hero p {
    max-width: 350px;
    font-size: .92rem;
    line-height: 1.72;
  }
  .home-riot-layout .rg-hero-actions {
    align-items: center;
    justify-content: center;
    margin-top: 30px;
  }
}

/* ========================================================================== 
   ONDO CI MARK SYSTEM — official lockups from ONDO_Logo_DesignManual
   Standalone brand displays use the supplied CI artwork. Company names and
   editorial references remain searchable, accessible text.
   ========================================================================== */
.site-header,
.riot-header { background:rgba(255,255,255,.97); }
.site-header.scrolled,
.riot-header.scrolled { background:rgba(255,255,255,.99); }
.brand { min-height:48px; align-items:center; }
.site-header .brand-mark,
.riot-header .riot-brand .brand-mark {
  width:138px !important;
  height:44px !important;
  background:transparent url("../img/ondo-logo-primary-transparent.png?v=1") center / contain no-repeat !important;
  filter:none !important;
}
.site-footer .brand-mark {
  width:198px !important;
  height:84px !important;
  background:transparent url("../img/ondo-logo-negative-transparent.png?v=1") center / contain no-repeat !important;
  filter:none !important;
}

.home-riot-layout .rg-hero { background:#fff; }
.home-riot-layout .rg-logo-stage {
  width:min(620px,80vw);
  min-height:0;
  margin-bottom:26px;
  padding:10px 14px 16px;
  background:transparent !important;
}
.home-riot-layout .rg-logo-stage::after { display:none !important; }
.ondo-ci-hero-logo { display:block; width:100%; height:auto; margin:0 auto; }
.home-riot-layout .rg-hero h1 {
  max-width:900px;
  margin-bottom:24px;
  font-size:clamp(2.55rem,4vw,3.7rem);
  line-height:1.1;
  letter-spacing:-.045em;
}
.home-riot-layout .rg-hero .hero-responsive-title > .hero-title-line,
.home-riot-layout .rg-hero .hero-responsive-title > .hero-title-line .phrase-token {
  color:var(--ondo-mint) !important;
  -webkit-text-fill-color:var(--ondo-mint) !important;
}
.home-riot-layout .rg-hero p {
  max-width:760px;
  font-size:clamp(.92rem,1.1vw,1.04rem);
  line-height:1.82;
}

.rg-art-word {
  width:min(310px,72%);
  padding:18px 22px;
  background:transparent;
  transform:rotate(-4deg);
  box-shadow:none;
  text-shadow:none;
}
.ondo-ci-art-logo { display:block; width:100%; height:auto; }
.rg-partner-ondo-logo {
  position:relative;
  z-index:3;
  display:block;
  width:min(340px,66%);
  height:auto;
  padding:18px 22px;
  background:transparent;
  box-shadow:none;
  transform:rotate(-5deg);
}

.event-logo-lockup .ondo-ci-event-logo {
  width:clamp(170px,16vw,210px);
  height:auto;
  padding:10px 14px 12px;
  border:0;
  background:transparent;
  object-fit:contain;
  box-shadow:none;
}
.event-logo-lockup > img:first-child {
  width:clamp(190px,18vw,230px);
  height:96px;
  object-fit:contain;
}
.event-logo-lockup > span { flex:0 0 auto; font-size:2rem; }
.event-main-page .event-logo-lockup > span { color:rgba(255,255,255,.52) !important; }
.event-popup-page .event-logo-lockup > span { color:rgba(0,0,0,.38) !important; }
.event-header .brand,
.event-header .riot-nav a,
.event-header-light .brand,
.event-header-light .riot-nav a,
.event-header.scrolled .brand,
.event-header.scrolled .riot-nav a {
  color:#000;
}
.event-header .riot-nav .nav-contact,
.event-header-light .riot-nav .nav-contact,
.event-header.scrolled .riot-nav .nav-contact { color:#fff; }
.event-header .menu-toggle,
.event-header-light .menu-toggle,
.event-header.scrolled .menu-toggle { color:#000; }

@media (max-width:560px) {
  .site-header .brand-mark,
  .riot-header .riot-brand .brand-mark {
    width:116px !important;
    height:36px !important;
  }
  .brand { min-height:40px; }
  .home-riot-layout .rg-logo-stage {
    width:min(350px,88vw);
    padding:8px 10px 12px;
    margin-bottom:32px;
  }
  .event-logo-lockup .ondo-ci-event-logo {
    width:132px;
    padding:8px 10px 9px;
  }
  .event-logo-lockup > img:first-child { width:130px; height:64px; }
  .event-logo-lockup > span { font-size:1.35rem; }
  .rg-partner-ondo-logo { width:min(270px,74%); padding:14px 16px; }
}

/* ========================================================================== 
   COMPANY — MISSION VALUE / SERVICES
   Source content is structured as 3 ON values, 3 DO actions and 3 services.
   ========================================================================== */
.company-values-section,
.company-services-section { overflow:hidden; }
.company-values-section { background:var(--ondo-paper); }
.company-services-section { background:#fff; }

.company-section-heading {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,430px);
  align-items:end;
  gap:48px;
  margin-bottom:50px;
  padding-bottom:24px;
  border-bottom:1px solid rgba(0,0,0,.2);
}
.company-section-heading h2 {
  margin:3px 0 0;
  font-size:clamp(2.7rem,5vw,5.2rem);
  line-height:.96;
  letter-spacing:.045em;
}
.company-section-heading > p {
  max-width:420px;
  margin:0;
  color:#525b59;
  font-size:clamp(.96rem,1.25vw,1.08rem);
  line-height:1.8;
}
.company-section-index {
  display:block;
  color:var(--ondo-mint);
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.16em;
}

.mission-value-board {
  display:grid;
  grid-template-columns:minmax(0,1fr) 112px minmax(0,1fr);
  align-items:center;
  gap:clamp(28px,4vw,66px);
  padding:clamp(42px,6vw,76px);
  border:1px solid rgba(0,0,0,.22);
  border-radius:72px 0 72px 0;
  background:
    linear-gradient(120deg,rgba(45,163,158,.065),transparent 35%),
    #fff;
  box-shadow:18px 18px 0 rgba(45,163,158,.1);
}
.mission-value-group { min-width:0; }
.mission-value-label {
  display:inline-flex;
  margin:0 0 38px;
  padding:6px 12px 7px;
  background:var(--ondo-mint);
  color:#fff !important;
  font-size:1rem;
  font-weight:800;
  line-height:1;
  letter-spacing:.04em;
}
.mission-value-list {
  display:grid;
  gap:30px;
  margin:0;
  padding:0;
  list-style:none;
}
.mission-value-item {
  display:grid;
  grid-template-columns:38px 2px minmax(0,1fr);
  align-items:stretch;
  gap:17px;
  min-width:0;
}
.mission-value-number {
  padding-top:2px;
  color:var(--ondo-mint);
  font-size:1.03rem;
  font-weight:900;
  letter-spacing:.04em;
}
.mission-value-rule { width:2px; background:var(--ondo-mint); }
.mission-value-item h4 {
  margin:0 0 6px;
  color:#111;
  font-size:clamp(1.08rem,1.6vw,1.34rem);
  line-height:1.25;
  letter-spacing:.015em;
}
.mission-value-item p {
  margin:0;
  color:#4f5856;
  font-size:1.05rem;
  line-height:1.6;
}
.mission-value-connector {
  position:relative;
  width:100%;
  aspect-ratio:1;
  opacity:.72;
}
.mission-value-connector::before,
.mission-value-connector::after {
  content:"";
  position:absolute;
  top:50%;
  left:2%;
  width:96%;
  height:1px;
  background:rgba(0,0,0,.32);
  transform-origin:center;
}
.mission-value-connector::before { transform:rotate(45deg); }
.mission-value-connector::after { transform:rotate(-45deg); }
.mission-value-connector span {
  position:absolute;
  inset:calc(50% - 9px);
  z-index:1;
  border-radius:50%;
  background:var(--ondo-mint);
  box-shadow:0 0 0 8px #fff;
}

.company-services-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
}
.company-service-card {
  min-width:0;
  overflow:hidden;
  border:1px solid rgba(0,0,0,.22);
  border-radius:0 0 54px 0;
  background:var(--ondo-paper);
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
.company-service-card:hover {
  transform:translate(-5px,-5px);
  border-color:var(--ondo-mint);
  box-shadow:11px 11px 0 rgba(45,163,158,.18);
}
.company-service-card > header {
  position:relative;
  min-height:142px;
  display:flex;
  align-items:flex-end;
  padding:34px 30px 27px;
  background:#fff;
}
.company-service-card h3 {
  position:relative;
  z-index:1;
  max-width:270px;
  margin:0;
  color:#080a0a;
  font-size:clamp(1.22rem,1.7vw,1.56rem);
  line-height:1.38;
  letter-spacing:-.03em;
}
.company-service-card h3.editable-multiline { white-space:pre-line; }
.company-service-number {
  position:absolute;
  top:18px;
  left:24px;
  color:var(--ondo-mint);
  font-size:2rem;
  font-weight:900;
  line-height:1;
  letter-spacing:-.06em;
  -webkit-text-stroke:1px var(--ondo-mint);
  -webkit-text-fill-color:transparent;
}
.company-service-visual {
  position:relative;
  aspect-ratio:1.58 / 1;
  overflow:hidden;
  background:#070b0c;
}
.company-service-visual img {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  transition:transform .45s cubic-bezier(.2,.65,.25,1);
}
.company-service-card:hover .company-service-visual img { transform:scale(1.025); }
.company-service-copy {
  min-height:164px;
  padding:27px 30px 32px;
  background:var(--ondo-paper);
}
.company-service-copy p {
  margin:0;
  color:#3e4745;
  font-size:.96rem;
  line-height:1.85;
  white-space:pre-line;
  word-break:keep-all;
  overflow-wrap:normal;
  line-break:strict;
  text-wrap:pretty;
}

@media (max-width:980px) {
  .mission-value-board {
    grid-template-columns:minmax(0,1fr) 78px minmax(0,1fr);
    gap:28px;
    padding:48px 42px;
  }
  .company-services-grid { grid-template-columns:1fr; }
  .company-service-card {
    display:grid;
    grid-template-columns:minmax(230px,.72fr) minmax(280px,1fr);
    grid-template-areas:"service-head service-visual" "service-copy service-visual";
  }
  .company-service-card > header { grid-area:service-head; min-height:160px; }
  .company-service-visual { grid-area:service-visual; aspect-ratio:auto; min-height:340px; }
  .company-service-copy { grid-area:service-copy; }
  .company-service-copy { min-height:0; display:flex; align-items:center; }
}

@media (max-width:760px) {
  .company-section-heading { grid-template-columns:1fr; gap:18px; margin-bottom:34px; }
  .company-section-heading h2 { font-size:clamp(2.45rem,12vw,3.6rem); }
  .mission-value-board {
    grid-template-columns:1fr;
    gap:35px;
    padding:42px 28px 48px;
    border-radius:46px 0 46px 0;
    box-shadow:10px 10px 0 rgba(45,163,158,.1);
  }
  .mission-value-label { margin-bottom:28px; }
  .mission-value-connector { width:86px; height:42px; margin:0 auto; aspect-ratio:auto; }
  .mission-value-connector::before { transform:rotate(24deg); }
  .mission-value-connector::after { transform:rotate(-24deg); }
  .company-service-card { display:block; }
  .company-service-card > header { min-height:132px; }
  .company-service-visual { aspect-ratio:1.58 / 1; min-height:0; }
  .company-service-copy { min-height:auto; }
}

@media (max-width:480px) {
  .mission-value-board { padding:36px 22px 42px; }
  .mission-value-list { gap:25px; }
  .mission-value-item { grid-template-columns:34px 2px minmax(0,1fr); gap:13px; }
  .company-service-visual { aspect-ratio:1.58 / 1; }
  .company-service-card > header { padding:31px 24px 24px; }
  .company-service-copy { padding:24px 24px 30px; }
}

/* ========================================================================== 
   LANGUAGE SELECTOR — Japanese / English
   ========================================================================== */
.language-switcher {
  display:inline-flex;
  align-items:center;
  gap:7px;
  margin-left:2px;
  padding-left:18px;
  border-left:1px solid rgba(0,0,0,.2);
  color:#6a7270;
  white-space:nowrap;
}
.language-switcher button {
  min-width:auto;
  margin:0;
  padding:4px 2px;
  border:0;
  border-radius:0;
  color:#6a7270;
  background:transparent;
  font-size:.7rem;
  font-weight:800;
  letter-spacing:.06em;
  cursor:pointer;
}
.language-switcher button:hover,
.language-switcher button.is-active { color:#000; }
.language-switcher button.is-active { box-shadow:inset 0 -2px 0 var(--ondo-mint); }
.language-switcher span { color:rgba(0,0,0,.25); font-size:.68rem; }

html[data-language="en"] .company-service-copy p {
  white-space:normal;
  word-break:normal;
  overflow-wrap:break-word;
}
html[data-language="en"] .company-service-card h3 {
  max-width:100%;
  white-space:normal;
  word-break:normal;
  overflow-wrap:break-word;
  text-wrap:balance;
}
html[data-language="en"] .company-service-card > header {
  min-height:154px;
}
html[data-language="en"] .company-section-heading h2,
html[data-language="en"] .page-hero h1,
html[data-language="en"] .rg-hero h1,
html[data-language="en"] .rg-project-copy h3,
html[data-language="en"] .rg-partner-copy h2,
html[data-language="en"] .cta h2 {
  word-break:normal;
  overflow-wrap:break-word;
  text-wrap:balance;
}

@media (max-width:980px) {
  html[data-language="en"] .company-service-card > header { min-height:160px; }
}

@media (max-width:760px) {
  html[data-language="en"] .company-service-card > header { min-height:138px; }
}

@media (max-width:820px) {
  .language-switcher {
    justify-content:flex-end;
    margin:7px 10px 0;
    padding:12px 2px 4px;
    border-top:1px solid rgba(0,0,0,.14);
    border-left:0;
  }
  .language-switcher button { padding:6px 4px; }
}

/* ========================================================================== 
   2026-08-07 CTA button text clipping fix
   日本語の「お問い合わせ」が一文字ずつ折り返されないようにします。
   ========================================================================== */
.cta-inner > div {
  flex:1 1 auto;
  min-width:0;
}
.cta .btn {
  flex:0 0 auto;
  min-width:210px;
  min-height:64px;
  padding-inline:30px;
  white-space:nowrap;
  word-break:keep-all;
  overflow-wrap:normal;
  line-break:auto;
  writing-mode:horizontal-tb;
}

@media (max-width:820px) {
  .cta .btn {
    width:auto;
    max-width:100%;
    min-width:190px;
    min-height:58px;
    padding-inline:26px;
  }
}

/* ========================================================================== 
   2026-08-07 comprehensive responsive typography and CTA alignment
   ========================================================================== */
.phrase-token,
.no-break-term {
  display:inline-block;
  max-width:100%;
  white-space:nowrap;
}

.page-hero h1 {
  max-width:min(100%, 18em);
  font-size:clamp(2.7rem, 3.8vw, 4.75rem);
  line-height:1.1;
}
.page-hero .lead {
  max-width:min(52em, 100%);
  overflow-wrap:normal;
}

.rg-news-card h3 {
  max-width:100%;
  line-height:1.42;
  overflow-wrap:normal;
}

.cta-inner {
  display:grid;
  grid-template-columns:minmax(0, 1fr) max-content;
  align-items:end;
  gap:clamp(28px, 4vw, 64px);
}
.cta h2 {
  max-width:18ch;
  line-height:1.08;
  overflow-wrap:normal;
}
.cta .btn {
  justify-self:end;
  margin-top:0;
}

@media (max-width:1100px) {
  .cta-inner {
    grid-template-columns:minmax(0, 1fr);
    align-items:start;
  }
  .cta h2 {
    max-width:min(100%, 18ch);
  }
  .cta .btn {
    justify-self:start;
    margin-top:4px;
  }
}

@media (max-width:820px) {
  .page-hero h1 {
    font-size:clamp(2.4rem, 7.2vw, 3.3rem);
    line-height:1.12;
  }
  .page-hero .lead {
    max-width:100%;
    line-height:1.82;
  }
  .cta h2 {
    font-size:clamp(2.1rem, 7vw, 3rem);
    line-height:1.12;
  }
}

@media (max-width:540px) {
  .page-hero h1 {
    font-size:clamp(2.15rem, 10vw, 2.8rem);
  }
  .cta h2 {
    font-size:clamp(2rem, 9.5vw, 2.65rem);
  }
  .cta .btn {
    min-width:0;
    width:100%;
  }
}
