:root{
    /* ---- light wisteria / indigo palette ---- */
    --c-bg:#fdfcfb;
    --c-bg-soft:#f7f3fb;
    --c-bg-soft2:#f3eefb;
    --c-bg-alt:#f5f1fa;

    --c-ink:#282a52;
    --c-ink-soft:#5c5d80;
    --c-indigo:#2b3068;
    --c-indigo-deep:#181b3e;
    --c-indigo-deep2:#20244c;

    --c-fuji:#8977b8;
    --c-fuji-deep:#6f5ea0;
    --c-fuji-pale:#d9cdf0;
    --c-lavender:#efe8fa;

    --c-gold:#c7a869;
    --c-gold-soft:#e3d3ad;

    --c-line: rgba(43,48,104,0.14);
    --c-line-strong: rgba(43,48,104,0.26);
    --c-line-gold: rgba(199,168,105,0.45);
    --c-line-light-on-dark: rgba(255,255,255,0.22);

    --c-white:#ffffff;

    --font-serif: 'Shippori Mincho', serif;
    --font-sans: 'Noto Sans JP', sans-serif;
    --font-en: 'Cormorant Garamond', serif;

    --measure: 640px;
    --section-pad: clamp(72px, 10vw, 132px);
  }

  *{ box-sizing:border-box; }
  html{ scroll-behavior:smooth; }
  body{
    margin:0;
    background:var(--c-bg);
    color:var(--c-ink);
    font-family:var(--font-sans);
    font-weight:300;
    line-height:1.9;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  img,svg{ display:block; max-width:100%; }
  a{ color:inherit; text-decoration:none; }
  ul{ margin:0; padding:0; list-style:none; }
  h1,h2,h3,p{ margin:0; }

  @media (prefers-reduced-motion: reduce){
    *{ animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important; }
  }

  .wrap{
    max-width:1180px;
    margin:0 auto;
    padding-left:clamp(20px,5vw,64px);
    padding-right:clamp(20px,5vw,64px);
  }

  /* ---------- Section label ---------- */
  .label{
    display:flex;
    align-items:center;
    gap:14px;
    font-family:var(--font-en);
    font-size:15px;
    letter-spacing:0.28em;
    color:var(--c-fuji-deep);
    margin-bottom:22px;
  }
  .label::before{
    content:"";
    width:6px; height:6px;
    border-radius:50%;
    background:var(--c-fuji-deep);
    flex:none;
  }
  .label .jp{
    font-family:var(--font-sans);
    letter-spacing:0.08em;
    color:var(--c-ink-soft);
    font-size:13px;
  }
  .label.on-dark{ color:var(--c-gold-soft); }
  .label.on-dark::before{ background:var(--c-gold-soft); }
  .label.on-dark .jp{ color:rgba(255,255,255,0.62); }

  /* ---------- NAV ---------- */
  header.site-nav{
    position:fixed; top:0; left:0; right:0; z-index:100;
    display:flex; align-items:center; justify-content:space-between;
    padding:24px clamp(20px,5vw,48px);
    color:var(--c-indigo);
    transition:background .5s ease, box-shadow .5s ease, padding .3s ease;
  }
  header.site-nav.scrolled{
    background:rgba(253,252,251,0.9);
    backdrop-filter:blur(10px);
    box-shadow:0 1px 0 var(--c-line);
    padding-top:14px; padding-bottom:14px;
  }
  .brand{
    font-family:var(--font-serif);
    font-size:15px;
    letter-spacing:0.14em;
    font-weight:600;
  }
  .brand small{
    display:block;
    font-family:var(--font-en);
    font-weight:400;
    font-size:11px;
    letter-spacing:0.24em;
    opacity:0.6;
    margin-top:2px;
  }
  nav.primary{ display:flex; gap:38px; }
  nav.primary a{
    font-size:13px;
    letter-spacing:0.14em;
    position:relative;
    padding-bottom:4px;
  }
  nav.primary a::after{
    content:"";
    position:absolute; left:0; right:100%; bottom:0;
    height:1px; background:currentColor;
    transition:right .35s ease;
  }
  nav.primary a:hover::after{ right:0; }

  .nav-toggle{
    display:none;
    width:30px; height:22px;
    position:relative;
    background:none; border:none; cursor:pointer;
    color:var(--c-indigo);
    z-index:110;
  }
  .nav-toggle span{
    position:absolute; left:0; right:0; height:1px;
    background:currentColor;
    transition:transform .3s ease, opacity .3s ease;
  }
  .nav-toggle span:nth-child(1){ top:2px; }
  .nav-toggle span:nth-child(2){ top:11px; }
  .nav-toggle span:nth-child(3){ top:20px; }
  .nav-toggle.open span:nth-child(1){ transform:translateY(9px) rotate(45deg); }
  .nav-toggle.open span:nth-child(2){ opacity:0; }
  .nav-toggle.open span:nth-child(3){ transform:translateY(-9px) rotate(-45deg); }

  .mobile-panel{
    position:fixed; inset:0; z-index:105;
    background:var(--c-indigo-deep);
    color:#fff;
    display:flex; flex-direction:column;
    align-items:center; justify-content:center;
    gap:30px;
    opacity:0; pointer-events:none;
    transition:opacity .4s ease;
  }
  .mobile-panel.open{ opacity:1; pointer-events:auto; }
  .mobile-panel a{ font-size:20px; font-family:var(--font-serif); letter-spacing:0.08em; }

  /* ---------- BUTTONS ---------- */
  .btn{
    display:inline-flex; align-items:center; gap:12px;
    padding:16px 34px;
    border:1px solid currentColor;
    font-size:13px;
    letter-spacing:0.18em;
    font-family:var(--font-sans);
    font-weight:400;
    position:relative;
    overflow:hidden;
    transition:color .4s ease;
  }
  .btn::before{
    content:"";
    position:absolute; inset:0;
    background:currentColor;
    transform:scaleX(0);
    transform-origin:left;
    transition:transform .4s cubic-bezier(.65,0,.35,1);
    z-index:-1;
  }
  .btn-primary{ color:var(--c-indigo); }
  .btn-primary::before{ background:var(--c-indigo); }
  .btn-primary:hover{ color:#fff; }
  .btn-light{ color:#fff; }
  .btn-light::before{ background:#fff; }
  .btn-light:hover{ color:var(--c-indigo-deep); }
  .btn .mark{ width:5px; height:5px; border-radius:50%; background:currentColor; flex:none; }

  .btn-row{ display:flex; flex-wrap:wrap; gap:18px; }

  /* ---------- HERO ---------- */
  .hero{
    position:relative;
    min-height:100vh;
    background:
      radial-gradient(ellipse 60% 50% at 50% 10%, var(--c-lavender) 0%, transparent 60%),
      linear-gradient(180deg, #ffffff 0%, #fbf8fd 55%, #f6f0fb 100%);
    color:var(--c-indigo);
    display:flex;
    align-items:center;
    justify-content:center;
    padding:150px 20px 90px;
    overflow:hidden;
  }
  .hero-circles{
    position:absolute;
    top:50%; left:50%;
    width:min(920px, 150vw);
    height:min(920px, 150vw);
    transform:translate(-50%,-50%);
    animation:spin 160s linear infinite;
    opacity:0.5;
  }
  @keyframes spin{ to{ transform:translate(-50%,-50%) rotate(360deg); } }
  .hero-circles-inner{
    position:absolute; top:50%; left:50%;
    width:66%; height:66%;
    transform:translate(-50%,-50%);
    animation:spin 110s linear infinite reverse;
    opacity:0.55;
  }
  .hero::after{
    content:"";
    position:absolute; inset:0;
    background:
      radial-gradient(circle at 18% 22%, rgba(137,119,184,0.10), transparent 42%),
      radial-gradient(circle at 82% 78%, rgba(199,168,105,0.08), transparent 42%);
    pointer-events:none;
  }
  .particles{ position:absolute; inset:0; overflow:hidden; pointer-events:none; }
  .particle{
    position:absolute;
    width:3px; height:3px;
    border-radius:50%;
    background:var(--c-fuji);
    opacity:0.35;
    animation:drift 14s ease-in-out infinite;
  }
  @keyframes drift{
    0%,100%{ transform:translateY(0) translateX(0); opacity:0.12; }
    50%{ transform:translateY(-26px) translateX(8px); opacity:0.5; }
  }

  .hero-inner{
    position:relative; z-index:2;
    text-align:center;
    display:flex; flex-direction:column; align-items:center;
    gap:30px;
    width:100%;
  }
  .logo-space{
    width:min(320px, 70vw);
    height:min(320px,70vw);
    max-height:220px;
    border:1px solid var(--c-line-strong);
    border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    font-family:var(--font-en);
    letter-spacing:0.32em;
    font-size:11px;
    color:var(--c-ink-soft);
    text-align:center;
    padding:20px;
    background:rgba(255,255,255,0.5);
  }
  .eyebrow-en{
    font-family:var(--font-en);
    font-style:italic;
    font-size:15px;
    letter-spacing:0.3em;
    color:var(--c-fuji-deep);
  }
  .hero h1{
    font-family:var(--font-serif);
    font-weight:800;
    font-size:clamp(2.4rem, 6vw, 4.6rem);
    letter-spacing:0.1em;
    line-height:1.3;
    color:var(--c-indigo-deep);
  }
  .hero .subtitle{
    font-family:var(--font-serif);
    font-weight:400;
    font-size:clamp(1rem, 2vw, 1.35rem);
    letter-spacing:0.14em;
    color:var(--c-fuji-deep);
  }
  .hero .date-en{
    font-family:var(--font-en);
    font-weight:500;
    font-size:clamp(1.6rem, 3.6vw, 2.4rem);
    letter-spacing:0.08em;
    color:var(--c-indigo-deep);
  }
  .hero .date-en span{ color:var(--c-fuji-deep); font-style:italic; margin-left:10px; }
  .hero .event-type{
    font-size:13px;
    letter-spacing:0.24em;
    color:var(--c-ink-soft);
  }

  .concept-frame{
    margin-top:12px;
    padding:26px clamp(24px,6vw,60px);
    border:1px solid var(--c-line-gold);
    background:rgba(255,255,255,0.55);
    position:relative;
  }
  .concept-frame::before,.concept-frame::after{
    content:"";
    position:absolute; width:10px; height:10px;
    border:1px solid var(--c-gold);
  }
  .concept-frame::before{ top:-1px; left:-1px; border-right:none; border-bottom:none; }
  .concept-frame::after{ bottom:-1px; right:-1px; border-left:none; border-top:none; }
  .concept-frame p{
    font-family:var(--font-serif);
    font-size:clamp(1.15rem, 2.6vw, 1.6rem);
    letter-spacing:0.06em;
    font-weight:500;
    color:var(--c-indigo-deep);
  }

  .scroll-cue{
    position:absolute; bottom:34px; left:50%; transform:translateX(-50%);
    display:flex; flex-direction:column; align-items:center; gap:10px;
    color:var(--c-ink-soft);
    font-family:var(--font-en);
    font-size:11px;
    letter-spacing:0.3em;
  }
  .scroll-cue .line{
    width:1px; height:34px;
    background:linear-gradient(to bottom, var(--c-fuji-deep), transparent);
    animation:cue 2.2s ease-in-out infinite;
  }
  @keyframes cue{ 0%,100%{ transform:scaleY(1); opacity:0.7;} 50%{ transform:scaleY(0.5); opacity:0.2; } }

  /* ---------- KEY VISUAL ---------- */
  .keyvisual-section{
    background:linear-gradient(180deg, #f6f0fb 0%, var(--c-bg) 100%);
    padding:clamp(56px,8vw,100px) 0;
  }
  .kv-caption{
    text-align:center;
    margin-bottom:34px;
  }
  .kv-frame-outer{
    max-width:1240px;
    margin:0 auto;
    padding:0 clamp(20px,5vw,64px);
  }
  .kv-media{
    position:relative;
    max-width:1200px;
    margin:0 auto;
    aspect-ratio: 16 / 9;
    background:
      radial-gradient(circle at 30% 30%, rgba(137,119,184,0.18), transparent 55%),
      radial-gradient(circle at 75% 70%, rgba(199,168,105,0.14), transparent 50%),
      linear-gradient(135deg, #eee7fa 0%, #f8f5fc 50%, #e9e2f6 100%);
    border:1px solid var(--c-line-gold);
    box-shadow:0 30px 70px -30px rgba(43,48,104,0.25);
    display:flex; align-items:center; justify-content:center;
    overflow:hidden;
  }
  .kv-media::before{
    content:"";
    position:absolute; inset:14px;
    border:1px solid rgba(199,168,105,0.5);
    pointer-events:none;
  }
  .kv-media-inner{
    position:relative; z-index:2;
    text-align:center;
    color:var(--c-fuji-deep);
    font-family:var(--font-en);
    letter-spacing:0.3em;
    font-size:13px;
    display:flex; flex-direction:column; gap:10px; align-items:center;
  }
  .kv-media-inner .jp{
    font-family:var(--font-serif);
    color:var(--c-indigo-deep);
    letter-spacing:0.1em;
    font-size:15px;
  }
  .kv-media svg{ width:64px; height:64px; opacity:0.5; }
  .kv-note{
    text-align:center;
    margin-top:22px;
    font-size:12px;
    letter-spacing:0.06em;
    color:var(--c-ink-soft);
  }

  /* ---------- LATEST UPDATE ---------- */
  .latest-update{
    background:var(--c-bg-soft);
    border-top:1px solid var(--c-line);
    border-bottom:1px solid var(--c-line);
  }
  .latest-update .wrap{
    display:flex;
    align-items:center;
    gap:28px;
    padding-top:20px;
    padding-bottom:20px;
    flex-wrap:wrap;
  }
  .lu-label{
    font-family:var(--font-en);
    font-size:12.5px;
    letter-spacing:0.24em;
    color:var(--c-fuji-deep);
    flex:none;
  }
  .lu-item{
    display:flex;
    align-items:baseline;
    gap:18px;
    flex:1 1 auto;
    min-width:0;
    font-size:14px;
  }
  .lu-item .date{ font-family:var(--font-en); color:var(--c-ink-soft); flex:none; }
  .lu-item .cat{
    font-size:11px; letter-spacing:0.08em;
    border:1px solid var(--c-fuji-pale);
    color:var(--c-fuji-deep);
    padding:2px 10px;
    flex:none;
    white-space:nowrap;
  }
  .lu-item .title{
    color:var(--c-ink);
    overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  }
  .lu-item .arrow{ flex:none; color:var(--c-fuji-deep); }
  .lu-link{ display:contents; }

  /* ---------- SECTION generic ---------- */
  section{ position:relative; }
  .section-pad{ padding:var(--section-pad) 0; }
  .section-head{ margin-bottom:56px; }
  .section-title{
    font-family:var(--font-serif);
    font-weight:600;
    font-size:clamp(1.6rem, 3.2vw, 2.3rem);
    letter-spacing:0.08em;
    color:var(--c-indigo-deep);
  }

  /* ---------- EVENT ---------- */
  .event-section{ background:var(--c-bg); }
  .event-list{ max-width:760px; margin:0 auto; border-top:1px solid var(--c-line); }
  .event-row{
    display:grid;
    grid-template-columns: 160px 1fr;
    gap:24px;
    padding:26px 4px;
    border-bottom:1px solid var(--c-line);
    align-items:baseline;
  }
  .event-row dt{
    font-family:var(--font-serif);
    font-size:14px;
    letter-spacing:0.14em;
    color:var(--c-fuji-deep);
    font-weight:600;
  }
  .event-row dd{
    margin:0;
    font-size:15px;
    color:var(--c-ink);
    font-weight:400;
  }
  .event-row dd .note{
    display:block;
    font-size:12.5px;
    color:var(--c-ink-soft);
    margin-top:6px;
    letter-spacing:0.02em;
  }
  .event-cta{ text-align:center; margin-top:48px; }

  /* ---------- CONCEPT ---------- */
  .concept-section{
    background:
      radial-gradient(ellipse 70% 60% at 50% 0%, rgba(137,119,184,0.35), transparent 60%),
      linear-gradient(180deg, var(--c-indigo-deep2) 0%, var(--c-indigo-deep) 100%);
    color:#fff;
    text-align:center;
    overflow:hidden;
  }
  .concept-section .deco-ring{
    position:absolute; top:50%; left:50%;
    width:820px; height:820px;
    transform:translate(-50%,-50%);
    opacity:0.16;
    pointer-events:none;
  }
  .concept-section .inner{ position:relative; z-index:2; max-width:680px; margin:0 auto; }
  .concept-main{
    font-family:var(--font-serif);
    font-weight:600;
    font-size:clamp(1.7rem, 4vw, 2.5rem);
    letter-spacing:0.08em;
    line-height:1.6;
    margin-bottom:40px;
  }
  .concept-body{
    font-size:15.5px;
    color:rgba(255,255,255,0.86);
    line-height:2.1;
    margin-bottom:44px;
  }
  .concept-aside{
    display:inline-block;
    font-family:var(--font-serif);
    font-style:normal;
    font-size:14px;
    letter-spacing:0.16em;
    color:var(--c-gold-soft);
    padding:12px 26px;
    border:1px solid rgba(255,255,255,0.28);
  }

  /* ---------- PARTICIPATION ---------- */
  .participation-section{ background:var(--c-bg-alt); }
  .path-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:1px;
    background:var(--c-line-strong);
    max-width:980px;
    margin:0 auto;
  }
  .path-card{
    background:var(--c-bg-alt);
    padding:56px 44px;
    display:flex; flex-direction:column; gap:22px;
  }
  .path-card .path-en{
    font-family:var(--font-en);
    font-style:italic;
    font-size:14px;
    letter-spacing:0.2em;
    color:var(--c-fuji-deep);
  }
  .path-card h3{
    font-family:var(--font-serif);
    font-weight:600;
    font-size:1.5rem;
    letter-spacing:0.06em;
    color:var(--c-indigo-deep);
  }
  .path-card p{ font-size:14.5px; color:var(--c-ink-soft); }
  .path-card .btn{ align-self:flex-start; margin-top:8px; }

  /* ---------- PROJECT ---------- */
  .project-section{ background:var(--c-bg); }
  .project-list{
    display:grid;
    grid-template-columns:1fr 1fr;
    border-top:1px solid var(--c-line);
    border-left:1px solid var(--c-line);
  }
  .project-item{
    padding:34px 32px;
    border-right:1px solid var(--c-line);
    border-bottom:1px solid var(--c-line);
    position:relative;
  }
  .project-item .ring{
    width:9px; height:9px;
    border:1px solid var(--c-fuji-deep);
    border-radius:50%;
    margin-bottom:16px;
  }
  .project-item h3{
    font-family:var(--font-serif);
    font-size:1.05rem;
    font-weight:600;
    letter-spacing:0.04em;
    margin-bottom:8px;
    color:var(--c-indigo-deep);
  }
  .project-item p{ font-size:13.5px; color:var(--c-ink-soft); letter-spacing:0.02em; }

  .project-note{
    max-width:640px; margin:52px auto 0; text-align:center;
    font-size:14.5px; color:var(--c-ink-soft); line-height:2;
  }
  .project-cta{ text-align:center; margin-top:36px; }

  /* ---------- NEWS & UPDATE ---------- */
  .news-section{ background:var(--c-bg-soft2); }
  .news-list{ max-width:800px; margin:0 auto; border-top:1px solid var(--c-line); }
  .news-row{
    display:grid;
    grid-template-columns:120px 100px 1fr;
    gap:20px;
    padding:20px 14px;
    border-bottom:1px solid var(--c-line);
    font-size:14px;
    align-items:baseline;
    transition:background .3s ease;
  }
  .news-row:hover{ background:var(--c-lavender); }
  .news-row .date{ font-family:var(--font-en); color:var(--c-ink-soft); font-size:14px; }
  .news-row .cat{
    font-size:11.5px; letter-spacing:0.1em; color:var(--c-fuji-deep);
    border:1px solid var(--c-fuji-pale);
    padding:3px 10px;
    justify-self:start;
    white-space:nowrap;
  }
  .news-all{ text-align:center; margin-top:38px; }
  .news-all a{
    font-size:13px; letter-spacing:0.14em;
    color:var(--c-fuji-deep);
    border-bottom:1px solid var(--c-fuji-pale);
    padding-bottom:4px;
  }
  .news-sample-note{
    max-width:800px; margin:20px auto 0;
    font-size:11.5px; color:var(--c-ink-soft);
    text-align:right; opacity:0.75;
  }

  /* ---------- FOOTER ---------- */
  footer{
    background:var(--c-indigo-deep);
    color:rgba(255,255,255,0.82);
    padding:70px 0 34px;
  }
  .footer-top{
    display:flex; flex-wrap:wrap; justify-content:space-between; gap:40px;
    padding-bottom:44px; border-bottom:1px solid rgba(255,255,255,0.14);
    margin-bottom:30px;
  }
  .footer-brand{
    font-family:var(--font-serif);
    font-size:1.2rem; letter-spacing:0.1em; font-weight:600;
    display:flex; flex-direction:column; gap:8px;
  }
  .footer-brand .date-en{ font-family:var(--font-en); font-size:1rem; color:var(--c-gold-soft); letter-spacing:0.1em; }
  .footer-meta{ display:flex; flex-direction:column; gap:10px; font-size:13.5px; }
  .footer-meta a{ transition:opacity .3s ease; }
  .footer-meta a:hover{ opacity:0.7; }
  .footer-nav{ display:flex; flex-wrap:wrap; gap:26px; font-size:13px; letter-spacing:0.08em; }
  .disclaimer{
    font-size:12px; line-height:1.9; color:rgba(255,255,255,0.5);
    max-width:760px; margin-bottom:22px;
  }
  .copyright{ font-size:11.5px; color:rgba(255,255,255,0.4); letter-spacing:0.06em; }

  /* ---------- RESPONSIVE ---------- */
  @media (max-width: 860px){
    nav.primary{ display:none; }
    .nav-toggle{ display:block; }
    .path-grid{ grid-template-columns:1fr; }
    .project-list{ grid-template-columns:1fr; }
    .event-row{ grid-template-columns:110px 1fr; }
    .news-row{ grid-template-columns:88px 84px 1fr; font-size:13px; }
    .lu-item{ flex-wrap:wrap; row-gap:6px; }
    .lu-item .title{ white-space:normal; flex-basis:100%; }
  }
  @media (max-width: 520px){
    .event-row{ grid-template-columns:1fr; gap:6px; }
    .event-row dt{ margin-bottom:2px; }
    .latest-update .wrap{ flex-direction:column; align-items:flex-start; gap:10px; }
  }

  :focus-visible{ outline:2px solid var(--c-fuji-deep); outline-offset:3px; }


  /* ==================================================================
     SHARED SCROLL-REVEAL UTILITY (used by KEY VISUAL on HOME and by
     section blocks on ABOUT and other inner pages)
  ================================================================== */
  .js-reveal{
    opacity:0;
    transform:translateY(40px);
    transition:opacity 1s cubic-bezier(.22,.61,.36,1), transform 1s cubic-bezier(.22,.61,.36,1);
  }
  .js-reveal.is-visible{ opacity:1; transform:translateY(0); }
  .js-reveal.kv{ transform:translateY(50px); transition-duration:1.1s; }
  @media (prefers-reduced-motion: reduce){
    .js-reveal{ opacity:1 !important; transform:none !important; transition:none !important; }
  }

  /* ==================================================================
     NAV — current page indicator (shared)
  ================================================================== */
  nav.primary a.current,
  .mobile-panel a.current{
    color:var(--c-fuji-deep);
  }
  nav.primary a.current::after{ right:0; background:var(--c-fuji-deep); }

  /* ==================================================================
     INNER PAGE HERO (compact page header — e.g. ABOUT)
  ================================================================== */
  .page-hero{
    position:relative;
    padding:158px 20px 86px;
    text-align:center;
    overflow:hidden;
    background:
      radial-gradient(ellipse 60% 55% at 50% 0%, var(--c-lavender) 0%, transparent 62%),
      linear-gradient(180deg, #ffffff 0%, #faf7fd 100%);
  }
  .page-hero-circles{
    position:absolute; top:50%; left:50%;
    width:min(760px, 140vw); height:min(760px, 140vw);
    transform:translate(-50%,-50%);
    animation:spin 170s linear infinite;
    opacity:0.4;
    pointer-events:none;
  }
  .page-hero-inner{ position:relative; z-index:2; display:flex; flex-direction:column; align-items:center; gap:18px; }
  .page-hero-inner .label{ margin-bottom:2px; }
  .page-hero h1{
    font-family:var(--font-serif);
    font-weight:600;
    font-size:clamp(1.9rem, 4.4vw, 2.9rem);
    letter-spacing:0.1em;
    color:var(--c-indigo-deep);
  }
  .page-hero-copy{
    font-family:var(--font-serif);
    font-style:italic;
    font-size:15px;
    letter-spacing:0.1em;
    color:var(--c-fuji-deep);
  }

  /* ==================================================================
     PROSE (shared narrow reading column for ABOUT-style copy)
  ================================================================== */
  .prose{
    max-width:640px;
    margin:0 auto;
    text-align:left;
  }
  .prose p{ font-size:15px; color:var(--c-ink-soft); margin-bottom:1.6em; }
  .prose p:last-child{ margin-bottom:0; }
  .prose.center{ text-align:center; }

  /* ==================================================================
     WHY 5.29
  ================================================================== */
  .why-section{ background:var(--c-bg); text-align:center; overflow:hidden; }
  .why-number{
    position:relative;
    font-family:var(--font-en);
    font-weight:400;
    font-size:clamp(3.6rem, 12vw, 8.5rem);
    letter-spacing:0.04em;
    color:var(--c-indigo-deep);
    line-height:1;
    margin-bottom:14px;
  }
  .why-ring{
    position:absolute; top:50%; left:50%;
    width:clamp(320px, 60vw, 640px);
    height:clamp(320px, 60vw, 640px);
    transform:translate(-50%,-50%);
    opacity:0.5;
    pointer-events:none;
    z-index:0;
  }
  .why-number span{ position:relative; z-index:1; }
  .why-sub{
    font-family:var(--font-serif);
    font-size:clamp(1.05rem, 2vw, 1.3rem);
    letter-spacing:0.08em;
    color:var(--c-fuji-deep);
    margin-bottom:34px;
  }

  /* ==================================================================
     HOW TO JOIN — chips
  ================================================================== */
  .join-grid{
    display:grid;
    grid-template-columns:repeat(4, 1fr);
    gap:14px;
    max-width:760px;
    margin:0 auto 46px;
  }
  .join-chip{
    border:1px solid var(--c-line);
    padding:22px 8px;
    text-align:center;
    font-family:var(--font-serif);
    font-size:15px;
    letter-spacing:0.1em;
    color:var(--c-indigo);
    background:var(--c-bg);
    transition:border-color .3s ease, background .3s ease;
  }
  .join-chip:hover{ border-color:var(--c-fuji); background:var(--c-lavender); }

  /* ==================================================================
     ORGANIZER
  ================================================================== */
  .organizer-section{ background:var(--c-bg-soft); }
  .organizer-sign{
    margin-top:30px;
    text-align:right;
    font-family:var(--font-serif);
    font-size:14px;
    letter-spacing:0.14em;
    color:var(--c-indigo);
  }

  /* ==================================================================
     INFO BOX (unofficial notice — calm, not alarming)
  ================================================================== */
  .info-box{
    max-width:680px;
    margin:0 auto;
    border:1px solid var(--c-line-gold);
    padding:34px clamp(22px,5vw,44px);
    background:rgba(255,255,255,0.6);
    text-align:center;
  }
  .info-box p{ font-size:13.5px; color:var(--c-ink-soft); line-height:2; }
  .info-box p + p{ margin-top:14px; }

  /* ==================================================================
     BOTTOM CTA (two-path, echoes PARTICIPATION on HOME)
  ================================================================== */
  .bottom-cta-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:1px;
    background:var(--c-line-strong);
    max-width:900px;
    margin:0 auto;
  }
  .bottom-cta-card{
    background:var(--c-bg-alt);
    padding:48px 40px;
    display:flex; flex-direction:column; gap:16px;
    text-align:left;
  }
  .bottom-cta-card .cta-eyebrow{
    font-size:13.5px; color:var(--c-ink-soft); letter-spacing:0.04em;
  }
  .bottom-cta-card .cta-link{
    font-family:var(--font-serif);
    font-size:1.35rem;
    letter-spacing:0.08em;
    color:var(--c-indigo-deep);
    display:inline-flex; align-items:center; gap:10px;
  }
  .bottom-cta-card:hover .cta-link{ color:var(--c-fuji-deep); }

  @media (max-width: 860px){
    .join-grid{ grid-template-columns:repeat(4, 1fr); }
    .bottom-cta-grid{ grid-template-columns:1fr; }
  }
  @media (max-width: 560px){
    .join-grid{ grid-template-columns:repeat(2, 1fr); }
  }


  /* ==================================================================
     GUIDE PAGE (/guide/) — long-form reference content
     Added for 参加要項. Does not modify existing rules above.
  ================================================================== */

  /* generic notice box (distinct from ABOUT's .info-box) */
  .notice{
    border:1px solid var(--c-line-gold);
    background:var(--c-lavender);
    padding:22px 26px;
    margin:26px 0;
  }
  .notice.gold{
    border-color: var(--c-gold);
    background:#faf4e6;
  }
  .notice p{
    font-size:14px;
    color:var(--c-ink);
    line-height:1.9;
    margin:0;
  }
  .notice p + p{ margin-top:12px; }
  .notice .notice-lead{
    font-family:var(--font-serif);
    font-weight:600;
    font-size:15.5px;
    letter-spacing:0.03em;
    color:var(--c-indigo-deep);
    margin-bottom:10px;
  }
  .notice .guide-list{ margin:14px 0 14px; }

  /* quick navigation chip list */
  .quicknav{
    list-style:none;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:10px;
    max-width:820px;
    margin:0 auto;
    padding:0;
  }
  .quicknav a{
    display:inline-block;
    padding:10px 20px;
    border:1px solid var(--c-line);
    font-size:13px;
    letter-spacing:0.05em;
    color:var(--c-indigo);
    background:var(--c-bg);
    transition:border-color .3s ease, background .3s ease, color .3s ease;
  }
  .quicknav a:hover{
    border-color:var(--c-fuji);
    background:var(--c-lavender);
    color:var(--c-fuji-deep);
  }

  /* two-column layout: sticky mini TOC + long-form content */
  .guide-body{ background:var(--c-bg); }
  .guide-layout{
    display:grid;
    grid-template-columns: 220px 1fr;
    gap:64px;
    align-items:start;
  }
  .guide-toc{
    position:sticky;
    top:112px;
  }
  .guide-toc-label{
    font-family:var(--font-en);
    font-size:12px;
    letter-spacing:0.24em;
    color:var(--c-fuji-deep);
    margin:0 0 16px;
  }
  .guide-toc ul{ display:flex; flex-direction:column; gap:11px; }
  .guide-toc a{
    display:block;
    font-size:12.5px;
    letter-spacing:0.02em;
    color:var(--c-ink-soft);
    border-left:1px solid var(--c-line);
    padding-left:14px;
    line-height:1.6;
    transition:color .3s ease, border-color .3s ease;
  }
  .guide-toc a.active,
  .guide-toc a:hover{
    color:var(--c-fuji-deep);
    border-left-color:var(--c-fuji-deep);
  }

  .guide-content{ max-width:720px; }
  .guide-section{
    padding:44px 0;
    border-top:1px solid var(--c-line);
  }
  .guide-section:first-child{ border-top:none; padding-top:0; }
  .guide-heading{
    display:flex;
    align-items:baseline;
    gap:12px;
    margin-bottom:10px;
  }
  .guide-heading .num{
    font-family:var(--font-en);
    font-size:14px;
    letter-spacing:0.08em;
    color:var(--c-fuji-deep);
  }
  .guide-heading .cat-en{
    font-family:var(--font-en);
    font-style:italic;
    font-size:12.5px;
    letter-spacing:0.14em;
    color:var(--c-ink-soft);
  }
  .guide-section .section-title{ font-size:1.3rem; margin-bottom:6px; }
  .guide-section .prose{ max-width:none; margin:18px 0; }
  .guide-section .prose p{ font-size:14.5px; }

  .guide-list{
    margin:0 0 18px;
    padding:0;
    list-style:none;
  }
  .guide-list li{
    position:relative;
    padding-left:22px;
    margin-bottom:9px;
    font-size:14.5px;
    color:var(--c-ink-soft);
    line-height:1.85;
  }
  .guide-list li::before{
    content:"";
    position:absolute;
    left:2px; top:0.7em;
    width:5px; height:5px;
    border-radius:50%;
    background:var(--c-fuji);
  }

  /* anchor offset so fixed header doesn't cover jump targets */
  [id]{ scroll-margin-top: 104px; }

  @media (max-width: 1020px){
    .guide-layout{ grid-template-columns:1fr; gap:0; }
    .guide-toc{ display:none; }
    .guide-content{ max-width:none; }
  }


  /* ==================================================================
     FAQ PAGE (/faq/) — accordion list built on <details>/<summary>
     Added for FAQ. Does not modify existing rules above.
  ================================================================== */
  .faq-list{
    max-width:760px;
    margin:0 auto;
    border-top:1px solid var(--c-line);
  }
  .faq-item{
    border-bottom:1px solid var(--c-line);
    background:var(--c-bg);
  }
  .faq-item summary{
    list-style:none;
    cursor:pointer;
    display:flex;
    align-items:baseline;
    gap:18px;
    padding:24px 46px 24px 4px;
    position:relative;
    -webkit-tap-highlight-color:transparent;
  }
  .faq-item summary::-webkit-details-marker{ display:none; }
  .faq-item summary::marker{ content:""; }
  .faq-item summary:focus-visible{ outline:2px solid var(--c-fuji-deep); outline-offset:4px; }

  .faq-q-num{
    font-family:var(--font-en);
    font-size:14px;
    letter-spacing:0.06em;
    color:var(--c-fuji-deep);
    flex:none;
  }
  .faq-q-text{
    font-family:var(--font-serif);
    font-size:15.5px;
    letter-spacing:0.02em;
    color:var(--c-indigo-deep);
    line-height:1.7;
  }

  /* plus / cross indicator, rotates to an "x" when open */
  .faq-item summary::after{
    content:"+";
    position:absolute;
    right:6px; top:24px;
    font-family:var(--font-en);
    font-size:20px;
    line-height:1;
    color:var(--c-fuji-deep);
    transition:transform .3s ease;
    transform-origin:center;
  }
  .faq-item[open] summary::after{ transform:rotate(45deg); }

  .faq-item[open]{ background:var(--c-bg-soft); }

  .faq-answer{
    padding:2px 46px 30px 30px;
    margin-left:4px;
    border-left:2px solid var(--c-fuji-pale);
  }
  .faq-answer p{
    font-size:14.5px;
    color:var(--c-ink-soft);
    line-height:1.9;
    margin:0 0 14px;
  }
  .faq-answer p:last-child{ margin-bottom:0; }
  .faq-answer .notice{ margin:16px 0; }
  .faq-answer .guide-list{ margin:12px 0 12px; }

  .faq-link a{
    display:inline-block;
    font-size:13px;
    letter-spacing:0.03em;
    color:var(--c-fuji-deep);
    border-bottom:1px solid var(--c-fuji-pale);
    padding-bottom:2px;
  }
  .faq-link a:hover{ border-color:var(--c-fuji-deep); }

  @media (prefers-reduced-motion: reduce){
    .faq-item summary::after{ transition:none; }
  }

  /* quiet fade for newly revealed answer content (progressive enhancement;
     details/summary works with zero JS regardless of this animation) */
  @keyframes faqAnswerIn{
    from{ opacity:0; transform:translateY(-6px); }
    to{ opacity:1; transform:translateY(0); }
  }
  .faq-item[open] > .faq-answer{ animation:faqAnswerIn .35s ease; }
  @media (prefers-reduced-motion: reduce){
    .faq-item[open] > .faq-answer{ animation:none; }
  }

  @media (max-width:600px){
    .faq-item summary{ padding:20px 40px 20px 2px; gap:12px; }
    .faq-answer{ padding:2px 20px 24px 22px; }
  }


  /* ==================================================================
     CONTACT PAGE (/contact/) — official X / email cards
     Added for CONTACT. Does not modify existing rules above.
  ================================================================== */
  .contact-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:22px;
    max-width:900px;
    margin:0 auto;
  }
  .contact-card{
    border:1px solid var(--c-line);
    background:var(--c-bg);
    padding:40px 36px;
    display:flex;
    flex-direction:column;
    gap:12px;
    transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease;
  }
  .contact-card:hover{
    transform:translateY(-4px);
    border-color:var(--c-fuji);
    box-shadow:0 24px 44px -32px rgba(43,48,104,0.28);
  }
  .contact-mark{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:38px; height:38px;
    border:1px solid var(--c-line-gold);
    border-radius:50%;
    font-family:var(--font-en);
    font-size:15px;
    color:var(--c-fuji-deep);
    margin-bottom:4px;
  }
  .contact-label{
    font-family:var(--font-en);
    font-size:12.5px;
    letter-spacing:0.2em;
    color:var(--c-fuji-deep);
  }
  .contact-value{
    font-family:var(--font-serif);
    font-size:1.35rem;
    letter-spacing:0.02em;
    color:var(--c-indigo-deep);
    word-break:break-all;
  }
  .contact-desc{
    font-size:13.5px;
    color:var(--c-ink-soft);
    margin:0;
  }
  .contact-action{
    margin-top:auto;
    padding-top:10px;
    font-size:13px;
    letter-spacing:0.04em;
    color:var(--c-fuji-deep);
    display:inline-flex;
    align-items:center;
    gap:6px;
  }
  .contact-card:hover .contact-action{ color:var(--c-indigo-deep); }

  .email-row{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:10px;
  }
  .copy-btn{
    font-family:var(--font-sans);
    font-size:12px;
    letter-spacing:0.04em;
    border:1px solid var(--c-line);
    background:transparent;
    color:var(--c-ink-soft);
    padding:6px 14px;
    cursor:pointer;
    transition:border-color .3s ease, color .3s ease;
  }
  .copy-btn:hover{ border-color:var(--c-fuji); color:var(--c-fuji-deep); }
  .copy-btn:focus-visible{ outline:2px solid var(--c-fuji-deep); outline-offset:2px; }
  .copy-feedback{
    font-size:12px;
    color:var(--c-fuji-deep);
    opacity:0;
    transition:opacity .3s ease;
  }
  .copy-feedback.show{ opacity:1; }

  @media (max-width:760px){
    .contact-grid{ grid-template-columns:1fr; }
  }