*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

  :root{
    /* ── ベース：明るい暖色のオフホワイト ── */
    --cream: #FFFBF2;
    --cream-2: #FFF4E2;
    --ink: #2B2417;
    --ink-soft: #6E6149;

    /* ── 主役：オレンジ × グリーン ── */
    --orange: #FF7A1A;
    --orange-deep: #E85A06;
    --green: #2DA85F;
    --green-deep: #18803F;

    /* ── ネオン／ビビッドなアクセント ── */
    --lime: #C9F23C;
    --pink: #FF5C8A;
    --sky: #46C7E6;
    --sun: #FFC42E;

    --radius: 24px;
    --shadow: 0 14px 40px -16px rgba(60,40,10,.35);
    --shadow-sm: 0 8px 22px -12px rgba(60,40,10,.30);

    --font-disp: "Bricolage Grotesque", "Zen Maru Gothic", sans-serif;
    --font-jp-head: "Zen Maru Gothic", sans-serif;
    --font-jp: "Noto Sans JP", sans-serif;
  }

  html{ scroll-behavior: smooth; }
  body{
    font-family: var(--font-jp);
    color: var(--ink);
    background: var(--cream);
    line-height: 1.85;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
  }
  a{ color: inherit; text-decoration: none; }
  img{ max-width: 100%; display: block; }
  ::selection{ background: var(--lime); color: var(--ink); }

  .wrap{ max-width: 1140px; margin: 0 auto; padding: 0 24px; }
  .disp{ font-family: var(--font-disp); font-weight: 800; letter-spacing: -.01em; }

  /* ───────── ヘッダー ───────── */
  header{
    position: fixed; inset: 0 0 auto 0; z-index: 100;
    transition: transform .4s cubic-bezier(.4,0,.2,1);
  }
  .head-inner{
    max-width: 1140px; margin: 12px auto 0; padding: 10px 14px 10px 18px;
    background: rgba(255,251,242,.86); backdrop-filter: blur(12px);
    border: 2px solid var(--ink); border-radius: 999px;
    box-shadow: 4px 4px 0 var(--ink);
    display: flex; align-items: center; justify-content: space-between; gap: 16px;
  }
  @media(max-width:1180px){ .head-inner{ margin: 12px 16px 0; } }
  .brand{ display: flex; align-items: center; gap: 11px; flex-shrink: 0; }
  .brand .mark{
    width: 54px; height: 54px; border-radius: 0; flex-shrink: 0;
    background: url("/taiyo-sun.png") center/contain no-repeat;
    box-shadow: none;
    position: relative;
  }
  .brand .name b{ font-family: var(--font-jp-head); font-weight: 900; font-size: 16px; color: var(--ink); display: block; line-height: 1.1; }
  .brand .name span{ font-size: 10.5px; color: var(--ink-soft); letter-spacing: .04em; }
  .nav{ display: flex; align-items: center; gap: 4px; flex-wrap: nowrap; }
  .nav .head-cta{ flex-shrink: 0; }
  .nav a.link{ font-family: var(--font-jp-head); font-weight: 700; font-size: 14px; padding: 8px 13px; border-radius: 999px; transition: background .2s, color .2s; white-space: nowrap; }
  .nav a.link:hover{ background: var(--cream-2); color: var(--orange-deep); }
  .btn{
    white-space: nowrap;
    font-family: var(--font-jp-head); font-weight: 700; font-size: 14.5px;
    display: inline-flex; align-items: center; gap: 8px; cursor: pointer;
    padding: 12px 22px; border-radius: 999px; border: 2px solid var(--ink);
    transition: transform .12s, box-shadow .12s, background .2s;
  }
  .btn-sun{ background: var(--orange); color: #fff; box-shadow: 3px 3px 0 var(--ink); }
  .btn-sun:hover{ transform: translate(-1px,-1px); box-shadow: 5px 5px 0 var(--ink); background: var(--orange-deep); }
  .btn-green{ background: var(--green); color: #fff; box-shadow: 3px 3px 0 var(--ink); }
  .btn-green:hover{ transform: translate(-1px,-1px); box-shadow: 5px 5px 0 var(--ink); background: var(--green-deep); }
  .btn-ghost{ background: #fff; color: var(--ink); box-shadow: 3px 3px 0 var(--ink); }
  .btn-ghost:hover{ transform: translate(-1px,-1px); box-shadow: 5px 5px 0 var(--ink); }
  .btn-lime{ background: var(--lime); color: var(--ink); box-shadow: 3px 3px 0 var(--ink); }
  .btn-lime:hover{ transform: translate(-1px,-1px); box-shadow: 5px 5px 0 var(--ink); }
  .btn-line{ background:#06C755; color:#fff; box-shadow:3px 3px 0 var(--ink); }
  .btn-line:hover{ background:#05b34c; transform:translate(-1px,-1px); box-shadow:5px 5px 0 var(--ink); }
  .menu-btn{ display: none; }

  @media(max-width:1024px){
    .nav .link{ display: none; }
    .nav .btn.head-cta{ display: none; }
    .menu-btn{ display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; border: 2px solid var(--ink); background: var(--lime); box-shadow: 2px 2px 0 var(--ink); cursor: pointer; flex-direction: column; gap: 4px; }
    .menu-btn span{ width: 18px; height: 2.4px; background: var(--ink); border-radius: 2px; display: block; }
  }

  /* モバイルメニュー */
  .m-menu{ position: fixed; inset: 0; z-index: 99; background: var(--cream); padding: 96px 28px 40px; display: none; flex-direction: column; gap: 6px; }
  .m-menu.open{ display: flex; }
  .m-menu a{ font-family: var(--font-jp-head); font-weight: 700; font-size: 22px; padding: 14px 6px; border-bottom: 2px dashed #E7D7BC; display: flex; align-items: center; gap: 12px; }
  .m-menu a .num{ font-family: var(--font-disp); color: var(--orange); font-size: 14px; }
  .m-menu .btn{ margin-top: 18px; justify-content: center; font-size: 17px; }

  /* ───────── 共通：セクション ───────── */
  section{ position: relative; }
  .eyebrow{
    display: inline-flex; align-items: center; gap: 9px;
    font-family: var(--font-disp); font-weight: 700; font-size: 13px;
    letter-spacing: .14em; text-transform: uppercase; color: var(--green-deep);
    background: #fff; border: 2px solid var(--ink); border-radius: 999px;
    padding: 7px 16px; box-shadow: 2px 2px 0 var(--ink); white-space: nowrap;
  }
  .eyebrow .dot{ width: 9px; height: 9px; border-radius: 50%; background: var(--lime); border: 1.5px solid var(--ink); }
  .h2{ font-family: var(--font-jp-head); font-weight: 900; font-size: clamp(28px, 4.6vw, 50px); line-height: 1.28; letter-spacing: .01em; }
  .h2 .mk{ position: relative; white-space: nowrap; }
  .h2 .mk::after{ content:""; position: absolute; left: -2%; right: -2%; bottom: 6%; height: 38%; background: var(--lime); z-index: -1; border-radius: 4px; transform: rotate(-1.2deg); }
  .h2 em{ font-style: normal; color: var(--orange-deep); }
  .lead{ font-size: clamp(15px,1.7vw,17px); color: var(--ink-soft); line-height: 2.1; }

  /* blob & shapes */
  .blob{ position: absolute; border-radius: 42% 58% 57% 43% / 47% 42% 58% 53%; filter: blur(.2px); z-index: -1; pointer-events: none; }
  /* 水玉を含むセクションは独立スタッキング文脈を作り、装飾を必ず文字の背面に保つ */
  .hero, .phero, .message, .jobs, .faq, .reviews, .voices, .perks, .stats, .entry{ position: relative; isolation: isolate; }
  @keyframes floaty{ 0%,100%{ transform: translateY(0) rotate(0); } 50%{ transform: translateY(-22px) rotate(6deg); } }
  @keyframes floaty2{ 0%,100%{ transform: translateY(0) rotate(0); } 50%{ transform: translateY(18px) rotate(-7deg); } }
  @keyframes spin{ to{ transform: rotate(360deg); } }
  @keyframes wobble{ 0%,100%{ transform: rotate(-3deg); } 50%{ transform: rotate(3deg); } }

  /* reveal — initial hidden state only when JS is active (.js) so no-JS shows everything */
  .js [data-reveal]{ opacity: 0; transform: translateY(34px); transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
  .js [data-reveal].in{ opacity: 1; transform: none; }
  .js [data-reveal][data-d="1"]{ transition-delay: .08s; }
  .js [data-reveal][data-d="2"]{ transition-delay: .16s; }
  .js [data-reveal][data-d="3"]{ transition-delay: .24s; }
  .js [data-reveal][data-d="4"]{ transition-delay: .32s; }
  /* fail-safe: when transitions are frozen (unfocused preview), snap everything to visible */
  html.no-anim *{ transition: none !important; animation: none !important; }
  html.no-anim [data-reveal]{ opacity: 1 !important; transform: none !important; }
  @media(prefers-reduced-motion: reduce){
    [data-reveal]{ opacity: 1 !important; transform: none !important; }
    .blob, .sun-rays{ animation: none !important; }
    html{ scroll-behavior: auto; }
  }

  /* ───────── HERO ───────── */
  .hero{ padding: 150px 0 80px; overflow: hidden; }
  .hero-grid{ display: grid; grid-template-columns: 1.05fr .95fr; gap: 40px; align-items: center; }
  .hero-tag{ display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-jp-head); font-weight: 700; font-size: 13.5px; color: var(--green-deep); background: #fff; border: 2px solid var(--ink); border-radius: 999px; padding: 8px 16px; box-shadow: 3px 3px 0 var(--ink); white-space: nowrap; max-width: 100%; }
  .hero-tag .star{ color: var(--orange); }
  .hero h1{ font-family: var(--font-jp-head); font-weight: 900; font-size: clamp(40px, 7.4vw, 88px); line-height: 1.08; letter-spacing: .005em; margin: 22px 0 6px; }
  .hero h1 .o{ color: var(--orange); }
  .hero h1 .g{ color: var(--green); position: relative; }
  .hero h1 .swoosh{ display: inline-block; }
  .hero .en{ font-family: var(--font-disp); font-weight: 800; font-size: clamp(13px,1.6vw,17px); letter-spacing: .26em; text-transform: uppercase; color: var(--ink-soft); margin-bottom: 22px; }
  .hero p.sub{ font-size: 16px; color: var(--ink-soft); line-height: 2.1; max-width: 30em; margin-bottom: 26px; }
  .hero-badges{ display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 30px; }
  .chip{ font-family: var(--font-jp-head); font-weight: 700; font-size: 13.5px; padding: 8px 15px; border-radius: 999px; border: 2px solid var(--ink); background: #fff; color: var(--ink); white-space: nowrap; box-shadow: 2px 2px 0 var(--ink); display: inline-flex; align-items: center; gap: 7px; }
  .chip .ic{ width: 18px; height: 18px; border-radius: 50%; display: grid; place-items: center; font-size: 11px; }
  .chip.c1 .ic{ background: var(--sun); } .chip.c2 .ic{ background: var(--lime); } .chip.c3 .ic{ background: var(--pink); } .chip.c4 .ic{ background: var(--sky); }
  .hero-cta{ display: flex; flex-wrap: wrap; gap: 13px; align-items: center; }
  .hero-cta .btn{ font-size: 16px; padding: 15px 26px; }
  .tel-mini{ font-family: var(--font-jp-head); }
  .tel-mini small{ display: block; font-size: 11px; color: var(--ink-soft); font-weight: 700; }
  .tel-mini b{ font-family: var(--font-disp); font-size: 22px; color: var(--ink); letter-spacing: .01em; }

  /* hero art */
  .hero-art{ position: relative; aspect-ratio: 1/1.04; }
  .sun-rays{ position: absolute; width: 128%; height: 128%; left: -14%; top: -16%; z-index: 0; animation: spin 60s linear infinite; }
  .photo-blob{ position: relative; z-index: 2; width: 100%; height: 100%; border: 3px solid var(--ink); box-shadow: 8px 10px 0 var(--ink); overflow: hidden; }
  .blob-a{ border-radius: 63% 37% 54% 46% / 58% 54% 46% 42%; }
  .photo-blob image-slot{ width: 100%; height: 100%; }
  .sticker{ position: absolute; z-index: 4; font-family: var(--font-jp-head); font-weight: 900; border: 2.5px solid var(--ink); border-radius: 16px; padding: 10px 14px; box-shadow: 4px 4px 0 var(--ink); line-height: 1.15; text-align: center; }
  .sticker .big{ font-family: var(--font-disp); font-size: 26px; display: block; }
  .sticker.s1{ top: 6%; right: -4%; background: var(--lime); transform: rotate(7deg); animation: wobble 5s ease-in-out infinite; }
  .sticker.s2{ bottom: 8%; left: -7%; background: #fff; transform: rotate(-6deg); }
  .sticker.s2 .big{ color: var(--orange-deep); }
  .scroll-cue{ display: inline-flex; align-items: center; gap: 9px; margin-top: 34px; font-family: var(--font-disp); font-weight: 700; font-size: 12px; letter-spacing: .2em; color: var(--ink-soft); }
  .scroll-cue .line{ width: 46px; height: 2px; background: var(--ink); position: relative; overflow: hidden; }
  .scroll-cue .line::after{ content:""; position: absolute; inset: 0; background: var(--orange); transform: translateX(-100%); animation: cue 1.8s ease-in-out infinite; }
  @keyframes cue{ 0%{ transform: translateX(-100%);} 60%,100%{ transform: translateX(100%);} }

  @media(max-width:900px){
    .hero{ padding: 128px 0 56px; }
    .hero-grid{ grid-template-columns: 1fr; gap: 30px; }
    .hero-art{ max-width: 440px; margin: 0 auto; width: 100%; }
  }

  /* ───────── マーキー ───────── */
  .marquee{ background: var(--ink); color: var(--cream); padding: 16px 0; border-top: 3px solid var(--ink); border-bottom: 3px solid var(--ink); overflow: hidden; }
  .marquee-track{ display: flex; white-space: nowrap; width: max-content; animation: scroll-x 26s linear infinite; }
  .marquee:hover .marquee-track{ animation-play-state: paused; }
  .marquee b{ font-family: var(--font-jp-head); font-weight: 900; font-size: 20px; display: inline-flex; align-items: center; gap: 28px; padding-right: 28px; flex-shrink: 0; }
  .marquee .o{ color: var(--sun); }
  .marquee .star{ color: var(--lime); }
  @keyframes scroll-x{ to{ transform: translateX(-50%); } }

  /* ───────── メッセージ ───────── */
  .message{ padding: 96px 0; text-align: center; }
  .message .big-quote{ font-family: var(--font-jp-head); font-weight: 900; font-size: clamp(26px, 4.4vw, 46px); line-height: 1.5; letter-spacing: .01em; max-width: 18em; margin: 24px auto 26px; }
  .message .big-quote .u{ background: linear-gradient(transparent 64%, var(--sun) 64%); padding: 0 .1em; }
  .message .big-quote .g{ color: var(--green); }
  .message p{ max-width: 34em; margin: 0 auto; color: var(--ink-soft); }
  .message .sun-icon{ width: 116px; height: 116px; margin: 0 auto; background: url("/taiyo-sun.png") center/contain no-repeat; position: relative; }

  /* ───────── 数字 ───────── */
  .stats{ padding: 30px 0 96px; }
  .stats-head{ text-align: center; margin-bottom: 50px; }
  .stats-grid{ display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
  .stat{ background: #fff; border: 3px solid var(--ink); border-radius: var(--radius); padding: 28px 22px; box-shadow: 6px 6px 0 var(--ink); position: relative; overflow: hidden; }
  .stat .corner{ position: absolute; top: -22px; right: -22px; width: 76px; height: 76px; border-radius: 50%; opacity: .9; }
  .stat .label{ font-family: var(--font-jp-head); font-weight: 700; font-size: 13.5px; color: var(--ink-soft); position: relative; }
  .stat .figure{ font-family: var(--font-disp); font-weight: 800; line-height: 1; margin: 8px 0 4px; position: relative; }
  .stat .figure .n{ font-size: clamp(44px,6vw,64px); }
  .stat .figure .unit{ font-family: var(--font-jp-head); font-weight: 900; font-size: 22px; margin-left: 4px; }
  .stat .note{ font-size: 12.5px; color: var(--ink-soft); position: relative; }
  .stat.s1 .corner{ background: var(--sun); } .stat.s1 .figure .n{ color: var(--orange-deep); }
  .stat.s2 .corner{ background: var(--lime); } .stat.s2 .figure .n{ color: var(--green-deep); }
  .stat.s3 .corner{ background: var(--pink); } .stat.s3 .figure .n{ color: var(--pink); }
  .stat.s4 .corner{ background: var(--sky); } .stat.s4 .figure .n{ color: var(--green-deep); }
  .stat.s5 .corner{ background: var(--orange); } .stat.s5 .figure .n{ color: var(--orange-deep); }
  .stat.s6 .corner{ background: var(--lime); } .stat.s6 .figure .n{ color: var(--green-deep); }
  @media(max-width:760px){ .stats-grid{ grid-template-columns: 1fr 1fr; } }

  /* ───────── 魅力 ───────── */
  .perks{ padding: 96px 0; background: var(--cream-2); border-top: 3px solid var(--ink); border-bottom: 3px solid var(--ink); position: relative; }
  .perks-head{ display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 50px; flex-wrap: wrap; }
  .perks-grid{ display: grid; grid-template-columns: repeat(4,1fr); gap: 18px; }
  .perk{ background: #fff; border: 3px solid var(--ink); border-radius: var(--radius); padding: 26px 22px; box-shadow: 5px 5px 0 var(--ink); transition: transform .18s, box-shadow .18s; }
  .perk:hover{ transform: translate(-2px,-3px); box-shadow: 8px 9px 0 var(--ink); }
  .perk .badge{ width: 56px; height: 56px; border-radius: 18px; border: 2.5px solid var(--ink); display: grid; place-items: center; font-size: 26px; box-shadow: 3px 3px 0 var(--ink); margin-bottom: 16px; transform: rotate(-4deg); }
  .perk:nth-child(4n+1) .badge{ background: var(--sun); } .perk:nth-child(4n+2) .badge{ background: var(--lime); } .perk:nth-child(4n+3) .badge{ background: var(--pink); } .perk:nth-child(4n) .badge{ background: var(--sky); }
  .perk h3{ font-family: var(--font-jp-head); font-weight: 900; font-size: 16.5px; margin-bottom: 8px; line-height: 1.4; }
  .perk p{ font-size: 13px; color: var(--ink-soft); line-height: 1.85; }
  .perk .hl{ color: var(--orange-deep); font-weight: 700; }
  @media(max-width:980px){ .perks-grid{ grid-template-columns: 1fr 1fr; } }
  @media(max-width:520px){ .perks-grid{ grid-template-columns: 1fr; } }

  /* ───────── 仕事紹介 ───────── */
  .jobs{ padding: 96px 0; }
  .jobs-head{ text-align: center; margin-bottom: 54px; }
  .jobs-grid{ display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
  .job{ background: #fff; border: 3px solid var(--ink); border-radius: var(--radius); overflow: hidden; box-shadow: 6px 6px 0 var(--ink); display: flex; flex-direction: column; transition: transform .18s, box-shadow .18s; }
  .job:hover{ transform: translate(-2px,-3px); box-shadow: 9px 10px 0 var(--ink); }
  .job-pic{ position: relative; height: 200px; border-bottom: 3px solid var(--ink); overflow: hidden; }
  .job-pic image-slot{ width: 100%; height: 100%; }
  .job-pic .tag{ position: absolute; top: 14px; left: 14px; z-index: 3; font-family: var(--font-jp-head); font-weight: 900; font-size: 12.5px; color: #fff; padding: 6px 13px; border-radius: 999px; border: 2px solid var(--ink); box-shadow: 2px 2px 0 var(--ink); }
  .job-pic .num{ position: absolute; right: 14px; bottom: 12px; z-index: 3; font-family: var(--font-disp); font-weight: 800; font-size: 40px; color: #fff; -webkit-text-stroke: 2px var(--ink); }
  .job-body{ padding: 22px 22px 24px; flex: 1; display: flex; flex-direction: column; }
  .job-body h3{ font-family: var(--font-jp-head); font-weight: 900; font-size: 19px; margin-bottom: 4px; }
  .job-body .role{ font-size: 12px; color: var(--ink-soft); font-weight: 700; margin-bottom: 14px; }
  .job-body ul{ list-style: none; margin-bottom: 18px; }
  .job-body li{ font-size: 13px; color: var(--ink-soft); padding: 4px 0; display: flex; gap: 9px; align-items: flex-start; }
  .job-body li::before{ content: "✿"; color: var(--green); flex-shrink: 0; }
  .job-body .pay{ font-family: var(--font-jp-head); font-weight: 700; font-size: 13px; background: var(--cream-2); border: 2px dashed #E0B98C; border-radius: 12px; padding: 9px 13px; margin-bottom: 16px; }
  .job-body .pay b{ font-family: var(--font-disp); color: var(--orange-deep); font-size: 17px; }
  .job-body .more{ margin-top: auto; }
  @media(max-width:900px){ .jobs-grid{ grid-template-columns: 1fr; max-width: 460px; margin: 0 auto; } }

  /* ───────── 先輩の声 ───────── */
  .voices{ padding: 96px 0; background: var(--green-deep); color: var(--cream); border-top: 3px solid var(--ink); position: relative; overflow: hidden; }
  .voices .eyebrow{ color: var(--green-deep); }
  .voices .h2{ color: #fff; }
  .voices .h2 .mk::after{ background: var(--lime); }
  .voices-head{ text-align: center; margin-bottom: 50px; }
  .voices-grid{ display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; position: relative; z-index: 2; }
  .voice{ background: var(--cream); color: var(--ink); border: 3px solid var(--ink); border-radius: var(--radius); padding: 24px; box-shadow: 6px 6px 0 rgba(0,0,0,.45); }
  .voice .top{ display: flex; align-items: center; gap: 14px; margin-bottom: 16px; }
  .voice .ava{ width: 64px; height: 64px; flex-shrink: 0; border: 3px solid var(--ink); overflow: hidden; border-radius: 58% 42% 47% 53% / 53% 49% 51% 47%; }
  .voice .ava image-slot{ width: 100%; height: 100%; }
  .voice .who b{ font-family: var(--font-jp-head); font-weight: 900; font-size: 15px; display: block; }
  .voice .who span{ font-size: 11.5px; color: var(--ink-soft); }
  .voice .who .yrs{ display: inline-block; margin-top: 4px; font-family: var(--font-disp); font-weight: 700; font-size: 11px; background: var(--lime); border: 1.5px solid var(--ink); border-radius: 999px; padding: 2px 9px; white-space: nowrap; }
  .voice .q{ font-family: var(--font-jp-head); font-weight: 700; font-size: 16px; line-height: 1.55; margin-bottom: 10px; }
  .voice .q .u{ background: linear-gradient(transparent 62%, var(--sun) 62%); }
  .voice p{ font-size: 12.5px; color: var(--ink-soft); line-height: 1.8; }
  @media(max-width:900px){ .voices-grid{ grid-template-columns: 1fr; max-width: 440px; margin: 0 auto; } }

  /* ───────── FAQ ───────── */
  .faq{ padding: 96px 0; }
  .faq-head{ text-align: center; margin-bottom: 44px; }
  .faq-list{ max-width: 760px; margin: 0 auto; display: flex; flex-direction: column; gap: 14px; }
  details.q{ background: #fff; border: 3px solid var(--ink); border-radius: 18px; box-shadow: 4px 4px 0 var(--ink); overflow: hidden; }
  details.q summary{ font-family: var(--font-jp-head); font-weight: 700; font-size: 15.5px; padding: 18px 22px; cursor: pointer; list-style: none; display: flex; align-items: center; gap: 14px; }
  details.q summary::-webkit-details-marker{ display: none; }
  details.q summary .mk-q{ font-family: var(--font-disp); font-weight: 800; color: #fff; background: var(--green); width: 28px; height: 28px; border-radius: 8px; border: 2px solid var(--ink); display: grid; place-items: center; font-size: 14px; flex-shrink: 0; }
  details.q summary .arrow{ margin-left: auto; width: 26px; height: 26px; border-radius: 50%; border: 2px solid var(--ink); display: grid; place-items: center; flex-shrink: 0; transition: transform .25s, background .2s; background: var(--lime); font-weight: 900; }
  details.q[open] summary .arrow{ transform: rotate(45deg); background: var(--orange); color: #fff; }
  details.q .a{ padding: 0 22px 20px 64px; font-size: 13.5px; color: var(--ink-soft); line-height: 1.95; }

  /* ───────── エントリーCTA ───────── */
  .entry{ padding: 30px 0 110px; }
  .entry-card{ position: relative; background: var(--orange); border: 3px solid var(--ink); border-radius: 36px; box-shadow: 10px 12px 0 var(--ink); padding: 64px 40px; text-align: center; overflow: hidden; }
  .entry-card .e-sun{ position: absolute; width: 220px; height: 220px; border-radius: 50%; background: radial-gradient(circle at 50% 45%, var(--sun) 0 46%, transparent 66%); top: -70px; left: -60px; opacity: .9; }
  .entry-card .e-blob{ position: absolute; width: 200px; height: 200px; background: var(--green); border-radius: 42% 58% 57% 43% / 47% 42% 58% 53%; right: -60px; bottom: -70px; opacity: .55; }
  .entry-card h2{ font-family: var(--font-jp-head); font-weight: 900; color: #fff; font-size: clamp(28px,4.6vw,46px); line-height: 1.32; position: relative; }
  .entry-card h2 .u{ background: linear-gradient(transparent 62%, var(--lime) 62%); color: #fff; padding: 0 .12em; }
  .entry-card p{ color: #fff; font-size: 15px; margin: 18px auto 30px; max-width: 30em; position: relative; opacity: .96; }
  .entry-card .e-cta{ display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; position: relative; }
  .entry-card .e-cta .btn{ font-size: 17px; padding: 17px 30px; }
  .entry-tel{ position: relative; margin-top: 26px; color: #fff; font-family: var(--font-jp-head); }
  .entry-tel b{ font-family: var(--font-disp); font-size: 26px; letter-spacing: .02em; }
  .entry-tel small{ display: block; font-size: 12px; opacity: .9; }

  /* ───────── フッター ───────── */
  footer{ background: var(--ink); color: var(--cream-2); padding: 60px 0 30px; }
  .foot-grid{ display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 32px; margin-bottom: 36px; }
  .foot-brand .name{ display: flex; align-items: center; gap: 11px; margin-bottom: 14px; }
  .foot-brand .mark{ width: 48px; height: 48px; background: url("/taiyo-sun.png") center/contain no-repeat; }
  .foot-brand b{ font-family: var(--font-jp-head); font-weight: 900; font-size: 17px; color: #fff; }
  .foot-brand p{ font-size: 12.5px; line-height: 1.95; opacity: .8; }
  .foot-col h4{ font-family: var(--font-disp); font-weight: 700; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--sun); margin-bottom: 14px; }
  .foot-col ul{ list-style: none; }
  .foot-col li{ padding: 5px 0; font-size: 13px; opacity: .85; }
  .foot-col a:hover{ color: var(--lime); }
  .foot-bottom{ border-top: 1px solid rgba(255,255,255,.16); padding-top: 22px; text-align: center; font-size: 11.5px; opacity: .7; }
  @media(max-width:760px){ .foot-grid{ grid-template-columns: 1fr; gap: 24px; } }

  /* ───────── モバイル固定CTA ───────── */
  .m-cta{ display: none; position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 90; gap: 10px; }
  .m-cta a{ flex: 1; justify-content: center; font-size: 15px; padding: 14px; }
  @media(max-width:900px){ .m-cta{ display: flex; } body{ padding-bottom: 84px; } }

  /* ═══════════════════════════════════════════════════════
     SPORTY LAYER ─ スポーティ強化（斜めのプレート・ジャージ数字・レーシングストライプ）
     ═══════════════════════════════════════════════════════ */
  :root{ --skew: -9deg; }

  /* アスリート風バッジ（傾けず、太枠で力強く） */
  .eyebrow{ font-style: italic; }

  /* 英字ラベル＝イタリック＋チェッカー矢印 */
  .hero .en{ font-style: italic; position: relative; display: inline-block; }
  .hero .en::after{ content: '›››'; margin-left: 10px; color: var(--orange); -webkit-text-stroke: 0; letter-spacing: -.06em; }
  .foot-col h4{ font-style: italic; }

  /* ジャージ風の大きな数字 */
  .stat .figure .n{ font-style: italic; letter-spacing: -.01em; }
  .job-pic .num{ font-style: italic; display: inline-block; }

  /* マーキー＝スポーツのLEDティッカー */
  .marquee{ border-top: 5px solid var(--lime); border-bottom: 5px solid var(--orange); background: var(--ink); }
  .marquee-track{ animation-duration: 16s; }
  .marquee b{ font-style: italic; }

  .jobs{ padding-bottom: 120px; }

  /* レーシングストライプの帯（区切り） */
  .race-strip{ height: 16px; background:
      repeating-linear-gradient(-45deg,
        var(--orange) 0 16px, var(--ink) 16px 18px,
        var(--lime) 18px 34px, var(--ink) 34px 36px,
        var(--green) 36px 52px, var(--ink) 52px 54px); }

  /* ステッカーやチップに躍動感のあるホバー */
  .chip{ transition: transform .15s; }
  .chip:hover{ transform: translateY(-2px); }
  .btn-sun:hover, .btn-green:hover{ letter-spacing: .02em; }

  /* ═══════════ 太陽の人たち（出会う人たち）─ ブログのテーマを反映 ═══════════ */
  .people{ padding: 96px 0; background:
      linear-gradient(135deg, rgba(45,168,95,.05), rgba(255,122,26,.05)), var(--cream-2);
    border-top: 3px solid var(--ink); position: relative; overflow: hidden; }
  .people::before{ content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none;
    background: repeating-linear-gradient(-45deg, rgba(43,36,23,.025) 0 2px, transparent 2px 22px); }
  .people .wrap{ position: relative; z-index: 1; }
  .people-head{ text-align: center; margin-bottom: 50px; }
  .people-head .lead{ max-width: 38em; margin: 18px auto 0; }
  .people-grid{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; margin-bottom: 38px; }
  .pcard{ background: #fff; border: 3px solid var(--ink); border-radius: 20px; box-shadow: 6px 6px 0 var(--ink);
    overflow: hidden; display: flex; flex-direction: column; transition: transform .18s, box-shadow .18s; }
  .pcard:nth-child(odd){ transform: rotate(-1deg); }
  .pcard:nth-child(even){ transform: rotate(1deg); }
  .pcard:hover{ transform: translateY(-4px) rotate(0deg); box-shadow: 9px 11px 0 var(--ink); }
  .pcat{ font-family: var(--font-jp-head); font-weight: 900; font-size: 12px; color: #fff;
    padding: 9px 14px; border-bottom: 3px solid var(--ink); display: flex; align-items: center; gap: 6px;
    white-space: nowrap; overflow: hidden; }
  .pcat span{ display: inline-block; white-space: nowrap; }
  .pphoto{ height: 172px; border-bottom: 3px solid var(--ink); overflow: hidden; position: relative; background: var(--cream-2); }
  .pphoto image-slot{ width: 100%; height: 100%; }
  .pbody{ padding: 16px 16px 18px; flex: 1; display: flex; flex-direction: column; }
  .pq{ font-family: var(--font-jp-head); font-weight: 900; font-size: 15.5px; line-height: 1.5; margin-bottom: 8px; }
  .pq u{ text-decoration: none; background: linear-gradient(transparent 58%, var(--lime) 58%); padding: 0 .05em; }
  .pwho{ font-size: 11.5px; color: var(--ink-soft); margin-top: auto; }
  .people-cta{ text-align: center; }
  @media(max-width:900px){ .people-grid{ grid-template-columns: 1fr 1fr; } }
  @media(max-width:560px){ .people-grid{ grid-template-columns: 1fr; } .pcard{ transform: none !important; } }


  /* ════════════════════════════════════════════════
     SUB-PAGE COMPONENTS
     ════════════════════════════════════════════════ */

  /* breadcrumb */
  .crumb{ max-width: 1140px; margin: 96px auto 0; padding: 0 24px; font-family: var(--font-jp-head); font-weight: 700; font-size: 12.5px; color: var(--ink-soft); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
  .crumb a{ color: var(--green-deep); }
  .crumb a:hover{ color: var(--orange-deep); }
  .crumb .sep{ color: #D9C7A6; }

  /* page hero */
  .phero{ padding: 30px 0 64px; overflow: hidden; position: relative; }
  .phero-grid{ display: grid; grid-template-columns: 1.05fr .95fr; gap: 44px; align-items: center; }
  .phero.solo .phero-grid{ grid-template-columns: 1fr; max-width: 760px; }
  .ptag{ display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-jp-head); font-weight: 700; font-size: 13px; color: #fff; border: 2px solid var(--ink); border-radius: 999px; padding: 7px 16px; box-shadow: 3px 3px 0 var(--ink); white-space: nowrap; max-width: 100%; }
  .phero h1{ font-family: var(--font-jp-head); font-weight: 900; font-size: clamp(30px, 5vw, 54px); line-height: 1.2; letter-spacing: .01em; margin: 20px 0 16px; }
  .phero h1 em{ font-style: normal; }
  .phero .en{ font-family: var(--font-disp); font-weight: 800; font-size: clamp(12px,1.5vw,15px); letter-spacing: .24em; text-transform: uppercase; color: var(--ink-soft); margin-bottom: 18px; }
  .phero p.intro{ font-size: 15.5px; color: var(--ink-soft); line-height: 2.1; max-width: 32em; }
  .phero-art{ position: relative; aspect-ratio: 1/0.92; }
  .phero-art .photo-blob{ position: relative; z-index: 2; width: 100%; height: 100%; border: 3px solid var(--ink); box-shadow: 8px 10px 0 var(--ink); overflow: hidden; }
  .phero-art image-slot{ width: 100%; height: 100%; }
  @media(max-width:880px){ .phero-grid{ grid-template-columns: 1fr; gap: 28px; } .phero-art{ max-width: 420px; } }

  /* generic section heads */
  .sec{ padding: 72px 0; }
  .sec.tint{ background: var(--cream-2); border-top: 3px solid var(--ink); border-bottom: 3px solid var(--ink); }
  .sec-head{ text-align: center; margin-bottom: 48px; }
  .sec-head.left{ text-align: left; }
  .sec-head h2{ font-family: var(--font-jp-head); font-weight: 900; font-size: clamp(24px,3.6vw,38px); line-height: 1.3; margin-top: 14px; }
  .sec-head p.sub{ font-size: 15px; color: var(--ink-soft); margin-top: 12px; max-width: 40em; margin-left: auto; margin-right: auto; }

  /* feature card grid (reuse .perk) */
  .fgrid{ display: grid; gap: 18px; grid-template-columns: repeat(3,1fr); max-width: 1000px; margin: 0 auto; }
  .fgrid.c2{ grid-template-columns: repeat(2,1fr); max-width: 760px; }
  @media(max-width:880px){ .fgrid, .fgrid.c2{ grid-template-columns: 1fr 1fr; } }
  @media(max-width:560px){ .fgrid, .fgrid.c2{ grid-template-columns: 1fr; } }

  /* steps */
  .flow{ display: grid; grid-template-columns: repeat(5,1fr); gap: 14px; max-width: 1040px; margin: 0 auto; }
  .fstep{ background: #fff; border: 3px solid var(--ink); border-radius: 20px; box-shadow: 5px 5px 0 var(--ink); padding: 22px 16px; text-align: center; position: relative; }
  .fstep .sn{ width: 42px; height: 42px; border-radius: 50%; border: 2.5px solid var(--ink); display: grid; place-items: center; font-family: var(--font-disp); font-weight: 800; font-size: 18px; margin: 0 auto 12px; box-shadow: 2px 2px 0 var(--ink); }
  .fstep:nth-child(5n+1) .sn{ background: var(--sun);} .fstep:nth-child(5n+2) .sn{ background: var(--lime);} .fstep:nth-child(5n+3) .sn{ background: var(--pink);} .fstep:nth-child(5n+4) .sn{ background: var(--sky);} .fstep:nth-child(5n) .sn{ background: var(--orange);}
  .fstep h3{ font-family: var(--font-jp-head); font-weight: 900; font-size: 14px; margin-bottom: 6px; }
  .fstep p{ font-size: 12px; color: var(--ink-soft); line-height: 1.7; }
  @media(max-width:880px){ .flow{ grid-template-columns: 1fr 1fr; } }
  @media(max-width:480px){ .flow{ grid-template-columns: 1fr; } }

  /* info table */
  .info-table{ max-width: 820px; margin: 0 auto; background: #fff; border: 3px solid var(--ink); border-radius: var(--radius); box-shadow: 6px 6px 0 var(--ink); overflow: hidden; }
  .info-table .row{ display: grid; grid-template-columns: 200px 1fr; border-bottom: 2px dashed #E7D7BC; }
  .info-table .row:last-child{ border-bottom: none; }
  .info-table .th{ font-family: var(--font-jp-head); font-weight: 700; font-size: 14px; padding: 18px 22px; background: var(--cream-2); display: flex; align-items: center; gap: 10px; }
  .info-table .th .d{ width: 9px; height: 9px; border-radius: 50%; border: 1.5px solid var(--ink); }
  .info-table .td{ padding: 18px 22px; font-size: 14px; color: var(--ink); line-height: 1.85; }
  @media(max-width:600px){ .info-table .row{ grid-template-columns: 1fr; } .info-table .th{ border-bottom: 1px solid #E7D7BC; } }

  /* CTA band color variant */
  .cta-band .entry-card.green{ background: var(--green); }
  .cta-band .entry-card.green .e-blob{ background: var(--orange); }

  /* forms */
  .form-wrap{ max-width: 720px; margin: 0 auto; }
  .form-card{ background: #fff; border: 3px solid var(--ink); border-radius: var(--radius); box-shadow: 7px 7px 0 var(--ink); padding: 34px 32px; }
  .field{ margin-bottom: 22px; }
  .field > label{ display: flex; align-items: center; gap: 9px; font-family: var(--font-jp-head); font-weight: 700; font-size: 14.5px; margin-bottom: 9px; }
  .field .req{ font-family: var(--font-jp); font-size: 11px; font-weight: 700; color: #fff; background: var(--pink); border: 1.5px solid var(--ink); border-radius: 999px; padding: 1px 9px; }
  .field .opt{ font-family: var(--font-jp); font-size: 11px; font-weight: 700; color: var(--ink-soft); background: var(--cream-2); border: 1.5px solid #E0CDA8; border-radius: 999px; padding: 1px 9px; }
  .input, .textarea, .select{ width: 100%; font-family: var(--font-jp); font-size: 15px; color: var(--ink); background: var(--cream); border: 2.5px solid var(--ink); border-radius: 14px; padding: 13px 15px; transition: box-shadow .15s, background .15s; }
  .input:focus, .textarea:focus, .select:focus{ outline: none; background: #fff; box-shadow: 3px 3px 0 var(--orange); }
  .textarea{ min-height: 130px; resize: vertical; line-height: 1.8; }
  .select{ appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Cpath d='M3 5l4 4 4-4' stroke='%232B2417' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 16px center; padding-right: 40px; }
  .radio-row{ display: flex; flex-wrap: wrap; gap: 10px; }
  .radio-chip{ position: relative; }
  .radio-chip input{ position: absolute; opacity: 0; inset: 0; cursor: pointer; }
  .radio-chip span{ display: inline-flex; align-items: center; gap: 8px; font-family: var(--font-jp-head); font-weight: 700; font-size: 13.5px; padding: 10px 16px; border-radius: 999px; border: 2.5px solid var(--ink); background: #fff; box-shadow: 2px 2px 0 var(--ink); cursor: pointer; transition: background .15s, transform .1s; }
  .radio-chip input:checked + span{ background: var(--lime); transform: translateY(-1px); }
  .radio-chip input:focus-visible + span{ box-shadow: 0 0 0 3px var(--sky); }
  .form-note{ font-size: 12.5px; color: var(--ink-soft); line-height: 1.8; }
  .form-submit{ margin-top: 10px; }
  .form-submit .btn{ width: 100%; justify-content: center; font-size: 17px; padding: 17px; }
  .form-aside{ background: var(--cream-2); border: 3px solid var(--ink); border-radius: var(--radius); box-shadow: 5px 5px 0 var(--ink); padding: 24px; }
  .form-aside h3{ font-family: var(--font-jp-head); font-weight: 900; font-size: 16px; margin-bottom: 12px; display: flex; align-items: center; gap: 9px; }
  .form-aside .tel{ font-family: var(--font-disp); font-weight: 800; font-size: 24px; color: var(--orange-deep); }
  .form-grid2{ display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
  @media(max-width:600px){ .form-grid2{ grid-template-columns: 1fr; } .form-card{ padding: 26px 20px; } }

  /* legal prose */
  .legal{ max-width: 820px; margin: 0 auto; }
  .legal .lead{ font-size: 15px; color: var(--ink-soft); line-height: 2.05; margin-bottom: 36px; }
  .legal h2{ font-family: var(--font-jp-head); font-weight: 900; font-size: 19px; margin: 34px 0 12px; padding-left: 16px; border-left: 7px solid var(--lime); line-height: 1.5; }
  .legal h2 .num{ font-family: var(--font-disp); color: var(--orange); margin-right: 8px; }
  .legal p{ font-size: 14px; color: var(--ink); line-height: 2.05; margin-bottom: 12px; }
  .legal ul{ margin: 8px 0 12px 4px; padding-left: 22px; }
  .legal li{ font-size: 14px; color: var(--ink); line-height: 1.95; margin-bottom: 5px; }

  /* completion */
  .complete{ min-height: 78vh; display: grid; place-items: center; text-align: center; padding: 120px 24px 80px; }
  .complete-inner{ max-width: 620px; }
  .complete .big-check{ width: 110px; height: 110px; margin: 0 auto 28px; border-radius: 50%; background: var(--green); border: 4px solid var(--ink); box-shadow: 7px 7px 0 var(--ink); display: grid; place-items: center; font-size: 56px; }
  .complete h1{ font-family: var(--font-jp-head); font-weight: 900; font-size: clamp(28px,4.6vw,44px); line-height: 1.3; margin-bottom: 18px; }
  .complete h1 .u{ background: linear-gradient(transparent 62%, var(--sun) 62%); padding: 0 .1em; }
  .complete p{ font-size: 15px; color: var(--ink-soft); line-height: 2.05; margin-bottom: 30px; }
  .complete .ctas{ display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }


  /* ════════════════════════════════════════════════
     PHOTO GALLERY（ブロブ型マスクの写真）
     ════════════════════════════════════════════════ */
  .gallery{ display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; max-width: 1060px; margin: 0 auto; }
  .gallery.g3{ grid-template-columns: repeat(3,1fr); max-width: 940px; }
  .gphoto{ position: relative; }
  .gphoto .frame{ position: relative; aspect-ratio: 4/5; border: 3px solid var(--ink); box-shadow: 6px 7px 0 var(--ink); overflow: hidden; background: var(--cream-2); }
  .gphoto image-slot{ width: 100%; height: 100%; }
  .gphoto.r1 .frame{ border-radius: 63% 37% 54% 46% / 58% 54% 46% 42%; }
  .gphoto.r2 .frame{ border-radius: 47% 53% 45% 55% / 55% 48% 52% 45%; }
  .gphoto.r3 .frame{ border-radius: 42% 58% 57% 43% / 47% 42% 58% 53%; }
  .gphoto.r4 .frame{ border-radius: 55% 45% 52% 48% / 44% 56% 44% 56%; }
  .gphoto:nth-child(2n) .frame{ transform: rotate(-2deg); }
  .gphoto:nth-child(2n+1) .frame{ transform: rotate(2deg); }
  .gphoto .cap{ position: relative; z-index: 3; display: flex; align-items: center; gap: 6px; font-family: var(--font-jp-head); font-weight: 700; font-size: 12.5px; color: var(--ink); background: #fff; border: 2px solid var(--ink); border-radius: 999px; padding: 5px 13px; box-shadow: 2px 2px 0 var(--ink); margin: -16px auto 0; width: fit-content; }
  .gphoto .cap .pin{ width: 8px; height: 8px; border-radius: 50%; border: 1.5px solid var(--ink); }
  @media(max-width:860px){ .gallery, .gallery.g3{ grid-template-columns: 1fr 1fr; } }
  @media(max-width:480px){ .gallery, .gallery.g3{ grid-template-columns: 1fr; max-width: 320px; } }

  /* 横長フィーチャー写真（全幅マスク帯） */
  .photo-band{ position: relative; max-width: 1060px; margin: 0 auto; aspect-ratio: 21/9; border: 3px solid var(--ink); box-shadow: 8px 9px 0 var(--ink); overflow: hidden; border-radius: 58% 42% 56% 44% / 24% 26% 74% 76%; background: var(--cream-2); }
  .photo-band image-slot{ width: 100%; height: 100%; }
  @media(max-width:680px){ .photo-band{ aspect-ratio: 4/3; border-radius: 48% 52% 54% 46% / 16% 18% 82% 84%; } }


  /* ════════════════════════════════════════════════
     POLISH PASS — typography balance, a11y, line-breaks
     ════════════════════════════════════════════════ */
  h1, h2, h3, h4,
  .h2, .hero h1, .phero h1, .sec-head h2, .perks-head .h2,
  .entry-card h2, .voices .h2, .message .big-quote, .complete h1,
  .stat .figure, .legal h2{
    text-wrap: balance;
    line-break: strict;
  }
  p, .intro, .lead, .sub, .hero p.sub, .perk p, .job-body li,
  .legal p, .legal li, .info-table .td, .form-note, .voice p, .stat .note{
    text-wrap: pretty;
    line-break: strict;
    overflow-wrap: anywhere;
  }
  /* keep numbers / tel / english from breaking awkwardly */
  .tel, .entry-tel b, .stat .figure, .form-aside .tel, .crumb,
  .phero .en, .hero .en, .marquee b{ overflow-wrap: normal; }

  /* visible keyboard focus everywhere (a11y / SEO signal) */
  a:focus-visible, button:focus-visible, summary:focus-visible,
  input:focus-visible, select:focus-visible, textarea:focus-visible,
  .radio-chip input:focus-visible + span{
    outline: 3px solid var(--sky);
    outline-offset: 2px;
    border-radius: 6px;
  }
  /* skip-link for screen readers */
  .skip-link{ position: absolute; left: 12px; top: -60px; z-index: 200; background: var(--ink); color: #fff; font-family: var(--font-jp-head); font-weight: 700; font-size: 14px; padding: 10px 18px; border-radius: 0 0 14px 14px; transition: top .2s; }
  .skip-link:focus{ top: 0; }
  /* honour reduced data / motion already handled; ensure good print */
  @media print{ header, .m-cta, .m-menu, .menu-btn, .scroll-cue, .marquee{ display: none !important; } body{ background: #fff; } }


  /* ════════════════════════════════════════════════
     SHOWA RETRO LAYER — 紙のグレイン＋網点＋ほの温かみ
     ════════════════════════════════════════════════ */
  /* 全面の紙グレイン（古い印刷のような粒状感） */
  body::after{
    content:""; position:fixed; inset:0; z-index:9998; pointer-events:none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E"); background-size: 150px 150px;
    opacity:.028; mix-blend-mode: multiply;
  }
  @media print{ body::after{ display:none; } }

  /* 暖色のティント面に淡いハーフトーン網点（昭和の刷り物っぽさ） */
  .sec.tint, .perks{
    background-image: radial-gradient(rgba(180,90,20,.032) 1px, transparent 1.2px);
    background-size: 13px 13px;
    background-position: 0 0;
  }
  /* ほのかな上下のセピア・ヴィネット（褪色感） */
  .marquee{ box-shadow: inset 0 7px 16px -11px rgba(0,0,0,.4), inset 0 -7px 16px -11px rgba(0,0,0,.4); }
  /* 見出しまわりの“活版”感：レトロな囲み罫 */
  .eyebrow, .ptag{ position: relative; }


  /* ── 控えめな浮遊ブロブ（サブページ共通・淡く1つだけ） ── */
  .sec.tint{ position: relative; overflow: hidden; }
  .sec.tint > .wrap{ position: relative; z-index: 1; }
  .sec.tint::before{ content:""; position:absolute; width:220px; height:220px;
    border-radius:42% 58% 57% 43% / 47% 42% 58% 53%;
    background:var(--sky); opacity:.10; right:-80px; top:50px; z-index:0;
    animation:floaty 13s ease-in-out infinite; pointer-events:none; }
  .sec.tint:nth-of-type(even)::before{ background:var(--lime); left:-80px; right:auto;
    animation:floaty2 14s ease-in-out infinite; }
  @media(prefers-reduced-motion: reduce){ .sec.tint::before{ animation:none; } }