/* ===== header / nav ===== */
.wrap{max-width:1440px;margin:0 auto;padding:0 80px}
.site-header{
    position:absolute;top:0;left:0;right:0;z-index:100;
    height:var(--header-h);
    display:flex;align-items:center;
    background:rgba(255,255,255,.5);
    backdrop-filter:blur(6px);
  }
.site-header .wrap{
    width:100%;
    display:flex;align-items:center;justify-content:space-between;
    padding-left:40px;
  }
.logo{position:relative;display:block;width:200px;height:32px;overflow:hidden}
.logo img{
    position:absolute;left:0;top:-250.52%;
    width:100%;height:614.53%;
    max-width:none;object-fit:cover;
  }
.header-right{display:flex;align-items:center;gap:24px}
.nav-menu{display:flex;align-items:center;gap:8px}
.nav-menu a{
    display:block;padding:10px;
    font-size:16px;font-weight:500;color:var(--ink);
    transition:opacity .2s ease;
  }
.nav-menu a:hover{opacity:.6}
.btn-outline{
    display:inline-flex;align-items:center;gap:8px;
    height:40px;padding:10px 24px;
    background:#fff;
    border:1px solid var(--line-blue);
    border-radius:32px;
    white-space:nowrap;
    transition:background .2s ease;   /* FAQのお問い合わせボタン(.btn-contact)と同じホバー */
  }
.btn-outline:hover{background:var(--sub)}
.btn-outline span{
    font-size:16px;font-weight:500;
    background:linear-gradient(180deg, var(--line-blue) 0%, var(--line-blue-2) 100%);
    -webkit-background-clip:text;background-clip:text;color:transparent;
  }
.btn-outline i{
    font-size:14px;
    background:linear-gradient(180deg, var(--line-blue) 0%, var(--line-blue-2) 100%);
    -webkit-background-clip:text;background-clip:text;color:transparent;
  }
.nav-toggle{display:none;font-size:24px;color:var(--ink)}
/* ===== SPメニュー（ハンバーガー展開・Figma SP準拠） ===== */
.nav-overlay{
    display:none;position:fixed;top:0;left:0;right:0;z-index:200;
    height:480px;                 /* Figma SP_menu(889:10777): 全画面でなく高さ480pxのパネル */
    background:var(--sub);
    flex-direction:column;
    overflow-y:auto;
  }
.nav-overlay.open{display:flex}
.nav-overlay-head{
    height:var(--header-h);flex-shrink:0;
    display:flex;align-items:center;justify-content:space-between;
    padding:0 20px;
    background:rgba(255,255,255,.5);backdrop-filter:blur(6px);
  }
.nav-overlay-head .logo{width:144px;height:24px}
.nav-close{
    width:24px;height:24px;display:flex;align-items:center;justify-content:center;
    font-size:22px;color:var(--blue);
  }
.nav-overlay-body{
    position:relative;flex:1 1 auto;
    display:flex;flex-direction:column;gap:40px;
    padding:40px 20px;overflow:hidden;
  }
.nav-watermark{
    position:absolute;right:-120px;top:170px;width:300px;height:auto;
    opacity:.1;transform:rotate(90deg);transform-origin:center;
    pointer-events:none;user-select:none;
  }
.nav-links{position:relative;z-index:1;display:flex;flex-direction:column;gap:24px;align-items:flex-start}
.nav-links a{font-size:16px;font-weight:500;color:var(--ink);transition:opacity .2s ease}
.nav-links a:hover{opacity:.6}
.nav-cta{position:relative;z-index:1;display:flex;gap:16px;align-items:flex-end;flex-wrap:wrap}
.nav-cta-primary{display:flex;flex-direction:column;align-items:center;gap:2px}
.nav-cta .cta-badge{font-size:14px;font-weight:400;padding:0 22px}
.btn-orange{
    display:flex;align-items:center;justify-content:center;gap:8px;
    width:162px;height:38px;border-radius:32px;
    background:linear-gradient(138deg, var(--orange-1) 0%, var(--orange-2) 100%);
    color:#fff;font-size:16px;font-weight:500;white-space:nowrap;
    box-shadow:0 8px 10px rgba(108,48,5,.08);transition:transform .2s ease;
  }
.btn-orange:hover{transform:translateY(-2px)}
.nav-cta .btn-outline{margin:0;height:40px;padding:10px 16px}  /* 375px幅でも横並びが収まるよう詰める */
.nav-sns{position:relative;z-index:1;display:flex;align-items:center;gap:16px}
.nav-sns a{color:var(--gray);font-size:30px;line-height:1;transition:color .2s ease}
.nav-sns a:hover{color:var(--ink)}
@media (max-width:1180px){
.wrap{padding:0 32px}
.site-header .wrap{padding-left:0}
.header-right{gap:12px}
.nav-menu{gap:0}
}
@media (max-width:900px){
.nav-menu,.header-right .btn-outline{display:none}
.nav-toggle{display:block}
}
@media (max-width:480px){
.wrap{padding:0 16px}
.logo{width:160px;height:26px}
}
