/* Tsuda Floating Words: deliberately scoped; no sitewide or theme overrides. */
.ktw-hero {
  --ktw-bg:#F6F3ED;
  --ktw-ink:#243342;
  --ktw-link:#36596B;
  --ktw-sans:"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,"Noto Sans CJK JP",sans-serif;
  --ktw-serif:"Hiragino Mincho ProN","Yu Mincho","Noto Serif CJK JP",serif;
  --ktw-word-font:var(--ktw-serif);
  position:relative;
  isolation:isolate;
  container-name:ktw;
  container-type:inline-size;
  width:100%;
  max-width:none;
  /* Let content determine height instead of stretching to the viewport. */
  min-height:0;
  margin:0;
  padding:0;
  overflow:hidden;
  color:var(--ktw-ink);
  background:var(--ktw-bg);
  font-family:var(--ktw-sans);
  line-height:1.8;
  text-align:left;
  color-scheme:light;
  -webkit-font-smoothing:antialiased;
}
.ktw-hero--sans { --ktw-word-font:var(--ktw-sans); }
.ktw-hero *, .ktw-hero *::before, .ktw-hero *::after { box-sizing:border-box; }
.ktw-hero .ktw-scene {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  grid-template-rows:144px minmax(0,auto) 144px 56px;
  width:100%;
  max-width:1280px;
  min-height:inherit;
  margin:0 auto;
  padding:0 20px;
}
.ktw-hero .ktw-band {
  display:grid;
  /* Two staggered tiers leave more horizontal room for each mobile word. */
  grid-template-columns:repeat(2,minmax(0,1fr));
  grid-template-rows:repeat(2,72px);
  gap:0 12px;
  grid-column:1 / -1;
  width:100%;
  pointer-events:none;
  user-select:none;
}
.ktw-hero .ktw-band--top { grid-row:1; }
.ktw-hero .ktw-band--bottom { grid-row:3; }
.ktw-hero .ktw-side { display:none; pointer-events:none; user-select:none; }
.ktw-hero .ktw-slot {
  container-type:inline-size;
  min-width:0;
  min-height:0;
  display:flex;
  justify-content:center;
  align-items:center;
  text-align:center;
}
.ktw-hero .ktw-slot--6, .ktw-hero .ktw-slot--7 { display:none; }
.ktw-hero .ktw-slot[data-ktw-empty="true"] { visibility:hidden; }
/* Keep all six mobile slots, but give the middle words a wider lane. */
.ktw-hero .ktw-slot--0 { grid-column:1; grid-row:1; }
.ktw-hero .ktw-slot--2 { grid-column:2; grid-row:1; }
.ktw-hero .ktw-slot--1 { grid-column:1 / -1; grid-row:2; width:82%; justify-self:center; }
.ktw-hero .ktw-slot--4 { grid-column:1 / -1; grid-row:1; width:82%; justify-self:center; }
.ktw-hero .ktw-slot--3 { grid-column:1; grid-row:2; }
.ktw-hero .ktw-slot--5 { grid-column:2; grid-row:2; }
.ktw-hero .ktw-word-motion {
  --ktw-current-word-size:var(--ktw-word-size-mobile,28px);
  display:block;
  margin:0;
  padding:0;
  white-space:nowrap;
  color:var(--ktw-ink);
  font-family:var(--ktw-word-font);
  font-size:min(var(--ktw-current-word-size),5.5vw);
  font-weight:400;
  line-height:1.35;
  letter-spacing:.035em;
  opacity:.46;
  transform-origin:center;
}
@supports (font-size:1cqw) {
  .ktw-hero .ktw-word-motion { font-size:min(var(--ktw-current-word-size),calc((100cqw - 24px) / (var(--ktw-count,4) * 1.06))); }
}
.ktw-hero.is-motion-ready .ktw-word-motion {
  animation:ktw-drift var(--ktw-duration,24s) cubic-bezier(.4,0,.4,1) var(--ktw-delay,0s) infinite both;
}
.ktw-hero.is-paused .ktw-word-motion,
.ktw-hero.is-offscreen .ktw-word-motion,
.ktw-hero.is-background .ktw-word-motion { animation-play-state:paused; }
.ktw-hero .ktw-core {
  position:relative;
  z-index:1;
  grid-column:1 / -1;
  grid-row:2;
  align-self:center;
  justify-self:center;
  width:100%;
  max-width:640px;
  padding:12px 0 18px;
  margin:0;
  text-align:center;
}
.ktw-hero p.ktw-eyebrow {
  margin:0 0 23px !important;
  padding:0;
  font-family:Arial,var(--ktw-sans);
  font-size:10px;
  font-weight:400;
  line-height:1.8;
  letter-spacing:.19em;
  overflow-wrap:anywhere;
  color:var(--ktw-ink);
}
.ktw-hero .ktw-heading {
  --ktw-headline-scale:var(--ktw-headline-scale-mobile,1);
  display:block;
  position:static;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:none !important;
  box-shadow:none !important;
  font-family:var(--ktw-sans);
  font-size:calc(clamp(32px,8.5vw,64px) * var(--ktw-headline-scale));
  font-weight:500;
  line-height:1.5;
  letter-spacing:.03em;
  color:var(--ktw-ink);
  text-align:center;
  overflow-wrap:anywhere;
  word-break:normal;
}
.ktw-hero .ktw-heading::before, .ktw-hero .ktw-heading::after { content:none !important; display:none !important; }
@supports (font-size:1cqw) { .ktw-hero .ktw-heading { font-size:calc(clamp(32px,8.5cqw,64px) * var(--ktw-headline-scale)); } }
.ktw-hero p.ktw-deck {
  margin:23px 0 0 !important;
  padding:0;
  font-size:13px;
  font-weight:400;
  line-height:2.05;
  letter-spacing:.035em;
  overflow-wrap:anywhere;
  color:var(--ktw-ink);
}
.ktw-hero a.ktw-profile {
  display:inline-flex;
  justify-content:center;
  align-items:center;
  gap:24px;
  max-width:100%;
  min-height:44px;
  margin:27px 0 0 !important;
  padding:4px 0;
  border:0;
  border-bottom:1px solid currentColor;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  text-decoration:none;
  text-underline-offset:.25em;
  color:var(--ktw-link);
  font-family:var(--ktw-sans);
  font-size:12px;
  line-height:1.7;
  letter-spacing:.045em;
  opacity:1;
}
.ktw-hero a.ktw-profile:hover { color:var(--ktw-ink); text-decoration:underline; }
.ktw-hero .ktw-arrow { font:400 22px/1 Arial,sans-serif; flex:none; }
.ktw-hero .ktw-controls {
  grid-row:4;
  grid-column:1 / -1;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:14px;
  margin:0;
  padding:0 4px 12px;
}
/* Small icon, but a 44px hit area for mouse, touch, and keyboard users. */
.ktw-hero button.ktw-motion-button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  width:44px;
  height:44px;
  min-width:44px;
  min-height:44px;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  color:var(--ktw-ink);
  font-family:var(--ktw-sans);
  font-size:11px;
  font-weight:400;
  line-height:1;
  cursor:pointer;
  opacity:.7;
  -webkit-appearance:none;
  appearance:none;
}
.ktw-hero button.ktw-motion-button[hidden] { display:none !important; }
.ktw-hero button.ktw-motion-button:disabled { cursor:default; opacity:.35; }
.ktw-hero button.ktw-motion-button:not(:disabled):hover,
.ktw-hero button.ktw-motion-button:focus-visible { background:transparent; color:var(--ktw-ink); opacity:1; }
.ktw-hero a:focus-visible,.ktw-hero button:focus-visible { outline:2px solid var(--ktw-link); outline-offset:5px; }
.ktw-hero .ktw-motion-icon { display:inline-block; position:relative; width:11px; height:11px; flex:none; }
.ktw-hero .ktw-motion-icon::before,.ktw-hero .ktw-motion-icon::after { content:""; position:absolute; top:0; width:2px; height:11px; background:currentColor; }
.ktw-hero .ktw-motion-icon::before { left:1px; }
.ktw-hero .ktw-motion-icon::after { right:1px; }
.ktw-hero button.ktw-motion-button[data-ktw-paused="true"] .ktw-motion-icon::before { width:0; height:0; background:transparent; border-top:5px solid transparent; border-bottom:5px solid transparent; border-left:8px solid currentColor; }
.ktw-hero button.ktw-motion-button[data-ktw-paused="true"] .ktw-motion-icon::after { display:none; }
.ktw-hero .ktw-sr-only {
  position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important;
  overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important;
}
@keyframes ktw-drift {
  0%,100% { opacity:0; transform:translate3d(-5px,10px,0) scale(.94); }
  18% { opacity:.38; }
  43% { opacity:.6; transform:translate3d(6px,-7px,0) scale(1.04); }
  66% { opacity:.44; transform:translate3d(2px,-13px,0) scale(1.01); }
  86% { opacity:.06; }
  96% { opacity:0; }
}
@container ktw (min-width:700px) {
  .ktw-hero .ktw-heading { --ktw-headline-scale:var(--ktw-headline-scale-desktop,1); }
  .ktw-hero .ktw-scene { padding:0 36px; grid-template-rows:120px minmax(280px,auto) 124px 56px; }
  .ktw-hero .ktw-band { grid-template-columns:repeat(4,minmax(0,1fr)); grid-template-rows:1fr; gap:12px; }
  .ktw-hero .ktw-slot { grid-column:auto; grid-row:auto; width:auto; justify-self:stretch; }
  .ktw-hero .ktw-word-motion { --ktw-current-word-size:var(--ktw-word-size,36px); }
  .ktw-hero .ktw-slot--0 { transform:translateY(-6px); }
  .ktw-hero .ktw-slot--1 { transform:translateY(10px); }
  .ktw-hero .ktw-slot--2 { transform:translateY(-8px); }
  .ktw-hero .ktw-slot--3 { transform:translateY(4px); }
  .ktw-hero .ktw-slot--4 { transform:translateY(-8px); }
  .ktw-hero .ktw-slot--5 { transform:translateY(8px); }
  .ktw-hero .ktw-slot--6 { transform:translateY(-14px); }
  .ktw-hero .ktw-slot--7 { transform:translateY(14px); }
  .ktw-hero .ktw-slot--6,.ktw-hero .ktw-slot--7 { display:flex; }
  .ktw-hero .ktw-core { padding:12px 10px 18px; }
  .ktw-hero .ktw-deck { font-size:14px !important; }
  .ktw-hero .ktw-eyebrow { font-size:11px !important; }
}
@container ktw (min-width:1100px) {
  .ktw-hero .ktw-scene { padding:0 40px; grid-template-columns:minmax(0,1fr) minmax(0,660px) minmax(0,1fr); }
  .ktw-hero .ktw-core { grid-column:2; }
  .ktw-hero .ktw-side { display:flex; grid-row:2; align-items:center; justify-content:center; }
  .ktw-hero .ktw-side > .ktw-slot { width:100%; }
  .ktw-hero .ktw-side--left { grid-column:1; transform:translateY(-45px); }
  .ktw-hero .ktw-side--right { grid-column:3; transform:translateY(10px); }
  .ktw-hero .ktw-heading { font-size:calc(66px * var(--ktw-headline-scale)); }
}
/* Progressive enhancement: keep the existing content/grid height, but release the words
   from their fixed cells. Only the hero clips them; no global overflow overrides. */
