.certificate-note{
  display:grid;
  grid-template-columns:minmax(280px,.92fr) minmax(0,1.08fr);
  align-items:center;
  gap:clamp(2rem,6vw,7rem);
  background:#f7f8f4;
  border-bottom:1px solid var(--line);
}
.certificate-preview{
  position:relative;
  display:block;
  overflow:hidden;
  background:#fff;
  box-shadow:0 18px 55px rgba(23,33,29,.13);
  text-decoration:none;
}
.certificate-preview img{display:block;width:100%;height:auto;transition:transform .4s ease}
.certificate-preview span{
  position:absolute;
  right:1rem;
  bottom:1rem;
  padding:.65rem .85rem;
  background:rgba(23,33,29,.92);
  color:#fff;
  font-size:.8rem;
  font-weight:800;
}
.certificate-preview:hover img,.certificate-preview:focus-visible img{transform:scale(1.015)}
.certificate-copy{max-width:690px}
.certificate-copy h2{font-size:clamp(2.25rem,4.5vw,5.1rem)}
.certificate-copy>p:not(.eyebrow){max-width:610px;color:var(--muted);font-size:clamp(1rem,1.2vw,1.15rem)}
.certificate-number{margin:1.6rem 0 .7rem;padding-left:1rem;border-left:4px solid var(--orange)}
.certificate-number strong{color:var(--ink);font-size:clamp(1rem,1.5vw,1.25rem)}
.certificate-actions{display:flex;align-items:center;gap:1.2rem;margin-top:1.7rem}
.certificate-button{flex:0 0 auto;background:var(--ink);color:#fff}
.certificate-actions p{max-width:245px;margin:0;color:var(--muted);font-size:.82rem;line-height:1.4}
@media(max-width:900px){
  .certificate-note{grid-template-columns:1fr;gap:2.5rem}
  .certificate-preview{max-width:680px}
}
@media(max-width:560px){
  .certificate-actions{align-items:flex-start;flex-direction:column}
  .certificate-button{width:100%;text-align:center}
}