/* "Sertifika Kazan" kutusu (parts/sertifika-kutu.php): koyu kart, temsili belge, türe göre rozet, üstüne gelince
   belge kalkar · rozet döner · ışık geçer. Kart her iki temada da koyu. */
.srk{--r1:#f2b632;--r2:#c98a12;--r3:#a8730f;position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,380px);gap:32px;align-items:center;padding:32px 36px;border-radius:22px;border:1px solid rgba(255,255,255,.08);background:radial-gradient(120% 140% at 100% 0%,rgba(242,182,50,.14),transparent 55%),#141414;color:#f3f3f3;overflow:hidden;isolation:isolate}
.srk-video{--r1:#5aa2ff;--r2:#2f6fd6;--r3:#2459ad}
.srk-etkinlik{--r1:#3fd29a;--r2:#1f9c6c;--r3:#167a54}
.srk-video{background:radial-gradient(120% 140% at 100% 0%,rgba(90,162,255,.13),transparent 55%),#141414}
.srk-etkinlik{background:radial-gradient(120% 140% at 100% 0%,rgba(63,210,154,.12),transparent 55%),#141414}
.srk-yazi{display:flex;gap:16px;align-items:flex-start}
.srk-yazi>div{display:grid;gap:10px;justify-items:start}
.srk-ik{flex:none;width:44px;height:44px;display:grid;place-items:center;border-radius:12px;background:color-mix(in srgb,var(--r1) 18%,transparent);color:var(--r1)}
.srk h2{margin:0;font:800 24px/1.2 Manrope,system-ui,sans-serif;letter-spacing:-.01em;color:#fff}
.srk-yazi p{margin:0;max-width:440px;color:rgba(255,255,255,.72);font-size:15px;line-height:1.6}

/* Temsili belge */
.srk-sahne{perspective:900px;display:grid;justify-items:end}
.srk-kagit{position:relative;width:100%;max-width:360px;aspect-ratio:1.42;padding:22px 24px;display:flex;flex-direction:column;gap:4px;border-radius:12px;background:linear-gradient(160deg,#232323,#191919);border:1px solid rgba(255,255,255,.1);box-shadow:inset 0 0 0 6px #1b1b1b,inset 0 0 0 7px rgba(255,255,255,.06),0 18px 40px rgba(0,0,0,.45);color:#ededed;transform:rotate(-2.5deg);transition:transform .5s cubic-bezier(.2,.8,.2,1),box-shadow .5s ease;overflow:hidden}
.srk-kagit::after{content:"";position:absolute;inset:-40% auto -40% -60%;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.14),transparent);transform:skewX(-18deg);transition:left .9s ease;pointer-events:none}
.srk-yay{position:absolute;top:0;right:0;width:46%;color:rgba(255,255,255,.08)}
.srk-logo{display:flex;align-items:center;gap:4px;font:800 17px/1 Manrope,system-ui,sans-serif;letter-spacing:-.02em;color:#fff;margin-bottom:12px}
.srk-logo i{width:2px;height:16px;background:currentColor;opacity:.7}
.srk-logo b{font-weight:500;color:var(--r1)}
.srk-etiket{font:700 8.5px/1.4 Manrope,system-ui,sans-serif;letter-spacing:.22em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.srk-ad{font:800 17px/1.25 Manrope,system-ui,sans-serif;color:#fff;margin-top:6px;max-width:80%;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.srk-alt{font-size:10.5px;color:rgba(255,255,255,.6)}
.srk-imza{width:64px;margin-top:auto;color:rgba(255,255,255,.75)}
.srk-cizgi{width:46%;height:1px;background:rgba(255,255,255,.18)}
.srk-veren{font:600 8.5px/1.4 Manrope,system-ui,sans-serif;color:rgba(255,255,255,.5)}

/* Rozet */
.srk-rozet{position:absolute;right:18px;bottom:10px;width:56px;height:70px;transition:transform .6s cubic-bezier(.2,.8,.2,1);filter:drop-shadow(0 6px 10px rgba(0,0,0,.45))}
.srk-rozet>svg:first-child{width:100%;height:100%;display:block}
.srk-serit{fill:var(--r3)}
.srk-dis{fill:var(--r1)}
.srk-ic{fill:var(--r2);stroke:color-mix(in srgb,var(--r1) 60%,#fff);stroke-width:1.5}
.srk-isaret{position:absolute;left:16px;top:12px;width:24px;height:24px;color:#fff}

/* Üstüne gelince */
.srk:hover .srk-kagit,.srk:focus-within .srk-kagit{transform:rotate(0) translateY(-8px) scale(1.03);box-shadow:inset 0 0 0 6px #1b1b1b,inset 0 0 0 7px rgba(255,255,255,.08),0 30px 60px rgba(0,0,0,.55)}
.srk:hover .srk-kagit::after{left:130%}
.srk:hover .srk-rozet{transform:rotate(-14deg) scale(1.1)}
@media (prefers-reduced-motion:reduce){.srk-kagit,.srk-rozet,.srk-kagit::after{transition:none}}

@media (max-width:760px){
	.srk{grid-template-columns:1fr;padding:24px}
	.srk-sahne{justify-items:center}
	.srk-kagit{max-width:320px}
}
