/* Exact current Produce award component, scoped for the four service pages. */
.service-proof { --gold:#b9933f; --gold-d:#e7cb84; --gold-dl:rgba(231,203,132,.4); --muted:#8b8d96; font-family:var(--sans); font-size:16px; line-height:normal; text-align:left; letter-spacing:normal; scroll-margin-top:72px; }
.service-proof, .service-proof * { box-sizing:content-box; }
.service-proof > .wrap { width:auto; }
.service-proof h2, .service-proof h3, .service-proof p { text-align:left; letter-spacing:normal; }
.service-proof h3 { font-family:var(--sans); text-wrap:initial; }
.service-proof h3::before { content:none; }
.service-proof{
  position:static;
  overflow:visible;
  padding:72px 0 78px;
  border:0;
  background:#F1F2F4;
  color:#101116;
}
.service-proof::before,
.service-proof::after{
  content:none;
}
.service-proof > .wrap{
  max-width:980px;
  margin:0 auto;
  padding:0 40px;
}
.service-proof .inner{
  position:static;
  z-index:auto;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  color:inherit;
}
.service-proof .achievement-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  margin:0 0 18px;
  padding:0 0 18px;
  border:0;
  border-bottom:1px solid #CFCFD4;
}
.service-proof .achievement-head .title{
  display:block;
  padding:0;
  background:transparent;
  color:inherit;
}
.service-proof .achievement-head .title::before{
  display:none;
}
.service-proof .lbl{
  display:flex;
  align-items:baseline;
  gap:16px;
  margin-bottom:36px;
}
.service-proof .lbl .no{
  color:#C6C7CD;
  font-size:2rem;
  font-weight:300;
  line-height:1;
  letter-spacing:.04em;
}
.service-proof .lbl .tag{
  color:var(--muted);
  font-size:.7rem;
  font-weight:700;
  letter-spacing:.4em;
  margin:0;
  padding:0;
  border-radius:0;
  text-transform:uppercase;
}
.service-proof .achievement-head h2{
  margin:0;
  color:#101116;
  font-family:var(--bold);
  font-size:clamp(1.35rem,2.2vw,1.8rem);
  font-weight:700;
  line-height:1.35;
}
.service-proof .achievement-subtitle{
  max-width:42em;
  margin:10px 0 0;
  color:#5F6169;
  font-size:.84rem;
  line-height:1.8;
}
.service-proof .achievement-emblem{
  display:none;
}
.service-proof .awards{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
  margin:0;
}
.service-proof .award{
  display:grid;
  grid-template-columns:54px minmax(0,1fr);
  gap:20px;
  align-items:center;
  min-height:82px;
  box-sizing:border-box;
  padding:17px 22px;
  border:1px solid #D9DADE;
  border-radius:2px;
  background:#FFFFFF;
  color:#101116;
  font-size:.95rem;
}
.service-proof .award .pf{
  min-width:0;
  color:#B8BAC1;
  font-size:1.4rem;
  font-weight:700;
  line-height:1;
  letter-spacing:.02em;
}
.service-proof .award h3{
  margin:0;
  color:#101116;
  font-size:1.02rem;
  font-weight:700;
  line-height:1.55;
}
.service-proof .award h3 .secondary{
  color:#5F6169;
  font-size:.82em;
  font-weight:500;
}
.service-proof .award p{
  margin:4px 0 0;
  color:#666872;
  font-size:.78rem;
  line-height:1.6;
}

@media (max-width:760px){
  .service-proof > .wrap{
    padding:0 22px;
  }
}

