/* Kemet Product Card v2.3 */
.kemet-deltic{ --blue:#2f73b6; --blue-dark:#1d3f5e; --pill:#cfe7a6; --title:#e14a2e; --text:#0f172a; --muted:#667085; --shadow:0 10px 25px rgba(0,0,0,.08);
  color:var(--text); background:#fff; border-radius:14px; box-shadow:var(--shadow); overflow:hidden; font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Tajawal", sans-serif;}
.kd-topline{height:4px;background:linear-gradient(90deg,#1c3d5b 0%, #2f73b6 50%, #9cc8ef 100%)}
.kd-header{display:flex;align-items:center;justify-content:space-between;padding:8px 24px 0}
.kd-logo{max-height:42px}
.kd-ribbon{display:inline-block;background:linear-gradient(90deg,#1d3f5e, #2f73b6 60%, #9cc8ef);color:#fff;padding:8px 14px;margin:10px 18px 0;border-radius:10px;font-weight:700;letter-spacing:.3px}
.kd-container{padding:26px; max-width:1200px; margin:0 auto}
.kd-hero{display:grid; grid-template-columns:minmax(260px,340px) 1fr; gap:32px; align-items:center; background:radial-gradient(1000px 260px at 75% 85%, rgba(111,132,180,.08), transparent 60%); border-radius:12px; position:relative;}
.kd-title{font-size:60px; line-height:1; color:#e14a2e; font-weight:800; margin:6px 0 10px}
.kd-sub{font-size:18px; font-weight:700; color:#0f172a; margin:0 0 14px}

.kd-bottle-wrap{position:relative; display:block; width:100%; max-width:360px; margin:6px auto}
@media (min-width:1200px){ .kd-bottle-wrap{ max-width:400px; } }
.kd-bottle{width:100%; display:block; filter: drop-shadow(0 36px 44px rgba(0,0,0,.22)) contrast(1.06) brightness(1.02) saturate(1.10)}
.kd-bottle-shadow{position:absolute; left:50%; bottom:-6px; transform:translateX(-50%); width:60%; height:12px; border-radius:50%; background: radial-gradient(ellipse at center, rgba(0,0,0,.25) 0%, rgba(0,0,0,.12) 40%, rgba(0,0,0,0) 70%); filter: blur(2px); opacity:.55; pointer-events:none;}
.kd-hero::before{content:""; position:absolute; left:12%; top:18%; width:380px; height:380px; border-radius:50%; background: radial-gradient(ellipse at center, rgba(255,255,255,.85) 0%, rgba(255,255,255,0) 60%); pointer-events:none; filter: blur(8px);}

/* Motion */
@keyframes kemet-wobble-spin { 0%{transform:perspective(600px) rotateZ(0) rotateY(0) translateY(0) scale(1)} 25%{transform:perspective(600px) rotateZ(2deg) rotateY(10deg) translateY(-2px) scale(1.01)} 50%{transform:perspective(600px) rotateZ(0) rotateY(0) translateY(0) scale(1)} 75%{transform:perspective(600px) rotateZ(-2deg) rotateY(-10deg) translateY(-2px) scale(1.01)} 100%{transform:perspective(600px) rotateZ(0) rotateY(0) translateY(0) scale(1)} }
.kd-rotate-pepsi .kd-bottle{ animation: kemet-wobble-spin var(--spin, 22s) cubic-bezier(.35,.05,.2,1) infinite; transform-origin:50% 60% }
.kd-rotate-pepsi .kd-bottle-shadow{ animation: kdShadowFloat var(--spin, 22s) cubic-bezier(.35,.05,.2,1) infinite }
@keyframes kdShadowFloat {0%,50%,100%{transform: translateX(-50%) scaleX(1); opacity:.55;} 25%,75%{transform: translateX(-50%) scaleX(.95); opacity:.45;}}

.kd-features{display:flex; flex-direction:column; gap:12px; margin:8px 0 8px}
.kd-pill{display:flex; align-items:center; gap:10px; background:#cfe7a6; padding:10px 16px; border-radius:999px; font-weight:700; border:1px solid rgba(0,0,0,.06)}
.kd-pill .chk{width:24px;height:24px;flex:0 0 24px;border-radius:50%;border:3px solid #2e6fa4;position:relative;background:#fff}
.kd-pill .chk:after{content:"";position:absolute;left:6px;top:2px;width:8px;height:14px;border-right:3px solid #2e6fa4;border-bottom:3px solid #2e6fa4;transform:rotate(38deg)}
.kd-note{font-size:13px;color:#667085;margin:-6px 0 0 54px}

.kd-strawberry{position:relative;width:100%;height:0;padding-bottom:36%}
.kd-strawberry img{position:absolute;right:0;bottom:-6px;width:min(48%,560px);filter:drop-shadow(0 26px 40px rgba(0,0,0,.22))}

.kd-bottom{margin-top:16px;background:#f6f9fc;border-top:1px solid #e6ecf2;padding:14px 0 16px}
.kd-grid{display:grid;gap:10px;grid-template-columns:150px 170px 1fr 200px;align-items:stretch}
.kd-grid.bordered{border:1.5px solid #c7cfd8;border-radius:12px;padding:12px;background:#fff;box-shadow:var(--shadow)}
.kd-cell{background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%);border:1px solid #d6dde6;border-radius:10px;padding:10px 12px;box-shadow:0 2px 0 rgba(13,28,58,.04) inset}
.kd-cell h5{margin:0 0 6px;font-size:13px;color:#6b7b90;font-weight:800;text-transform:uppercase;letter-spacing:.4px}
.kd-big{font-size:22px;font-weight:800;color:#0f172a}
.kd-mini{font-size:13px;color:#475569;font-weight:600}
.kd-phi{display:grid;gap:8px}
.kd-phi .box{background:#fff;border:1px solid #d0d7df;border-radius:10px;padding:8px 10px;text-align:center}
.kd-phi .box .big{font-size:22px;font-weight:800}
.kd-phi .box .small{font-size:12px;color:#475569;font-weight:700}
.kd-nozzle{display:grid;gap:8px}
.kd-nozzle .box{background:#fff;border:1px solid #d0d7df;border-radius:10px;padding:8px 10px;text-align:center}
.kd-pairslist{display:grid;gap:8px}
.kd-pairslist .row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.kd-chip{background:#eaf4d1;border-radius:10px;padding:9px 10px;font-weight:700;border:1px solid rgba(0,0,0,.06)}

@media (max-width:1024px){.kd-hero{grid-template-columns:1fr}.kd-strawberry img{position:static;width:60%;display:block;margin:18px 0 0 auto}.kd-grid{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.kd-title{font-size:42px}.kd-grid{grid-template-columns:1fr}.kd-pill{font-size:15px}}
.kemet-deltic[dir="rtl"] .kd-hero{direction:rtl}