/* Shared premium detail layout (skill / worker / product / job) */
html {
      scroll-behavior: smooth;
    }

    .section-nav {
      position: sticky;
      top: var(--tasu-banner-height);
      z-index: 9990;
      margin-bottom: 0;
      background: #fff;
      border-bottom: 1px solid #ececec;
    }

  .skill-detail-wrap {
    margin-top: 20px;
  }

  .skill-detail-main > .skill-hero-section {
    margin-top: 4px;
  }

  .skill-section-spaced {
    margin-bottom: 1.35rem;
  }

  .cta-consult {
    height: 54px;
    min-height: 54px;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
    box-shadow:
      0 2px 8px rgba(168, 139, 58, 0.28),
      0 1px 2px rgba(0, 0, 0, 0.06);
    transition:
      transform 0.22s ease,
      box-shadow 0.22s ease,
      background-color 0.2s ease;
  }

  .cta-consult:hover {
    transform: translateY(-2px);
    box-shadow:
      0 10px 24px rgba(168, 139, 58, 0.38),
      0 2px 6px rgba(0, 0, 0, 0.08);
  }

  .review-card-premium {
    border: 1px solid rgba(0, 0, 0, 0.05);
    background: linear-gradient(180deg, #fff 0%, #fafaf8 100%);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
    transition:
      transform 0.22s ease,
      box-shadow 0.22s ease,
      border-color 0.22s ease;
  }

  .review-card-premium:hover {
    transform: translateY(-2px);
    border-color: rgba(193, 168, 88, 0.22);
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.07);
  }

  .related-service-card {
    display: block;
    overflow: hidden;
    border-radius: 0.75rem;
    border: 1px solid rgba(0, 0, 0, 0.06);
    background: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
    transition:
      transform 0.22s ease,
      box-shadow 0.22s ease,
      border-color 0.22s ease;
  }

  .related-service-card:hover {
    transform: translateY(-3px);
    border-color: rgba(193, 168, 88, 0.2);
    box-shadow: 0 10px 26px rgba(0, 0, 0, 0.08);
  }

  .related-service-card__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.75rem;
    margin-top: 0.5rem;
    font-size: 10px;
    color: #9ca3af;
  }

  .related-service-card__meta span {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
  }

  .related-service-card__price {
    margin-top: 0.35rem;
    font-size: 0.875rem;
    font-weight: 800;
    color: #d4a63a;
    text-shadow: 0 0 12px rgba(255, 231, 163, 0.4);
  }

  @media (prefers-reduced-motion: reduce) {
    .cta-consult:hover,
    .review-card-premium:hover,
    .related-service-card:hover {
      transform: none;
    }
  }

    .section-nav__inner {
      display: flex;
      align-items: stretch;
      gap: 0;
      max-width: 1400px;
      margin: 0 auto;
      padding: 0 1rem;
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: none;
    }

    .section-nav__inner::-webkit-scrollbar {
      display: none;
    }

    .section-nav__link {
      flex-shrink: 0;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      height: 60px;
      padding: 0 1.125rem;
      font-size: 0.875rem;
      line-height: 1.2;
      color: #6b7280;
      text-decoration: none;
      white-space: nowrap;
      border-bottom: 2px solid transparent;
      transition: color 0.15s ease, border-color 0.15s ease;
    }

    .section-nav__link:hover {
      color: #374151;
    }

    .section-nav__link.is-active {
      color: #1f2937;
      font-weight: 600;
      border-bottom-color: #c1a858;
    }

    .section-anchor {
      scroll-margin-top: calc(var(--tasu-banner-height) + 4.5rem);
    }

    .member-plate {
      display: flex;
      align-items: center;
      gap: 6px;
      min-height: 54px;
      width: min(408px, 100%);
      max-width: 100%;
      padding: 6px 24px 6px 4px;
      background: linear-gradient(
        135deg,
        #b8c0cc 0%,
        #eef2f7 35%,
        #ffffff 50%,
        #d8dee8 70%,
        #aeb7c3 100%
      );
      border: 1px solid rgba(148, 163, 184, 0.4);
      clip-path: polygon(
        0 0,
        calc(100% - 22px) 0,
        100% 50%,
        calc(100% - 22px) 100%,
        0 100%
      );
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.9),
        inset 0 -1px 0 rgba(148, 163, 184, 0.1),
        0 1px 4px rgba(15, 23, 42, 0.06);
    }

    .member-badge {
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: flex-start;
      width: 48px;
      height: 48px;
      padding-right: 4px;
      margin-right: 0;
      border-right: 1px solid rgba(148, 163, 184, 0.28);
    }

    .member-badge__img {
      display: block;
      width: auto;
      height: 46px;
      max-height: 48px;
      max-width: 48px;
      object-fit: contain;
    }

    .member-info {
      display: flex;
      flex-direction: column;
      justify-content: center;
      min-width: 0;
      flex: 1;
    }

    .member-rank {
      margin: 0;
      font-size: 10px;
      letter-spacing: 0.28em;
      font-weight: 700;
      color: #64748b;
      text-transform: uppercase;
    }

    .member-name {
      margin: 3px 0 0;
      font-size: 26px;
      font-weight: 900;
      line-height: 1.05;
      color: #1e293b;
    }

    @media (max-width: 1023px) {
      .member-plate {
        width: 100%;
        min-height: 54px;
        padding: 7px 18px 7px 4px;
        gap: 5px;
        clip-path: polygon(
          0 0,
          calc(100% - 18px) 0,
          100% 50%,
          calc(100% - 18px) 100%,
          0 100%
        );
      }

      .member-badge {
        width: 50px;
        height: 48px;
        padding-right: 6px;
      }

      .member-badge__img {
        height: 48px;
        max-height: 52px;
        max-width: 50px;
      }

      .member-name {
        font-size: 22px;
      }
    }

    .seller-header {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 0.25rem;
      width: 100%;
    }

    .seller-status {
      width: 100%;
    }

    .seller-aligned {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 0.5rem;
      margin-top: 0;
      width: 100%;
    }

    .seller-tags {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      width: 100%;
      margin: 9px 0 8px;
      padding: 0;
    }

    .seller-main-col {
      flex: 1 1 0%;
      min-width: 0;
      width: 100%;
    }

    .seller-stats-wrap {
      width: 100%;
      max-width: 900px;
    }

    .seller-stats-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(140px, 1fr));
      border-radius: 0.5rem;
      overflow: hidden;
      border: 1px solid rgba(226, 232, 240, 0.8);
      background: linear-gradient(to bottom, rgba(248, 250, 252, 0.8), #fff);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
    }

    .seller-stat {
      padding: 0.625rem 1rem 0.75rem;
      text-align: center;
    }

    .seller-stat + .seller-stat {
      border-left: 1px solid rgba(226, 232, 240, 0.6);
    }

    .seller-stat__label {
      margin: 0;
      font-size: 11px;
      font-weight: 400;
      color: #9ca3af;
    }

    .seller-stat__value {
      margin: 0.375rem 0 0;
      font-size: 1.125rem;
      font-weight: 800;
      line-height: 1.2;
      color: #d4a63a;
      text-shadow: 0 0 14px rgba(255, 231, 163, 0.42);
    }

    .seller-stat--rating {
      background: linear-gradient(to bottom, rgba(255, 251, 235, 0.7), rgba(255, 251, 235, 0.3));
    }

    .seller-stat__rating {
      margin: 0.375rem 0 0;
      font-size: 1.25rem;
      font-weight: 800;
      line-height: 1.2;
      color: #d4a63a;
      text-shadow: 0 0 14px rgba(255, 231, 163, 0.42);
    }

    .seller-stat__stars {
      margin-left: 0.25rem;
      font-size: 0.875rem;
      letter-spacing: 0.04em;
      color: #f4d06f;
      text-shadow: 0 0 12px rgba(255, 231, 163, 0.4);
    }

    .seller-stat__count {
      display: block;
      margin-top: 0.125rem;
      font-size: 11px;
      font-weight: 400;
      color: #9ca3af;
    }

    .seller-cards-grid {
      display: grid;
      width: 100%;
      max-width: 900px;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0.75rem;
      margin-top: 10px;
    }

    @media (min-width: 640px) {
      .seller-cards-grid {
        grid-template-columns: repeat(4, minmax(120px, 1fr));
      }
    }

    @media (max-width: 639px) {
      .seller-stats-grid {
        grid-template-columns: 1fr;
      }

      .seller-stat + .seller-stat {
        border-left: none;
        border-top: 1px solid rgba(226, 232, 240, 0.6);
      }
    }

    @media (min-width: 1024px) {
      .seller-avatar-slot {
        width: 120px;
        max-width: 120px;
      }

      .seller-actions-col {
        margin-top: 25px;
      }

      .seller-actions-col a,
      .seller-actions-col button {
        height: 54px;
        min-height: 54px;
        line-height: 1;
        box-sizing: border-box;
      }
    }