@media (min-width:761px){
  .service-proof{
    position:relative;
    overflow:clip;
    padding:68px 0 72px;
    border-top:6px solid #111114;
    border-bottom:6px solid #111114;
    background:
      linear-gradient(118deg,#0C0C0F 0 23%,#27282B 23.2% 28%,#0E0F11 28.2% 33%,#68696C 33.2% 39%,#D4D4D4 39.2% 100%);
    color:#101116;
  }
  .service-proof::before{
    content:"";
    position:absolute;
    top:-38%;
    left:22%;
    width:190px;
    height:176%;
    border:34px solid rgba(255,255,255,.16);
    border-left-color:rgba(0,0,0,.5);
    border-radius:50%;
    transform:rotate(-9deg);
    pointer-events:none;
  }
  .service-proof::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(90deg,rgba(0,0,0,.14),transparent 46%,rgba(255,255,255,.2));
    pointer-events:none;
  }
  .service-proof .inner{
    position:relative;
    z-index:1;
  }
  .service-proof .achievement-head{
    align-items:center;
    justify-content:flex-start;
    margin:0 0 12px;
    padding:0;
    border:0;
  }
  .service-proof .achievement-head .title{
    color:#FFFFFF;
  }
  .service-proof .achievement-head .title .lbl{
    margin:0 0 24px;
  }
  .service-proof .achievement-head .title .lbl .no,
  .service-proof .achievement-head .title .lbl .tag{
    color:#D4D5D8;
  }
  .service-proof .achievement-head h2{
    color:#FFFFFF;
    font-size:clamp(1.65rem,2.9vw,2.25rem);
    line-height:1.45;
  }
  .service-proof .achievement-subtitle{
    color:#D4D5D8;
  }
  .service-proof .achievement-title-row{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:22px;
    flex-wrap:wrap;
  }
  .service-proof .awards{
    gap:10px;
  }
  .service-proof .award-row{
    display:grid;
    grid-template-columns:102px minmax(0,1fr);
    gap:16px;
    align-items:stretch;
  }
  .service-proof .metric-card{
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    width:100%;
    min-height:0;
    aspect-ratio:1 / 1;
    box-sizing:border-box;
    padding:8px 6px;
    border:1px solid rgba(231,203,132,.66);
    background:linear-gradient(145deg,#FFFFFF 0%,rgba(231,203,132,.22) 100%);
    background-color:#FFFFFF;
    color:#111114;
    text-align:center;
    box-shadow:0 8px 20px -16px rgba(0,0,0,.7);
  }
  .service-proof .metric-card .metric-label{
    display:block;
    margin-bottom:3px;
    font-size:.75rem;
    font-weight:700;
    line-height:1.25;
  }
  .service-proof .metric-card .metric-sub{
    display:block;
    font-size:.625rem;
    line-height:1.15;
  }
  .service-proof .metric-card .metric-value{
    display:block;
    font-family:var(--bold);
    font-size:1.62rem;
    font-weight:700;
    line-height:1.05;
    letter-spacing:-.04em;
  }
  .service-proof .metric-card .metric-value small{
    font-size:.625rem;
    letter-spacing:0;
  }
  .service-proof .metric-card .metric-before{
    font-size:.78rem;
    font-weight:700;
    line-height:1;
  }
  .service-proof .metric-card .metric-arrow{
    display:inline-block;
    margin:0 2px;
    font-size:.75rem;
    font-weight:700;
  }
  .service-proof .award{
    grid-template-columns:74px minmax(0,1fr);
    gap:0;
    align-items:stretch;
    min-height:88px;
    padding:0;
    border:1px solid rgba(231,203,132,.52);
    border-radius:0;
    background:linear-gradient(90deg,rgba(231,203,132,.28) 0,#F7F7F7 18%,#E2E2E2 100%);
    background-color:#F7F7F7;
    color:#111114;
    box-shadow:0 8px 20px -16px rgba(0,0,0,.7);
  }
  .service-proof .award .pf{
    display:grid;
    place-items:center;
    min-width:0;
    border-right:1px solid rgba(231,203,132,.42);
    background:linear-gradient(135deg,#09090B,#1B1915);
    color:var(--gold-d);
    font-family:var(--bold);
    font-size:2.05rem;
    font-weight:700;
    line-height:1;
    text-shadow:0 2px 4px rgba(0,0,0,.24);
  }
  .service-proof .award .award-copy{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:12px 18px;
  }
  .service-proof .award h3{
    color:#111114;
    font-size:1rem;
    line-height:1.45;
  }
  .service-proof .award p{
    margin:3px 0 0;
    color:#34353A;
    font-size:.75rem;
    line-height:1.5;
  }
  .service-proof .achievement-emblem{
    position:relative;
    display:grid;
    grid-template-columns:62px minmax(0,1fr);
    align-items:center;
    justify-items:center;
    justify-content:center;
    gap:14px;
    min-width:224px;
    min-height:88px;
    box-sizing:border-box;
    padding:11px 22px 11px 17px;
    overflow:hidden;
    border:1px solid var(--gold-d);
    border-radius:0;
    background:
      linear-gradient(112deg,rgba(231,203,132,.18) 0%,transparent 28%,transparent 68%,rgba(231,203,132,.08) 100%),
      linear-gradient(135deg,#09090B 0%,#1B1915 48%,#09090B 100%);
    color:var(--gold-d);
    clip-path:polygon(8px 0,calc(100% - 8px) 0,100% 8px,100% calc(100% - 8px),calc(100% - 8px) 100%,8px 100%,0 calc(100% - 8px),0 8px);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 16px 28px -18px rgba(0,0,0,.96);
  }
  .service-proof .achievement-emblem::before{
    content:"";
    position:absolute;
    inset:5px;
    border:1px solid rgba(231,203,132,.42);
    clip-path:polygon(5px 0,calc(100% - 5px) 0,100% 5px,100% calc(100% - 5px),calc(100% - 5px) 100%,5px 100%,0 calc(100% - 5px),0 5px);
    pointer-events:none;
  }
  .service-proof .achievement-emblem::after{
    content:"";
    position:absolute;
    top:15px;
    bottom:15px;
    left:82px;
    width:1px;
    background:linear-gradient(180deg,transparent,rgba(231,203,132,.72),transparent);
    pointer-events:none;
  }
  .service-proof .achievement-emblem-mark{
    position:relative;
    z-index:1;
    display:block;
    width:58px;
    height:58px;
    flex:none;
    fill:none;
    stroke:currentColor;
    stroke-width:1.4;
    stroke-linecap:round;
    stroke-linejoin:round;
    filter:drop-shadow(0 4px 8px rgba(185,147,63,.28));
  }
  .service-proof .achievement-emblem-copy{
    position:relative;
    z-index:1;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:5px;
    text-align:center;
  }
  .service-proof .achievement-emblem-count{
    color:var(--gold-d);
    font-family:var(--bold);
    font-size:1.66rem;
    font-weight:700;
    line-height:1;
    letter-spacing:.06em;
    white-space:nowrap;
  }
  .service-proof .achievement-emblem-label{
    color:#F2E3B9;
    font-size:.5rem;
    font-weight:700;
    line-height:1;
    letter-spacing:.2em;
    white-space:nowrap;
  }
}


/* 制作実績への共通リンク（TOPと同じ右下配置） */
.service-proof .works-details{ margin-top:24px; text-align:right; font-size:.84rem; }
.service-proof .works-details a{ display:inline-block; padding:8px 0; color:#101116; text-decoration:underline; text-underline-offset:5px; }
.service-proof .works-details a:focus-visible{ outline:2px solid currentColor; outline-offset:5px; }