:root{
  --bg:#ffffff;
  --fg:#111827;
  --muted:#6b7280;
  --line:#e5e7eb;
  --accent:#0b3d91;
  --accent2:#1f2937;
  --card:#f9fafb;
  --shadow: 0 10px 30px rgba(17,24,39,0.08);
  --radius: 18px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Noto Sans", "Noto Sans JP", sans-serif;
  color:var(--fg);
  background:var(--bg);
  line-height:1.6;
}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:1080px;margin:0 auto;padding:0 18px}
header{
  position:relative;
  border-bottom:1px solid var(--line);
  overflow:hidden;
}
.hero{
  padding:28px 0 38px;
  background-image: url("../img/hero-bg.svg");
  background-size: cover;
  background-position: center;
}
.topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:14px 0;
}
.brand{
  display:flex;
  align-items:center;
  gap:14px;
}
.brand img{height:46px; width:auto}
.badge{
  display:inline-flex;
  gap:8px;
  align-items:center;
  padding:8px 12px;
  background:rgba(11,61,145,0.08);
  border:1px solid rgba(11,61,145,0.20);
  border-radius:999px;
  font-weight:600;
}
.badge svg{width:18px;height:18px; color:var(--accent)}
h1{
  margin:14px 0 10px;
  font-size: clamp(28px, 3.2vw, 44px);
  line-height:1.15;
  letter-spacing:-0.02em;
}
.sub{
  margin:0;
  color:var(--muted);
  font-size: 16px;
}
.meta{
  margin-top:18px;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:12px;
}
.meta .box{
  background: rgba(255,255,255,0.78);
  backdrop-filter: blur(6px);
  border:1px solid var(--line);
  border-radius: var(--radius);
  padding:14px 14px;
  box-shadow: var(--shadow);
}
.meta .label{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:700;
}
.meta .label img{
  width:22px;height:22px;color:var(--accent)
}
section{padding:36px 0}
.section-title{
  font-size:22px;
  margin:0 0 16px;
}
.grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:14px;
}
.card{
  background: var(--card);
  border:1px solid var(--line);
  border-radius: var(--radius);
  padding:14px 14px;
  box-shadow: 0 8px 18px rgba(17,24,39,0.05);
}
.card h3{
  margin:0 0 6px;
  font-size:18px;
}
.card .affil{color:var(--muted); font-size:14px; margin:0 0 10px}
.chip{
  display:inline-block;
  font-size:12px;
  font-weight:700;
  padding:4px 10px;
  border-radius:999px;
  border:1px solid rgba(11,61,145,0.28);
  background: rgba(11,61,145,0.08);
  color: var(--accent);
}
.note{
  color:var(--muted);
  margin-top:10px;
}
.split{
  display:grid;
  grid-template-columns: 1.3fr 0.7fr;
  gap:16px;
}
ul{margin:10px 0 0 20px}
footer{
  border-top:1px solid var(--line);
  padding:22px 0 30px;
  color:var(--muted);
  font-size:14px;
}
.small{font-size:12px;color:var(--muted)}
@media (max-width: 860px){
  .meta{grid-template-columns:1fr}
  .grid{grid-template-columns:1fr}
  .split{grid-template-columns:1fr}
}


.speaker-list{
  list-style:none;
  padding:0;
  margin:0;
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:14px;
}
.speaker-list li{
  background: var(--card);
  border:1px solid var(--line);
  border-radius: var(--radius);
  padding:14px 14px;
  box-shadow: 0 8px 18px rgba(17,24,39,0.05);
}
@media (max-width: 860px){
  .speaker-list{grid-template-columns:1fr}
}


/* Vertical speaker list (no cards) */
.speaker-list{
  list-style:none;
  padding:0;
  margin:0;
}
.speaker-list li{
  padding:10px 0;
  border-bottom:1px solid var(--line);
}
.speaker-list li:last-child{
  border-bottom:none;
}
.speaker-list strong{
  font-weight:600;
}

.workshop-title {
  text-align: center;
  line-height: 1.0;
}

.workshop-title .and {
  display: block;
  font-size: 0.8em;
  font-style: italic;
  margin: 8px 0;
}