/* NNiNN renewal — 共通コンポーネント */
@layer components {

  /* ---------- Logo ---------- */
  .logo { display: inline-flex; align-items: baseline; text-decoration: none; color: var(--c-ink); font-family: var(--ff-label); font-weight: 700; font-size: 28px; letter-spacing: -.01em; line-height: 1; }
  .logo--on-dark { color: #fff; }
  .logo--lg { font-size: 32px; }
  .logo__word { display: inline-flex; align-items: baseline; }
  .logo__i { position: relative; display: inline-block; line-height: 1; }
  /* 「i」の点を上から clip して隠し、青い点を置く（可視テキストは NNiNN のまま） */
  .logo__glyph { display: block; line-height: 1; clip-path: inset(var(--logo-clip, .34em) 0 0 0); }
  .logo__dot { position: absolute; left: 50%; top: -.06em; width: .2em; height: .2em; margin-left: -.1em; border-radius: 50%; background: var(--c-blue); }
  @media (max-width: 767px) { .logo { font-size: 24px; } .logo--lg { font-size: 26px; } }

  /* ---------- Header ---------- */
  .header { position: sticky; top: 0; z-index: 100; height: var(--header-h); background: var(--c-bg); border-bottom: 1px solid var(--c-line); transition: background .3s var(--ease-out); }
  .header.is-scrolled { background: color-mix(in srgb, var(--c-bg) 95%, transparent); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
  .header__inner { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: var(--sp-3); }
  .header__brand { display: flex; align-items: center; gap: var(--sp-3); }
  .header__tagline { font-size: 10px; letter-spacing: .2em; white-space: nowrap; }
  .header__list { display: flex; align-items: center; gap: var(--sp-4); }
  .header__list a { display: inline-flex; align-items: center; min-height: var(--tap-min); font-size: 13px; letter-spacing: .06em; color: var(--c-ink); text-decoration: none; position: relative; white-space: nowrap; }
  .header__list a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 8px; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: left; transition: transform .3s var(--ease-out); }
  .header__list a:hover::after, .header__list a[aria-current="page"]::after { transform: scaleX(1); }
  .header__actions { display: flex; align-items: center; gap: var(--sp-1); }
  .header__menu-btn { display: none; width: var(--tap-min); height: var(--tap-min); border-radius: 50%; border: 1px solid var(--c-line); color: var(--c-ink); align-items: center; justify-content: center; }
  @media (max-width: 1200px) { .header__tagline { display: none; } .header__list { gap: 20px; } }
  @media (max-width: 1079px) {
    .header__tagline, .header__nav { display: none; }
    .header__menu-btn { display: inline-flex; }
    .header__cta { min-height: var(--tap-min); padding-inline: 16px; font-size: 12px; }
    .header__cta .icon { display: none; }
  }

  /* ---------- SP Menu ---------- */
  .menu { position: fixed; inset: 0; z-index: 200; background: var(--c-dark); color: #fff; display: flex; flex-direction: column; overflow-y: auto; padding-bottom: env(safe-area-inset-bottom); }
  .menu__bar { height: var(--header-h); flex-shrink: 0; padding-inline: var(--gutter); display: flex; align-items: center; justify-content: space-between; }
  .menu__close { width: var(--tap-min); height: var(--tap-min); border-radius: 50%; border: 1px solid var(--c-dark-line); color: #fff; display: inline-flex; align-items: center; justify-content: center; }
  .menu__nav { padding: var(--sp-2) var(--gutter) 0; display: flex; flex-direction: column; }
  .menu__item { display: flex; align-items: baseline; gap: var(--sp-2); min-height: 64px; padding: 14px 0; border-bottom: 1px solid var(--c-dark-line); text-decoration: none; color: #fff; }
  .menu__num { font-family: var(--ff-serif); font-size: 14px; color: var(--c-on-dark-muted); }
  .menu__text { display: flex; flex-direction: column; gap: 4px; }
  .menu__ja { font-family: var(--ff-display); font-weight: 700; font-size: 24px; line-height: 1.3; }
  .menu__en { font-family: var(--ff-label); font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: var(--c-on-dark-muted); }
  .menu__cta { padding: var(--sp-4) var(--gutter) 0; }
  .menu__foot { margin-top: auto; padding: var(--sp-4) var(--gutter) var(--sp-4); display: flex; flex-direction: column; gap: var(--sp-2); }
  .menu__tagline { font-size: 15px; color: var(--c-on-dark); }
  @media (min-width: 1080px) { .menu { display: none; } }

  .sns { display: flex; gap: var(--sp-3); }
  .sns a { display: inline-flex; align-items: center; min-height: var(--tap-min); font-family: var(--ff-label); font-size: 12px; letter-spacing: .1em; color: var(--c-on-dark); text-decoration: none; }
  .sns a:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }

  /* ---------- Footer ---------- */
  .footer { background: var(--c-dark); color: var(--c-on-dark); padding-block: 64px 40px; }
  .footer__inner { display: grid; grid-template-columns: 1fr auto; gap: var(--sp-7) var(--sp-4); align-items: start; }
  .footer__brand { display: flex; flex-direction: column; gap: 14px; }
  .footer__tagline { font-size: 16px; color: var(--c-on-dark); }
  .footer__cols { display: grid; grid-template-columns: repeat(3, auto); gap: 64px; }
  .footer__head { color: var(--c-on-dark-muted); margin-bottom: var(--sp-1); }
  .footer__links a { display: inline-flex; align-items: center; min-height: 40px; font-size: 13px; color: var(--c-on-dark); text-decoration: none; }
  .footer__links a:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
  .footer__sub { font-size: 13px; color: var(--c-on-dark-muted); }
  .footer__bottom { grid-column: 1 / -1; display: flex; justify-content: space-between; gap: var(--sp-2); padding-top: var(--sp-3); border-top: 1px solid var(--c-dark-line); font-size: 11px; color: var(--c-on-dark-muted); letter-spacing: .1em; }
  .footer__copy { color: var(--c-on-dark-muted); font-size: 11px; letter-spacing: .1em; text-transform: none; }
  @media (min-width: 768px) {
    .footer__col--follow .sns { flex-direction: column; gap: 0; }
    .footer__col--follow .sns a { min-height: 40px; font-family: var(--ff-body); font-size: 13px; letter-spacing: var(--ls-body); }
  }
  @media (min-width: 768px) and (max-width: 1079px) {
    .footer__inner { grid-template-columns: 1fr; }
    .footer__cols { gap: var(--sp-4); }
  }
  @media (max-width: 767px) {
    .footer { padding-block: 48px 32px; }
    .footer__inner { grid-template-columns: 1fr; gap: 28px; }
    .footer__cols { grid-template-columns: 1fr 1fr; gap: 0 20px; }
    .footer__head { display: none; }
    .footer__col--follow { grid-column: 1 / -1; padding-top: var(--sp-2); }
    .footer__links a { display: flex; min-height: var(--tap-min); border-bottom: 1px solid var(--c-dark-line); }
  }

  /* ---------- Button ---------- */
  .btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: var(--btn-h); padding: 0 28px; border-radius: var(--r-pill); font-family: var(--ff-body); font-weight: 500; font-size: 15px; letter-spacing: .06em; text-decoration: none; white-space: nowrap; transition: background-color .3s var(--ease-out), color .3s var(--ease-out), transform .3s var(--ease-out); }
  .btn .icon { flex-shrink: 0; transition: transform .3s var(--ease-out); }
  .btn:hover .icon { transform: translate(2px, 0); }
  .btn--primary { background: var(--c-blue); color: #fff; }
  .btn--primary:hover { background: var(--c-blue-hover); }
  .btn--dark { background: var(--c-dark); color: #fff; }
  .btn--dark:hover { background: var(--c-ink); }
  .btn--white { background: var(--c-paper); color: var(--c-ink); border: 1px solid var(--c-line); }
  .btn--white:hover { background: #fff; }
  .btn--sm { min-height: var(--tap-min); padding-inline: 20px; font-size: 13px; }
  .btn--block { width: 100%; }
  @media (max-width: 767px) { .btn--sp-block { width: 100%; } }

  /* ---------- Text link ---------- */
  .textlink { display: inline-flex; align-items: center; gap: 8px; min-height: var(--tap-min); color: var(--c-ink); text-decoration: none; font-size: 14px; letter-spacing: .06em; }
  .textlink__label { position: relative; padding-bottom: 4px; }
  .textlink__label::after { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: currentColor; transition: transform .3s var(--ease-out); transform-origin: left; }
  .textlink:hover .textlink__label::after { transform: scaleX(1.06); }
  .textlink:hover { color: var(--c-blue); }
  .textlink .icon { width: 14px; height: 14px; }

  /* ---------- Section head ---------- */
  .section-head { display: flex; flex-direction: column; gap: 18px; }
  .section-head__lead { max-width: 40em; }
  @media (min-width: 1080px) { .section-head { gap: 20px; } }

  /* ---------- Breadcrumb ---------- */
  .breadcrumb { display: flex; flex-wrap: wrap; gap: 6px; font-size: 12px; color: var(--c-muted); letter-spacing: .04em; }
  .breadcrumb a { color: inherit; text-decoration: none; }
  .breadcrumb a:hover { color: var(--c-ink); text-decoration: underline; text-underline-offset: 4px; }
  .breadcrumb li + li::before { content: "/"; margin-right: 6px; }
  .breadcrumb [aria-current] { color: var(--c-ink-2); }
  @media (max-width: 767px) {
    .breadcrumb { flex-wrap: nowrap; }
    .breadcrumb li[aria-current] { flex: 1 1 0; min-width: 0; max-width: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; vertical-align: bottom; }
  }

  /* ---------- SubHero ---------- */
  .subhero { padding-block: var(--sp-4) var(--section-y); }
  .subhero__inner { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--grid-gap); row-gap: var(--sp-3); align-items: center; }
  .subhero__text { grid-column: span 6; display: flex; flex-direction: column; gap: var(--sp-3); }
  .subhero__text .breadcrumb { margin-bottom: var(--sp-2); }
  .subhero__actions { display: flex; flex-wrap: wrap; gap: var(--sp-2); align-items: center; padding-top: var(--sp-1); }
  .subhero__media { grid-column: 7 / span 6; }
  .subhero__media img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--r-img); }
  @media (max-width: 1079px) {
    .subhero__text, .subhero__media { grid-column: 1 / -1; }
    .subhero__media { order: 2; }
    .subhero__actions { order: 3; }
    .subhero__text { display: contents; }
    .subhero__text > * { grid-column: 1 / -1; }
    .subhero__inner > .breadcrumb, .subhero__text .breadcrumb { order: 0; }
  }
  @media (min-width: 768px) and (max-width: 1079px) { .subhero__media img { aspect-ratio: 16 / 9; max-height: 420px; } }
  @media (max-width: 767px) {
    .subhero { padding-block: var(--sp-4) var(--section-y); }
    .subhero__actions { flex-direction: column; align-items: stretch; }
    .subhero__actions .btn { width: 100%; }
    .subhero__actions .textlink { justify-content: center; }
  }

  /* ---------- Card ---------- */
  .card { background: var(--c-paper); border: 1px solid var(--c-line); border-radius: var(--r-card); padding: 32px; display: flex; flex-direction: column; gap: var(--sp-2); }
  @media (max-width: 767px) { .card { padding: 28px; } }
  .card h3 { font-size: var(--fs-h3); }
  .card__body { color: var(--c-ink-2); font-size: 14px; }
  .card__media { overflow: hidden; border-radius: var(--r-img); }
  .card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s var(--ease-out); }
  .card:hover .card__media img, a:hover > .card__media img { transform: scale(1.03); }

  /* ---------- Icon circle ---------- */
  .icon-circle { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 50%; background: var(--c-blue-tint); color: var(--c-blue); flex-shrink: 0; }
  .icon-circle svg { width: 22px; height: 22px; }
  @media (max-width: 767px) { .icon-circle { width: 44px; height: 44px; } }

  /* ---------- Chip ---------- */
  .chips { display: flex; flex-wrap: wrap; gap: 10px; }
  .chip { display: inline-flex; align-items: center; min-height: var(--tap-min); padding: 0 18px; border-radius: var(--r-pill); border: 1px solid var(--c-line); background: var(--c-paper); font-size: 14px; letter-spacing: .04em; color: var(--c-ink); }
  .chip--news { background: var(--c-blue-tint); border-color: transparent; color: var(--c-blue); }
  .chip--blog { background: var(--c-sage); border-color: transparent; color: var(--c-ink); }
  .chip--sm { min-height: 28px; padding-inline: 12px; font-size: 12px; }
  @media (max-width: 767px) { .chip { min-height: 40px; } }

  /* ---------- FAQ ---------- */
  .faq { border-top: 1px solid var(--c-line); }
  .faq__item { border-bottom: 1px solid var(--c-line); }
  .faq__q { width: 100%; min-height: 64px; padding: 20px 0; display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2); text-align: left; color: var(--c-ink); }
  .faq__q-text { display: flex; gap: 16px; align-items: baseline; }
  .faq__mark { font-family: var(--ff-serif); font-size: 20px; color: var(--c-blue); flex-shrink: 0; }
  .faq__title { font-weight: 500; font-size: 17px; line-height: 1.6; }
  .faq__icon { flex-shrink: 0; width: var(--tap-min); height: var(--tap-min); display: inline-flex; align-items: center; justify-content: center; margin-right: -12px; }
  .faq__icon svg { width: 18px; height: 18px; }
  .faq__icon .v { transition: transform .3s var(--ease-out); transform-origin: center; }
  .faq__q[aria-expanded="true"] .faq__icon .v { transform: scaleY(0); }
  .faq__a { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .4s var(--ease-out); }
  .faq__a > div { overflow: hidden; }
  .faq__a.is-open { grid-template-rows: 1fr; }
  .faq__a-inner { padding: 0 0 24px 34px; font-size: 15px; color: var(--c-ink-2); display: flex; flex-direction: column; gap: var(--sp-1); }
  @media (max-width: 767px) { .faq__title { font-size: 15px; } .faq__a-inner { padding-left: 0; font-size: 14px; } .faq__mark { font-size: 18px; } }

  /* ---------- Price card ---------- */
  .price-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--grid-gap); }
  .price-card { background: var(--c-paper); border: 1px solid var(--c-line); border-radius: var(--r-card); padding: 32px; display: flex; flex-direction: column; gap: var(--sp-3); }
  .price-card__name { font-family: var(--ff-display); font-size: 18px; color: var(--c-ink); }
  .price-card__price { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; color: var(--c-ink); }
  .price-card__amount { font-family: var(--ff-serif); font-size: clamp(36px, 3vw, 44px); line-height: 1; letter-spacing: 0; }
  .price-card__unit { font-size: 13px; color: var(--c-muted); }
  .price-card__desc { font-size: 14px; }
  .price-card__list { display: flex; flex-direction: column; gap: 10px; padding-top: var(--sp-2); border-top: 1px solid var(--c-line); }
  .price-card__list li { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; color: var(--c-ink); }
  @media (min-width: 1000px) and (max-width: 1199px) { .price-card { padding: 28px 24px; } .price-card__list li { font-size: 13px; } }
  .price-card__list svg { width: 18px; height: 18px; color: var(--c-blue); flex-shrink: 0; margin-top: 4px; }
  .price-card .btn { margin-top: auto; width: 100%; }
  .price-note { font-size: var(--fs-small); color: var(--c-muted); }
  @media (max-width: 999px) {
    .price-grid { display: flex; gap: var(--sp-2); overflow-x: auto; scroll-snap-type: x mandatory; padding-inline: var(--gutter); margin-inline: calc(var(--gutter) * -1); scrollbar-width: none; -webkit-overflow-scrolling: touch; }
    .price-grid::-webkit-scrollbar { display: none; }
    .price-card { flex: 0 0 300px; scroll-snap-align: start; scroll-snap-stop: always; padding: 28px; }
    .price-card:last-child { margin-right: var(--gutter); }
    .price-card__amount { font-size: 38px; }
  }
  .carousel-dots { display: flex; gap: 8px; justify-content: center; padding-top: var(--sp-2); }
  .carousel-dots span { width: 8px; height: 4px; border-radius: var(--r-pill); background: var(--c-line); transition: background .3s, width .3s; }
  .carousel-dots span.is-active { width: 24px; background: var(--c-ink); }
  @media (min-width: 1000px) { .carousel-dots { display: none; } }

  /* ---------- Spec table (dl) ---------- */
  .spec { border-top: 1px solid var(--c-line); }
  .spec__row { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: var(--sp-3); padding: 20px 0; border-bottom: 1px solid var(--c-line); }
  .spec dt { font-weight: 500; color: var(--c-ink); font-size: 14px; }
  .spec dd { font-size: 15px; color: var(--c-ink-2); }
  @media (min-width: 1080px) and (max-width: 1279px) { .spec__row { grid-template-columns: 140px minmax(0, 1fr); } }
  @media (max-width: 767px) { .spec__row { grid-template-columns: 1fr; gap: 6px; padding: 16px 0; } .spec dd { font-size: 14px; } }
  .section--band .spec, .section--band .spec__row { border-color: var(--c-sage-line); }

  /* ---------- CTA section ---------- */
  .cta { padding-block: var(--section-y); border-top: 1px solid var(--c-line); position: relative; overflow: hidden; }
  .cta__inner { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--sp-4) 80px; position: relative; }
  .cta__text { display: flex; flex-direction: column; gap: var(--sp-3); }
  .cta__title { font-size: clamp(30px, 3.6vw, 52px); line-height: 1.3; }
  .cta__link { display: inline-flex; align-items: center; gap: var(--sp-3); text-decoration: none; color: var(--c-ink); font-size: 15px; letter-spacing: .06em; }
  .cta__circle { width: 112px; height: 112px; border-radius: 50%; background: var(--c-blue); color: #fff; display: inline-flex; align-items: center; justify-content: center; transition: background .3s var(--ease-out), transform .3s var(--ease-out); }
  .cta__circle .icon { width: 28px; height: 28px; }
  .cta__link:hover .cta__circle { background: var(--c-blue-hover); transform: scale(1.04); }
  .cta__label { display: inline-flex; align-items: center; gap: 8px; }
  .cta__btn { display: none; }
  .cta__deco { position: absolute; right: 0; bottom: 0; width: 220px; color: var(--c-muted); opacity: .45; pointer-events: none; }
  @media (min-width: 1080px) { .cta__inner { padding-bottom: 120px; } .cta__link { align-self: start; } }
  @media (max-width: 1079px) { .cta__deco { display: none; } }
  @media (min-width: 768px) and (max-width: 1079px) { .cta__inner { grid-template-columns: 1fr; } .cta__link { justify-self: start; } }
  @media (max-width: 767px) {
    .cta__inner { grid-template-columns: 1fr; gap: var(--sp-3); }
    .cta__link { display: none; }
    .cta__btn { display: inline-flex; margin-top: var(--sp-1); }
  }

  /* ---------- Numbered feature (トップ WHAT WE DO 等) ---------- */
  .feature { display: flex; flex-direction: column; gap: var(--sp-2); }
  .feature__head { display: flex; gap: 14px; align-items: baseline; }
  .feature__num { font-family: var(--ff-serif); font-size: 22px; line-height: 1; color: var(--c-ink); }
  .feature__body { display: flex; flex-direction: column; gap: 8px; }
  .feature__body .label { font-size: 10px; }
  .feature__desc { font-size: 14px; }

  /* ---------- Steps ---------- */
  .steps { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--grid-gap); counter-reset: step; }
  .step { border-top: 2px solid var(--c-ink); padding-top: var(--sp-3); display: flex; flex-direction: column; gap: 12px; counter-increment: step; }
  .step:first-child { border-top-color: var(--c-blue); }
  .step__num { color: var(--c-blue); }
  .step h3 { font-size: 17px; }
  .step p { font-size: 14px; }
  @media (min-width: 768px) and (max-width: 1079px) { .steps { gap: var(--sp-2); } .step h3 { font-size: 15px; } }
  @media (max-width: 767px) {
    .steps { grid-template-columns: 1fr; gap: 0; }
    .step { border-top: 0; padding: 0 0 var(--sp-4) 52px; position: relative; }
    .step::before { content: ""; position: absolute; left: 17px; top: 36px; bottom: 0; width: 1px; background: var(--c-line); }
    .step::after { content: counter(step); position: absolute; left: 0; top: 0; width: 36px; height: 36px; border-radius: 50%; background: var(--c-ink); color: #fff; font-family: var(--ff-serif); font-size: 16px; line-height: 1; display: inline-flex; align-items: center; justify-content: center; }
    .step:first-child::after { background: var(--c-blue); }
    .step__num { display: none; }
    .step:last-child::before { display: none; }
  }

  /* ---------- Icon row (SP 横並び) ---------- */
  .icon-row { display: flex; gap: var(--sp-2); align-items: flex-start; }

  /* ---------- Form ---------- */
  .field { display: flex; flex-direction: column; gap: 8px; }
  .field__label { font-weight: 500; color: var(--c-ink); font-size: 14px; display: flex; align-items: center; gap: 8px; }
  .req { font-size: 11px; color: var(--c-blue); font-weight: 500; letter-spacing: .1em; }
  .opt { font-size: 11px; color: var(--c-muted); letter-spacing: .1em; }
  .input, .select, .textarea { width: 100%; min-height: 52px; padding: 12px 16px; background: var(--c-paper); border: 1px solid var(--c-line); border-radius: var(--r-field); color: var(--c-ink); transition: border-color .2s var(--ease-out), box-shadow .2s var(--ease-out); }
  .textarea { min-height: 180px; resize: vertical; }
  .input:focus, .select:focus, .textarea:focus { outline: none; border-color: var(--c-blue); box-shadow: 0 0 0 3px var(--c-blue-tint); }
  .input[aria-invalid="true"], .textarea[aria-invalid="true"] { border-color: #B3261E; }
  .field__error { font-size: 13px; color: #B3261E; }
  .select { appearance: none; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%231C201E' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'><path d='M6 9l6 6 6-6'/></svg>"); background-repeat: no-repeat; background-position: right 16px center; padding-right: 44px; }
  .radios { display: flex; flex-direction: column; gap: 10px; }
  .radio { display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 0 16px; background: var(--c-paper); border: 1px solid var(--c-line); border-radius: var(--r-field); cursor: pointer; transition: background .2s, border-color .2s; }
  .radio:has(input:checked) { background: #EEF2FB; border-color: var(--c-blue); }
  .radio input { width: 18px; height: 18px; accent-color: var(--c-blue); margin: 0; }
  .check { display: flex; align-items: flex-start; gap: 12px; min-height: var(--tap-min); font-size: 14px; color: var(--c-ink); cursor: pointer; }
  .check input { width: 18px; height: 18px; accent-color: var(--c-blue); margin: 3px 0 0; flex-shrink: 0; }
  .check a { color: var(--c-blue); }
  .field:has(.field__error:not([hidden])) .radio { border-color: #B3261E; }

  /* ---------- Contact Form 7（WordPress）: プラグインのマークアップを .radio / .check / .field__error に寄せる ---------- */
  .wpcf7 .wpcf7-form-control-wrap { display: block; }
  .wpcf7 .wpcf7-radio { display: flex; flex-direction: column; gap: 10px; }
  .wpcf7 .wpcf7-list-item { display: block; margin: 0; }
  .wpcf7 .wpcf7-radio label { display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 0 16px; background: var(--c-paper); border: 1px solid var(--c-line); border-radius: var(--r-field); cursor: pointer; transition: background .2s, border-color .2s; }
  .wpcf7 .wpcf7-radio label:has(input:checked) { background: #EEF2FB; border-color: var(--c-blue); }
  .wpcf7 .wpcf7-radio input { width: 18px; height: 18px; accent-color: var(--c-blue); margin: 0; }
  .wpcf7 .wpcf7-acceptance label { display: flex; align-items: flex-start; gap: 12px; min-height: var(--tap-min); font-size: 14px; color: var(--c-ink); cursor: pointer; }
  .wpcf7 .wpcf7-acceptance input { width: 18px; height: 18px; accent-color: var(--c-blue); margin: 3px 0 0; flex-shrink: 0; }
  .wpcf7 .wpcf7-acceptance a { color: var(--c-blue); }
  .wpcf7 .wpcf7-not-valid-tip { display: block; margin-top: 8px; font-size: 13px; color: #B3261E; }
  .wpcf7 .wpcf7-not-valid { border-color: #B3261E; }
  .wpcf7 .wpcf7-submit { width: 100%; min-height: 56px; border: 0; cursor: pointer; }
  .wpcf7 .wpcf7-spinner { display: block; margin: 8px auto 0; }
  .wpcf7 .wpcf7-response-output { margin: 0; padding: 16px 20px; border: 1px solid var(--c-line); border-radius: var(--r-field); background: var(--c-sage); font-size: 14px; color: var(--c-ink); }
  .wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.failed .wpcf7-response-output { background: #FBEDEB; border-color: #B3261E; }
  .wpcf7 form.sent .wpcf7-response-output { background: var(--c-blue-tint); border-color: var(--c-blue); }
  .wpcf7 form.wpcf7-form { display: flex; flex-direction: column; gap: 28px; }
  .wpcf7 form.wpcf7-form > p:empty { display: none; }
}