/* =============================================================================
   スマホ / ベンチ iframe — 固定CTA と section-nav の重なり防止（全 premium 詳細共通）
   ============================================================================= */
@media (max-width: 960px) {
  body[data-detail-page="1"]:not(.tasu-mdetail-page) .section-nav,
  body[data-detail-page="1"]:not(.tasu-mdetail-page) nav.section-nav,
  body[data-detail-page="1"]:not(.tasu-mdetail-page) .tasu-banner,
  body[data-detail-page="1"]:not(.tasu-mdetail-page) .page-subheader {
    display: none !important;
  }

  body[data-detail-page="1"] .skill-hero-premium__cta,
  body[data-detail-page="1"] [data-tasu-mdetail-cta-dock],
  body[data-detail-page="1"] .tasu-mdetail-cta-dock,
  body[data-detail-page="1"] .shop-mobile-inquiry-dock {
    z-index: 10050;
    pointer-events: auto;
  }

  body[data-detail-page="1"] .skill-cta-panel__primary,
  body[data-detail-page="1"] [data-listing-primary-cta],
  body[data-detail-page="1"] .tasu-mdetail-cta-dock__btn,
  body[data-detail-page="1"] .tasu-mdetail-hero__apply,
  body[data-detail-page="1"] .shop-mobile-inquiry-dock__btn {
    position: relative;
    z-index: 1;
    pointer-events: auto;
  }
}