/* Formy Design 2026 – 共通（ヘッダー・フッター・CTA・ボタン） */
:root{
  --fy-navy:#10132e; --fy-navy2:#1a1f45; --fy-ink:#1c2045; --fy-text:#3a3f63; --fy-mute:#6a6f8f; --fy-line:#e3e6ef; --fy-bg:#f4f6fb;
  --fy-blue:#5b8cff; --fy-violet:#7c5bff; --fy-grad:linear-gradient(120deg,#4f7dff,#7c5bff); --fy-yellow:#ffd43b;
  --fy-jp:"Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic UI","Yu Gothic","Meiryo",sans-serif;
  --fy-disp:"Noto Sans JP",var(--fy-jp); --fy-en:"Archivo","Arial Black",sans-serif;
  --fy-wrap:1180px; --fy-gut:clamp(20px,4vw,40px);
}
.fy-hd,.fy-hd *,.fy-ft,.fy-ft *,.fy-cta,.fy-cta *{box-sizing:border-box}
.fy-wrap{max-width:var(--fy-wrap);margin:0 auto;padding:0 var(--fy-gut);width:100%}

/* ボタン */
.fy-btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;font-family:var(--fy-jp);font-weight:800;text-decoration:none !important;border-radius:999px;border:0;transition:transform .2s,box-shadow .2s,filter .2s;letter-spacing:.04em;line-height:1.2;cursor:pointer}
.fy-btn-sm{background:var(--fy-grad);color:#fff !important;font-size:13px;padding:10px 20px}
.fy-btn-sm:hover{filter:brightness(1.08);color:#fff !important}
.fy-btn-main{background:var(--fy-grad);color:#fff !important;font-size:17px;padding:18px 36px;box-shadow:0 14px 30px -12px rgba(92,90,255,.8)}
.fy-btn-main:hover{transform:translateY(-2px);filter:brightness(1.07)}
.fy-btn-white{background:#fff;color:var(--fy-violet) !important;box-shadow:0 16px 30px -14px rgba(0,0,0,.45)}
.fy-ar{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:rgba(124,91,255,.14);font-size:13px}

/* ヘッダー */
.fy-hd{position:sticky;top:0;z-index:9990;background:#fff;box-shadow:0 1px 0 var(--fy-line);font-family:var(--fy-jp);margin:0}
.admin-bar .fy-hd{top:32px}
@media (max-width:782px){.admin-bar .fy-hd{top:46px}}
@media (max-width:600px){.admin-bar .fy-hd{top:0}}
.fy-hd .fy-wrap{display:flex;align-items:center;height:68px;position:relative}
.fy-brand{display:flex;align-items:center;gap:10px;font-family:var(--fy-en);font-weight:800;font-size:22px;line-height:1;color:var(--fy-ink) !important;text-decoration:none !important;letter-spacing:0}
.fy-brand img{width:32px;height:32px;border-radius:9px;margin:0;display:block}
.fy-hd .fy-btn-sm{margin-left:24px}
.fy-nav{margin-left:auto;display:flex;gap:4px}
.fy-nav a{font-size:14px;font-weight:600;color:var(--fy-ink) !important;text-decoration:none !important;padding:8px 14px;border-radius:8px;line-height:1.4}
.fy-nav a:hover,.fy-nav a[aria-current="page"]{background:var(--fy-bg)}
.fy-nav a[aria-current="page"]{color:var(--fy-violet) !important}
.fy-menu{display:none;margin-left:auto;border:1px solid var(--fy-line);background:#fff;border-radius:8px;font:inherit;font-family:var(--fy-jp);font-size:13px;font-weight:700;padding:7px 12px;color:var(--fy-ink);cursor:pointer;line-height:1.4}
@media (max-width:980px){
  .fy-nav{display:none}
  .fy-menu{display:block}
  .fy-nav.is-open{display:flex;position:absolute;top:68px;left:0;right:0;flex-direction:column;background:#fff;padding:8px var(--fy-gut) 16px;box-shadow:0 10px 20px -12px rgba(0,0,0,.25)}
}
@media (max-width:560px){
  .fy-hd .fy-btn-sm{margin-left:12px;padding:9px 14px}
  .fy-brand{font-size:19px}
}

/* CTA */
.fy-cta{position:relative;color:#fff;text-align:center;overflow:hidden;padding:clamp(72px,9vw,120px) 0;margin:0;font-family:var(--fy-jp)}
.fy-cta>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;max-width:none;margin:0}
.fy-cta::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,rgba(55,70,220,.92),rgba(110,80,240,.86))}
.fy-cta .fy-wrap{position:relative;z-index:1}
.fy-cta-title{font-family:var(--fy-disp);font-weight:900;font-size:clamp(30px,4.4vw,56px);line-height:1.3;margin:0;color:#fff}
.fy-cta-text{margin:16px auto 32px;color:#eceeff;font-size:16px;line-height:1.9;max-width:34em}

/* フッター */
.fy-ft{background:var(--fy-navy);color:#a9aed8;font-size:13px;padding:40px 0 48px;font-family:var(--fy-jp);margin:0}
.fy-ft .fy-wrap{display:flex;flex-wrap:wrap;gap:16px 32px;align-items:center;justify-content:space-between}
.fy-ft .fy-brand{color:#fff !important}
.fy-ft nav{display:flex;flex-wrap:wrap;gap:6px 22px}
.fy-ft a{color:#a9aed8 !important;text-decoration:none !important}
.fy-ft a:hover{color:#fff !important}
.fy-ft .fy-brand:hover{color:#fff !important}

@media (prefers-reduced-motion:reduce){.fy-btn{transition:none}}