.ktw-hero.is-random-layout .ktw-side { transform:none; }
.ktw-hero.is-random-layout .ktw-slot {
  position:absolute;
  z-index:0;
  display:block;
  container-type:normal;
  grid-column:auto;
  grid-row:auto;
  justify-self:auto;
  width:max-content;
  max-width:none;
  height:auto;
  margin:0;
  padding:0;
  transform:translate(-50%,-50%);
  opacity:var(--ktw-cloud-opacity,1);
  pointer-events:none;
  user-select:none;
}
.ktw-hero.is-random-layout .ktw-side > .ktw-slot { width:max-content; }
.ktw-hero.is-random-layout .ktw-slot[hidden] { display:none !important; }
.ktw-hero.is-random-layout .ktw-word-motion {
  width:max-content;
  max-width:none;
  font-size:var(--ktw-random-size,32px);
  line-height:1.14;
}
.ktw-hero .ktw-controls { position:relative; z-index:2; }
/* Without container queries, choose the scale by viewport and keep the compact layout. */
@supports not (container-type:inline-size) {
  @media (min-width:700px) {
    .ktw-hero .ktw-heading { --ktw-headline-scale:var(--ktw-headline-scale-desktop,1); }
  }
}
/* Older browsers keep the compact layout rather than overflowing the page. */
@media (prefers-reduced-motion:reduce) {
  .ktw-hero .ktw-word-motion { animation:none !important; transform:none !important; opacity:.46 !important; }
}
@media print {
  .ktw-hero,.ktw-hero .ktw-scene { min-height:0; }
  .ktw-hero .ktw-scene { grid-template-rows:auto auto auto 0; }
  .ktw-hero .ktw-word-motion { animation:none !important; transform:none !important; opacity:.46 !important; }
  .ktw-hero .ktw-controls { display:none; }
}
@media print {
  .ktw-hero.is-random-layout .ktw-slot,
  .ktw-hero.is-random-layout .ktw-side > .ktw-slot { position:static; width:auto; transform:none; opacity:1; }
  .ktw-hero.is-random-layout .ktw-word-motion { width:auto; font-size:min(18px,4vw); }
}

/* Sparse decorative network. It never handles clicks or contributes to layout. */
.ktw-hero svg.ktw-network {
  position:absolute;
  inset:0;
  z-index:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  margin:0;
  padding:0;
  border:0;
  overflow:hidden;
  background:none;
  color:var(--ktw-ink);
  pointer-events:none;
  user-select:none;
}
.ktw-hero .ktw-network-link {
  fill:none;
  stroke:currentColor;
  stroke-width:.75;
  stroke-linecap:round;
  vector-effect:non-scaling-stroke;
}
.ktw-hero .ktw-network-node {
  fill:var(--ktw-bg);
  stroke:currentColor;
  stroke-width:.75;
  vector-effect:non-scaling-stroke;
}
@media print { .ktw-hero svg.ktw-network { display:none; } }
