
  :root{
    --paper:#E7E7E5; --surface:#F0F0EE; --ink:#111111;
    --sub:#8C8C88; --mustard:#D8AA48; --hair:#CFCFCB;
    /* 骨格：端末の Helvetica Neue を優先、無ければ Inter を配信 */
    --mono:"Helvetica Neue",Helvetica,Inter,Arial,sans-serif;
    /* 遊び：ATTENTIONテープ・検印スタンプ・シャッター内の文字 */
    --play:Archivo,"Helvetica Neue",Helvetica,Arial,sans-serif;
    /* 手書き（TOPのみ） */
    --hand:"Yusei Magic","Zen Kaku Gothic New",sans-serif;
    /* 和文 */
    --jp:"Zen Kaku Gothic New","Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic","Noto Sans JP",sans-serif;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{font-family:var(--jp);font-weight:400;background:var(--paper);color:var(--ink);line-height:1.9;-webkit-font-smoothing:antialiased;overflow-x:hidden}
  a{color:inherit;text-decoration:none}
  img{display:block;max-width:100%}
  ::selection{background:var(--mustard);color:var(--ink)}
  :focus-visible{outline:3px solid var(--mustard);outline-offset:2px}

  /* language switching */
  html[data-lang="ja"] [lang="en"]{display:none}
  html[data-lang="en"] [lang="ja"]{display:none}

  .eyebrow{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.14em;color:var(--sub);text-transform:uppercase}
  .eyebrow b{color:var(--ink);font-weight:600}

  /* ATTENTION TAPE */
  .tape{background:var(--mustard);color:var(--ink);border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);padding:10px 24px;position:relative;z-index:5}
  .tape.dark{background:var(--ink);color:var(--paper);border-color:var(--mustard)}
  .tape-track{display:flex;flex-wrap:wrap;justify-content:center;gap:5px 44px}
  .tape-track span{font-family:var(--play);font-weight:600;font-size:11.5px;letter-spacing:.14em;white-space:nowrap;text-transform:uppercase}
  @media(max-width:600px){.tape.dark .tape-track{display:grid;grid-template-columns:1fr 1fr;gap:9px 22px;justify-items:center}}

  /* HEADER */
  header{position:sticky;top:0;z-index:100;background:var(--paper);display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 30px;border-bottom:2px solid var(--ink)}
  .lockup{display:flex;align-items:center;gap:12px;flex-shrink:0}
  .lockup .sym{width:34px}
  .lockup .wm{height:17px}
  nav.main{display:flex;gap:22px}
  nav.main a{font-family:var(--mono);font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;position:relative;white-space:nowrap}
  nav.main a::after{content:"";position:absolute;left:0;bottom:-4px;width:0;height:2px;background:var(--mustard);transition:width .25s}
  nav.main a:hover::after{width:100%}
  .head-right{display:flex;align-items:center;gap:10px}

  /* LANG TOGGLE */
  .lang-toggle{display:flex;border:2px solid var(--ink);font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.1em}
  .lang-toggle button{
    background:none;border:none;font:inherit;color:var(--ink);
    padding:5px 11px;cursor:pointer;transition:.18s;
  }
  .lang-toggle button+button{border-left:2px solid var(--ink)}
  .lang-toggle button[aria-pressed="true"]{background:var(--ink);color:var(--mustard)}
  .contact-btn{font-family:var(--mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;border:2px solid var(--ink);padding:6px 14px;transition:.2s;white-space:nowrap}
  .contact-btn:hover{background:var(--ink);color:var(--paper)}
  @media(max-width:1000px){nav.main{display:none}header{padding:11px 18px}}
  @media(max-width:400px){.lockup .wm{display:none}.contact-btn{padding:6px 10px;font-size:11px}.lang-toggle button{padding:5px 8px}header{gap:10px}}

  /* HERO */
  .hero{padding:78px 30px 54px;position:relative;overflow:hidden}
  .hero-sym{position:absolute;right:-4vw;top:-6vh;width:min(46vw,560px);opacity:.09;pointer-events:none;user-select:none}
  .band-sym{width:76px;margin:0 auto 36px}
  .hero-mark{max-width:min(860px,88vw);width:100%}
  .hero-foot{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:28px;margin-top:44px;position:relative}
  .tagline{font-family:var(--mono);font-size:clamp(24px,3.6vw,44px);font-weight:800;letter-spacing:-.035em;line-height:1.05}
  .tagline .accent{color:var(--mustard)}
  .tagline .sub{display:block;font-family:var(--jp);font-size:.4em;font-weight:700;margin-top:14px;letter-spacing:-.02em;line-height:1.35}
  /* --- 手書きメッセージ：TOPだけの主役 --- */
  /* ※ Yusei Magic は仮実装。最終的には .hw-line のテキストを
     オリジナル手書きの <svg class="hw-art"> に入れ替える。
     clip-path の書き進み・下線・「場所」を囲む丸はそのまま使える。
     差し替え時に行高が変わらないよう --hw-h で行ボックスを固定してある。 */
  .hero-hand{margin-top:30px;max-width:600px;--hw-h:clamp(38px,5.2vw,58px)}
  .hw-line{display:block;position:relative;width:fit-content;font-family:var(--hand);
    font-size:clamp(21px,2.9vw,32px);line-height:var(--hw-h);color:var(--ink);
    clip-path:inset(0 100% 0 0);transition:clip-path 1.05s cubic-bezier(.4,0,.2,1)}
  /* 差し替え後のオリジナル手書き SVG 用（現状未使用） */
  .hw-line>svg.hw-art{position:static;display:block;height:var(--hw-h);width:auto;overflow:visible}
  .hw-line>svg.hw-art path{fill:var(--ink);stroke:none}
  .hero-hand.on .hw-line{clip-path:inset(0 0 0 0)}
  .hero-hand.on .hw-line.l2{transition-delay:.62s}
  .hw-line>svg:not(.hw-art){position:absolute;left:0;bottom:-10px;width:100%;height:14px;overflow:visible}
  .hw-line>svg:not(.hw-art) path{fill:none;stroke:var(--mustard);stroke-width:4.5;stroke-linecap:round;
    stroke-dasharray:340;stroke-dashoffset:340;transition:stroke-dashoffset .9s ease 1.55s}
  .hero-hand.on .hw-line>svg:not(.hw-art) path{stroke-dashoffset:0}
  .hw-circ{position:relative;display:inline-block}
  .hw-circ>svg{position:absolute;left:-10px;top:-6px;width:calc(100% + 20px);height:calc(100% + 12px);overflow:visible}
  .hw-circ>svg ellipse{fill:none;stroke:var(--mustard);stroke-width:3.2;stroke-linecap:round;
    stroke-dasharray:320;stroke-dashoffset:320;transition:stroke-dashoffset 1s ease 1.95s}
  .hero-hand.on .hw-circ>svg ellipse{stroke-dashoffset:0}
  .hero-lead{max-width:470px;font-size:15px;font-weight:400;line-height:1.95;opacity:.76;margin-top:38px}

  /* STICKER */
  .sticker{position:absolute;right:max(4vw, calc((100% - 1160px) / 2 + 8px));bottom:8px;width:clamp(126px,15vw,178px);height:clamp(126px,15vw,178px);border-radius:50%;background:var(--ink);border:3px solid var(--ink);display:grid;place-items:center;transform:rotate(-12deg);box-shadow:5px 6px 0 var(--mustard);transition:transform .3s ease}
  .sticker img{width:62%}
  .sticker:hover{transform:rotate(4deg) scale(1.05)}
  @media(max-width:820px){.sticker{position:static;margin-top:26px;transform:rotate(-6deg)}}

  /* SECTIONS */
  section{padding:96px 30px}
  .sec-head{display:flex;gap:14px;align-items:baseline;border-top:2px solid var(--ink);padding-top:18px;margin-bottom:48px;flex-wrap:wrap}
  .sec-head .idx{font-family:var(--mono);font-weight:600;font-size:12px;color:var(--mustard);letter-spacing:.14em}
  .lede{max-width:900px}
  .lede h2{font-size:clamp(28px,4.6vw,58px);font-weight:700;line-height:1.35;letter-spacing:-.02em}
  .lede h2[lang="en"]{font-family:var(--mono);font-weight:800;letter-spacing:-.035em;line-height:1.05}
  .lede h2 .hl{background:linear-gradient(transparent 62%, var(--mustard) 62%)}
  .lede p{margin-top:24px;font-size:16px;font-weight:400;opacity:.8;line-height:1.9;max-width:660px}

  /* CELEBRATE LIST */
  /* --- ABOUT 本文：社名から始まる短いエッセイ --- */
  .msgs{margin-top:60px}
  .essay{max-width:640px}
  .essay p{font-size:clamp(17px,2.05vw,22px);font-weight:500;line-height:2.05;
    letter-spacing:.005em;margin-top:34px}
  .essay p:first-child{margin-top:0}
  .essay .fof{font-family:var(--mono);font-weight:800;font-style:normal;letter-spacing:.01em}
  .essay .triad{padding-left:20px;border-left:2px solid var(--mustard);font-weight:600}
  /* --- 「実験カンパニー」は本文内で自然に——少しだけ太く、マスタードの細い下線 --- */
  .essay.xbody{margin-top:44px}
  .essay .exp{font-weight:700;background:linear-gradient(transparent 82%,var(--mustard) 82%,var(--mustard) 92%,transparent 92%)}
  /* --- HOW IDEAS MOVE : 線とタイポだけのプロセスグラフィック --- */
  .flow{margin-top:78px;border-top:2px solid var(--ink);padding-top:18px}
  .flow .cap{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.14em;
    text-transform:uppercase;color:var(--sub)}
  .flow-track{position:relative;margin-top:52px}
  .rail{position:absolute;left:0;right:0;top:0;height:2px;background:var(--hair)}
  .rail .fill{display:block;height:100%;width:0;background:var(--mustard);
    transition:width 2.2s cubic-bezier(.35,0,.15,1) .15s}
  .flow.on .rail .fill{width:100%}
  .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:0 26px;padding-top:34px}
  .step{position:relative;opacity:0;transform:translateY(12px);
    transition:opacity .6s ease,transform .6s cubic-bezier(.2,1,.3,1)}
  .flow.on .step{opacity:1;transform:none}
  .flow.on .step:nth-child(2){transition-delay:.6s}
  .flow.on .step:nth-child(3){transition-delay:1.2s}
  .step .dot{position:absolute;left:0;top:-42px;width:12px;height:12px;border-radius:50%;
    background:var(--paper);border:3px solid var(--ink);transition:background .35s ease}
  .flow.on .step .dot{background:var(--mustard)}
  .flow.on .step:nth-child(2) .dot{transition-delay:.6s}
  .flow.on .step:nth-child(3) .dot{transition-delay:1.2s}
  .step .en{font-family:var(--mono);font-weight:800;font-size:clamp(32px,5.4vw,64px);
    letter-spacing:-.035em;line-height:1;text-transform:uppercase;display:inline-block}
  .step.last .en{background:linear-gradient(transparent 62%,var(--mustard) 62%)}
  .step .jp{font-size:13px;font-weight:500;opacity:.72;margin-top:14px;letter-spacing:.02em}
  @media(max-width:700px){
    .flow-track{padding-left:30px}
    .rail{left:5px;right:auto;top:0;bottom:0;width:2px;height:auto}
    .rail .fill{width:100%;height:0;transition:height 2.2s cubic-bezier(.35,0,.15,1) .15s}
    .flow.on .rail .fill{width:100%;height:100%}
    .steps{grid-template-columns:1fr;gap:40px;padding-top:6px}
    .step .dot{left:-30px;top:11px}
  }

  .celebrate{margin-top:90px;border-top:2px solid var(--ink)}
  .bridge{max-width:660px;margin:76px 0 30px;font-size:16px;font-weight:600;opacity:.72;line-height:1.9}
  .celebrate .cap{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--sub);text-transform:uppercase;padding:14px 0 6px}
  .cel-row{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center;padding:20px 4px;border-bottom:1px solid var(--hair)}

  /* --- STAMP 検印（月面ブーツの足跡） --- */
  .stamp{--ang:-9deg;margin-left:auto;flex-shrink:0;align-self:center;
    display:inline-flex;flex-direction:column;align-items:center;gap:6px;color:var(--mustard);
    transform:rotate(var(--ang))}
  .stamp .foot{width:30px;height:45px;display:block;fill:var(--mustard)}
  .stamp .foot .tread rect{fill:var(--paper)}
  .stamp.rf .foot{transform:scaleX(-1)}          /* 右足：左右反転 */
  .stamp.lf{--ang:-10deg}
  .stamp.rf{--ang:8deg}
  .stamp em{font-family:var(--play);font-weight:600;font-size:11px;letter-spacing:.16em;
    text-transform:uppercase;font-style:normal;line-height:1;color:var(--mustard)}
  /* armed = JS is alive, so it is safe to hide them until they are stamped */
  .stamp.armed{opacity:0;transform:scale(2.6) rotate(-16deg)}
  .stamp.armed.on{animation:thunk .34s cubic-bezier(.2,1.5,.35,1) forwards}
  @keyframes thunk{
    0%{opacity:0;transform:scale(2.6) rotate(-16deg)}
    60%{opacity:1;transform:scale(.94) rotate(calc(var(--ang) + 3deg))}
    100%{opacity:1;transform:scale(1) rotate(var(--ang))}}
  @media(max-width:640px){.stamp .foot{width:24px;height:36px}.stamp em{font-size:9.5px;letter-spacing:.12em}}
  .cel-row .n{font-family:var(--mono);font-size:12px;font-weight:700;color:var(--mustard);letter-spacing:.1em;flex-shrink:0}
  .cel-row .t{flex:1;min-width:min(100%,240px);font-size:clamp(17px,2.2vw,24px);font-weight:700;letter-spacing:-.02em}

  /* STEPS */

  /* VALUE BADGES */

  /* BUSINESS */
  .biz-grid{display:grid;grid-template-columns:repeat(3,1fr);border:2px solid var(--ink);border-top:none;background:var(--surface)}

  /* --- SHUTTER シャッター --- */
  .biz{position:relative;overflow:hidden}
  .door{position:absolute;inset:0;z-index:3;pointer-events:none;
    background:var(--ink);
    background-image:repeating-linear-gradient(to bottom,#1F1C18 0 8px,#0A0908 8px 10px,#141210 10px 11px);
    border-bottom:5px solid var(--mustard);
    transform:translateY(0);                 /* CLOSED by default */
    transition:transform .95s cubic-bezier(.7,0,.2,1);will-change:transform}
  .door{display:flex;flex-direction:column;justify-content:center;align-items:center;
    text-align:center;gap:7px;padding:22px}
  .door .de{font-family:var(--play);font-weight:700;font-size:12.5px;letter-spacing:.18em;color:var(--mustard)}
  .door .dj{font-size:13px;font-weight:700;color:#D2CEC5}
  .door .dh{position:absolute;left:0;right:0;bottom:13px;font-family:var(--play);
    font-size:9px;font-weight:600;letter-spacing:.22em;color:#514D46}
  .biz:hover .door,
  .biz:focus-within .door,
  .biz.open .door{transform:translateY(-101%)}
  @media(max-width:900px){.biz-grid{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:600px){.biz-grid{grid-template-columns:1fr}}
  .biz{padding:30px 24px;min-height:280px;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);display:flex;flex-direction:column;justify-content:space-between;transition:.25s}
  .biz .en-l{font-family:var(--mono);font-weight:600;font-size:11px;letter-spacing:.14em;color:var(--mustard);margin-bottom:7px}
  .biz h3{font-size:20px;font-weight:700;letter-spacing:-.02em;line-height:1.4}
  .biz .role{font-size:12px;font-weight:700;opacity:.6;margin-top:6px}
  .biz p{display:none}
  .biz .pict{margin-bottom:auto;color:var(--sub);line-height:0}
  .biz .pict svg{width:38px;height:38px;stroke:currentColor;stroke-width:1.6;fill:none;
    stroke-linecap:square;stroke-linejoin:miter}
  .biz:hover{background:var(--ink);color:var(--paper)}
  .biz:hover .pict{color:var(--mustard)}
  /* --- AI は6つめの事業ではなく、5事業すべてに掛かる演算子 --- */
  .eqbar{border:2px solid var(--ink);background:var(--surface);padding:28px 26px}
  .eqbar .terms{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;
    font-family:var(--mono);font-weight:600;font-size:clamp(12px,1.7vw,16px);
    letter-spacing:.14em;text-transform:uppercase}
  .eqbar .terms i{font-style:normal;opacity:.4}
  .eqbar .terms .ai{background:var(--mustard);padding:3px 12px;letter-spacing:.18em}
  .eqbar .say{display:none}
  .eqbar .say .hl{background:linear-gradient(transparent 62%,var(--mustard) 62%)}

  /* --- 6番目のマス：奥付。動きなし、地は他のマスと同じ --- */
  .biz.colo,.biz.colo:hover{background:var(--surface);color:var(--ink)}
  .biz.colo{align-items:center;justify-content:center;text-align:center;gap:20px}
  .biz.colo .tag{font-family:var(--mono);font-weight:700;font-size:10px;letter-spacing:.2em;
    text-transform:uppercase;color:var(--sub)}
  .biz.colo .cl{font-size:12.5px;font-weight:500;color:var(--ink);line-height:1.7}
  .biz.colo .cl small{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;
    text-transform:uppercase;color:var(--sub);margin-top:6px;font-weight:700}
  .mk{width:78px;margin:0}
  .mk img{width:100%;height:auto}

  /* BAND */
  .band{background:var(--ink);color:var(--paper);text-align:center;padding:132px 30px}
  .band .k{font-family:var(--mono);font-weight:600;font-size:12px;letter-spacing:.14em;color:var(--mustard);margin-bottom:16px;text-transform:uppercase}
  .band .m{font-size:clamp(24px,4vw,46px);font-weight:700;letter-spacing:-.02em;line-height:1.35}
  .band .m[lang="en"]{font-family:var(--mono);font-weight:800;letter-spacing:-.035em;line-height:1.1}
  .band .m:not(.jp){font-family:var(--mono);font-weight:800;letter-spacing:-.035em;line-height:1.1}
  .band .m.jp{font-size:clamp(17px,2.2vw,26px);font-weight:700;opacity:.72;margin-top:20px}

  /* NEWS */
  .news-list{border-top:2px solid var(--ink)}
  .news-item{display:grid;grid-template-columns:125px 110px 1fr 26px;gap:18px;align-items:center;padding:22px 6px;border-bottom:1px solid var(--hair);transition:.22s}
  .news-item:hover{padding-left:14px;background:var(--mustard)}
  .news-date{font-family:var(--mono);font-size:13px;color:var(--sub)}
  .news-item:hover .news-date{color:var(--ink)}
  .news-cat{font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;border:2px solid var(--ink);padding:2px 9px;justify-self:start;text-transform:uppercase;font-weight:600}
  .news-title{font-size:15px;font-weight:400}
  .news-arrow{font-family:var(--mono);color:var(--sub)}
  .news-item:hover .news-arrow{color:var(--ink)}
  @media(max-width:720px){.news-item{grid-template-columns:1fr;gap:7px}.news-arrow{display:none}}
  .viewall{display:inline-flex;gap:10px;align-items:center;margin-top:38px;font-family:var(--mono);font-weight:600;font-size:13px;letter-spacing:.1em;text-transform:uppercase}
  .viewall .line{width:38px;height:2px;background:var(--ink);transition:width .3s}
  .viewall:hover .line{width:62px}

  /* COMPANY */
  .company-wrap{position:relative}
  .wm404{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);width:min(78vw,900px);opacity:.05;pointer-events:none;user-select:none}
  .label-card{position:relative;max-width:660px;margin:0 auto;border:3px solid var(--ink);
    background:var(--surface);box-shadow:7px 8px 0 var(--ink)}
  .split{display:none;grid-template-columns:190px 1fr;
    border:3px solid var(--ink);background:var(--surface);max-width:860px;margin:0 auto}
  @media(max-width:780px){.split{grid-template-columns:1fr}}
  .split .mark{background:var(--ink);display:flex;flex-direction:column;justify-content:space-between;
    padding:26px 20px;border-right:3px solid var(--ink)}
  @media(max-width:780px){.split .mark{border-right:none;border-bottom:3px solid var(--ink)}}
  .split .mark img{width:92px;margin:18px 0 auto}
  .split .mark .tag{font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.2em;color:var(--mustard);text-transform:uppercase}
  .split .mark .cl{font-size:12px;font-weight:700;color:#D2CEC5;margin-top:24px;line-height:1.6}
  .split .list{padding:6px 26px}
  .sr{display:grid;grid-template-columns:150px 1fr;gap:16px;padding:13px 0;border-bottom:1px solid var(--hair);font-size:13.5px}
  .sr:last-child{border-bottom:none}
  .sr dt{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.16em;color:var(--sub);text-transform:uppercase;padding-top:3px}
  .sr dd{padding:0;font-weight:500}
  @media(max-width:560px){.sr{grid-template-columns:1fr;gap:2px}}

  .label-head{background:var(--ink);color:var(--paper);padding:11px 20px;display:flex;justify-content:space-between;align-items:center;gap:10px;font-family:var(--mono);font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase}
  .label-head .m{color:var(--mustard)}
  .label-row{display:grid;grid-template-columns:150px 1fr;border-bottom:1px solid var(--hair);font-size:13.5px}
  .label-row:last-child{border-bottom:none}
  .label-row dt{font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.14em;color:var(--sub);padding:12px 16px;border-right:1px solid var(--hair);text-transform:uppercase}
  .label-row dd{padding:12px 16px;font-weight:400}
  .label-foot{border-top:3px solid var(--ink);padding:11px 20px;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;color:var(--sub);display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}
  @media(max-width:560px){.label-row{grid-template-columns:1fr}.label-row dt{border-right:none;border-bottom:1px solid var(--hair);padding-bottom:6px}}

  /* CTA */
  .cta{background:var(--ink);color:var(--paper);text-align:center;padding:0 30px 82px}
  .cta .sec-head{border-top-color:#2A2822;margin-bottom:0;justify-content:center}
  .cta .sec-head .eyebrow{color:#8E8A80}
  .cta .sec-head .eyebrow b{color:var(--paper)}
  .cta .btn{display:inline-flex;align-items:center;gap:10px;margin-top:72px;font-family:var(--mono);font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;background:var(--mustard);color:var(--ink);border:2px solid var(--mustard);padding:14px 28px;box-shadow:4px 5px 0 var(--paper);transition:.22s}
  .cta .btn:hover{transform:translate(3px,3px);box-shadow:2px 3px 0 var(--paper)}
  .outro{background:var(--ink);color:var(--paper);padding:0 30px 104px}
  .outro-rule{height:2px;background:linear-gradient(90deg,var(--mustard) 0 72px,rgba(231,231,229,.16) 72px 100%);margin-bottom:54px}
  .outro-in{display:flex;align-items:center;justify-content:space-between;gap:36px}
  .outro-left{display:flex;align-items:center;gap:28px;min-width:0}
  .outro-sym{height:62px;width:auto;display:block;flex-shrink:0}
  .outro .m{text-align:left}
  .outro-meta{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.14em;color:var(--sub);text-transform:uppercase;text-align:right;line-height:1.95;flex-shrink:0;display:flex;flex-direction:column}
  .outro-meta b{color:var(--paper);font-weight:600}
  @media(max-width:760px){
    .outro-in{flex-direction:column;align-items:flex-start;gap:26px}
    .outro-meta{text-align:left}
  }
  @media(max-width:560px){
    .outro{padding-bottom:80px}
    .outro-rule{background:linear-gradient(90deg,var(--mustard) 0 52px,rgba(231,231,229,.16) 52px 100%);margin-bottom:40px}
    .outro-left{gap:18px}
    .outro-sym{height:52px}
    .cta{padding:0 30px 60px}.cta .btn{margin-top:56px}
  }

  /* FOOTER */
  footer{padding:48px 30px 34px;border-top:2px solid var(--ink)}
  .foot-top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:26px;align-items:center}
  .foot-lock{display:flex;align-items:center;gap:13px}
  .foot-lock .sym{width:44px}
  .foot-lock .wm{height:19px}
  .foot-nav{display:flex;gap:22px;flex-wrap:wrap}
  .foot-nav a{font-family:var(--mono);font-size:12px;letter-spacing:.08em;color:var(--sub);text-transform:uppercase}
  .foot-nav a:hover{color:var(--ink)}
  .foot-bot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-top:40px;font-family:var(--mono);font-size:11px;color:var(--sub);letter-spacing:.05em}

  .reveal{opacity:0;transform:translateY(22px);transition:opacity .65s ease,transform .65s ease}
  .reveal.in{opacity:1;transform:none}

  @media(prefers-reduced-motion:reduce){
    *{animation:none!important;transition:none!important}
    .reveal{opacity:1;transform:none}
    .stamp.armed{opacity:1;transform:rotate(var(--ang))}
    .step{opacity:1;transform:none}
    .rail .fill{width:100%;height:100%}
    html{scroll-behavior:auto}
  }

  /* ===== v39 FIX: 大画面での右余白（左右非対称）を解消 =====
     背景（黒帯など）は画面いっぱいのまま、コンテンツだけを中央の版面(約1160px)へ。
     side paddingを流動値にして左右のガターを均等化。1100px以下は一切影響なし。 */
  @media(min-width:1101px){
    header, .tape, .hero, section, .band, .cta, footer{
      padding-left:  max(30px, calc((100% - 1160px) / 2));
      padding-right: max(30px, calc((100% - 1160px) / 2));
    }
  }

  /* --- mobile nav --- */
  .nav-toggle{display:none;width:36px;height:30px;border:2px solid var(--ink);background:none;cursor:pointer;padding:0;position:relative;flex-shrink:0}
  .nav-toggle span{position:absolute;left:7px;right:7px;height:2px;background:var(--ink);transition:transform .25s,opacity .2s,top .25s}
  .nav-toggle span:nth-child(1){top:8px}.nav-toggle span:nth-child(2){top:13px}.nav-toggle span:nth-child(3){top:18px}
  .nav-toggle[aria-expanded="true"] span:nth-child(1){top:13px;transform:rotate(45deg)}
  .nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
  .nav-toggle[aria-expanded="true"] span:nth-child(3){top:13px;transform:rotate(-45deg)}
  .mobile-menu{display:none;position:absolute;top:100%;left:0;right:0;background:var(--paper);border-bottom:2px solid var(--ink);flex-direction:column;z-index:99}
  .mobile-menu.open{display:flex}
  .mobile-menu a{font-family:var(--mono);font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:16px 22px;border-top:1px solid var(--hair)}
  .mobile-menu a:first-child{border-top:none}
  .mobile-menu a:hover,.mobile-menu a:active{background:var(--mustard)}
  @media(max-width:1000px){.nav-toggle{display:block}}
  @media(max-width:400px){header .wm{display:none}header{padding-left:14px;padding-right:14px;gap:10px}.head-right{gap:8px}.contact-btn{padding:6px 10px;font-size:11px}}
  #about,#business,#news,#company,#contact{scroll-margin-top:80px}
  .dh .tp{display:none}
  @media(hover:none),(max-width:1000px){.dh .hv{display:none}.dh .tp{display:inline}}
  .about-accent{font-family:"Yusei Magic",var(--jp);font-size:clamp(21px,3.2vw,32px);line-height:1.5;color:var(--ink);margin:2px 0 30px}
  .about-accent span{background:linear-gradient(transparent 58%, rgba(216,170,72,.55) 58% 92%, transparent 92%);padding:0 .12em}
