.brand-logo{
  display:block;
  width:46px;
  height:46px;
  object-fit:cover;
  border-radius:50%;
  filter:invert(1) grayscale(1) contrast(1.2);
  mix-blend-mode:screen;
}

.site-header{
  position:fixed;
  transition:top .35s ease,height .35s ease,background .35s ease,box-shadow .35s ease,border-color .35s ease;
}

.site-header.is-scrolled{
  top:10px;
  height:64px;
  background:rgba(6,14,21,.72);
  border-color:rgba(126,215,222,.24);
  box-shadow:0 14px 45px rgba(0,0,0,.32);
}

.footer-brand .brand-logo{
  width:54px;
  height:54px;
}

.menu-toggle{
  display:none;
}

.mobile-nav{
  display:none;
}

@media(max-width:900px){
  .site-header{
    padding-inline:15px;
  }

  .site-header.is-scrolled{
    top:8px;
    height:58px;
  }

  .brand-logo{
    width:42px;
    height:42px;
  }

  .search-open{
    margin-left:auto;
  }

  .menu-toggle{
    position:relative;
    z-index:23;
    display:grid;
    place-content:center;
    gap:5px;
    width:46px;
    height:46px;
    margin-left:4px;
    padding:0;
    border:1px solid rgba(167,236,241,.22);
    border-radius:50%;
    background:rgba(8,18,25,.3);
    color:#e8fbff;
    cursor:pointer;
    backdrop-filter:blur(12px);
    transition:background .35s ease,border-color .35s ease,transform .35s ease;
  }

  .menu-toggle:hover{
    border-color:rgba(167,236,241,.62);
    background:rgba(29,92,101,.32);
    transform:rotate(8deg);
  }

  .menu-toggle span{
    display:block;
    width:20px;
    height:1px;
    border-radius:9px;
    background:currentColor;
    box-shadow:0 0 7px rgba(107,233,241,.55);
    transform-origin:center;
    transition:transform .42s cubic-bezier(.2,.8,.2,1),opacity .25s ease,width .3s ease;
  }

  body.menu-open{
    overflow:hidden;
  }

  body.menu-open .menu-toggle{
    background:rgba(33,116,125,.28);
    border-color:rgba(184,246,250,.65);
    transform:rotate(90deg);
  }

  body.menu-open .menu-toggle span:nth-child(1){transform:translateY(6px) rotate(45deg)}
  body.menu-open .menu-toggle span:nth-child(2){opacity:0;width:0}
  body.menu-open .menu-toggle span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

  .mobile-nav{
    position:fixed;
    inset:0;
    z-index:19;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:0;
    padding:120px 24px 60px;
    background:linear-gradient(145deg,rgba(2,8,14,.84),rgba(9,25,32,.75));
    backdrop-filter:blur(26px) saturate(135%);
    -webkit-backdrop-filter:blur(26px) saturate(135%);
    opacity:0;
    visibility:hidden;
    transform:scale(1.04);
    transition:opacity .38s ease,visibility .38s ease,transform .48s cubic-bezier(.2,.8,.2,1);
  }

  .mobile-nav::before{
    content:"MENU";
    margin-bottom:24px;
    font-size:9px;
    letter-spacing:.5em;
    color:#72dce5;
  }

  .mobile-nav::after{
    content:"";
    position:absolute;
    inset:8%;
    border:1px solid rgba(130,226,233,.1);
    border-radius:32px;
    pointer-events:none;
  }

  .mobile-nav a{
    width:min(420px,82vw);
    padding:20px 12px;
    border-bottom:1px solid rgba(182,231,234,.13);
    color:#eefbfc;
    font-family:var(--serif);
    font-size:clamp(20px,6vw,30px);
    letter-spacing:.08em;
    text-align:center;
    opacity:0;
    transform:translateY(18px);
    transition:opacity .35s ease,transform .45s cubic-bezier(.2,.8,.2,1),color .25s ease;
  }

  .mobile-nav a:hover{color:#80e8ef}

  body.menu-open .mobile-nav{
    opacity:1;
    visibility:visible;
    transform:scale(1);
  }

  body.menu-open .mobile-nav a{
    opacity:1;
    transform:translateY(0);
  }

  body.menu-open .mobile-nav a:nth-child(1){transition-delay:.08s}
  body.menu-open .mobile-nav a:nth-child(2){transition-delay:.14s}
  body.menu-open .mobile-nav a:nth-child(3){transition-delay:.2s}
  body.menu-open .mobile-nav a:nth-child(4){transition-delay:.26s}
}

@media(prefers-reduced-motion:reduce){
  .menu-toggle,.menu-toggle span,.mobile-nav,.mobile-nav a{transition:none!important}
}
/* ===== ハンバーガー：線なしのスタイリッシュ版（2026-11-08） ===== */
@media (max-width: 900px){
  body .mobile-nav{counter-reset:mnav;gap:2px;padding:110px 24px 56px;justify-content:center}
  body .mobile-nav::after{display:none}
  body .mobile-nav::before{margin-bottom:28px;font-size:10px;letter-spacing:.6em;color:#72dce5;opacity:.85}
  body .mobile-nav a{counter-increment:mnav;position:relative;display:flex;align-items:baseline;justify-content:center;gap:14px;width:auto;padding:11px 18px;border:0;font-size:clamp(19px,5.4vw,26px);letter-spacing:.1em;border-radius:999px;transition:color .25s,background .25s}
  body .mobile-nav a::before{content:counter(mnav,decimal-leading-zero);font-family:"Noto Sans JP",sans-serif;font-size:10px;letter-spacing:.2em;color:#72dce5;opacity:.7;transform:translateY(-2px)}
  body .mobile-nav a:hover,body .mobile-nav a:focus-visible{color:#80e8ef;background:rgba(114,220,229,.08)}
  body .mobile-nav a[aria-current="page"]{color:#80e8ef}
}