/* O'Wellness Sky eğitmen kartı tasarımı — ağdaki tüm eğitmen sayfalarında aynı */
html body .grid-6 { display: grid; grid-template-columns: repeat(6, 1fr); gap: clamp(12px, 1.5vw, 20px); }
@media(max-width: 1024px) { html body .grid-6 { grid-template-columns: repeat(3, 1fr); } }
@media(max-width: 768px) { html body .grid-6 { grid-template-columns: repeat(2, 1fr); } }
html body .trainer-card { position: relative; border-radius: 20px; overflow: hidden; transition: transform 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94), border-color 0.5s ease, box-shadow 0.5s ease; text-align: left; height: 100%; display: flex; flex-direction: column; min-width: 0; text-decoration: none; cursor: pointer; border: 1px solid rgba(255, 255, 255, 0.06); }
html body .trainer-card:hover { transform: translateY(-6px); border-color: rgba(201, 169, 110, 0.25); box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5); }
html body .trainer-avatar { width: 100%; aspect-ratio: 3/4.2; background: var(--surface-3,#1a1510); position: relative; overflow: hidden; flex: 1; }
html body .trainer-avatar::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 60%; background: linear-gradient(to bottom, transparent 0%, rgba(10, 7, 5, 0.4) 50%, rgba(10, 7, 5, 0.9) 100%); z-index: 2; }
html body .trainer-avatar img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; object-position: top; transition: transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94); }
html body .trainer-card:hover .trainer-avatar img { transform: scale(1.06); }
html body .trainer-info { position: absolute; bottom: 0; left: 0; right: 0; padding: 24px 28px 28px; background: transparent; display: flex; align-items: center; justify-content: space-between; gap: 12px; z-index: 3; }
html body .trainer-info h3 { font-family: 'Inter', sans-serif; font-size: 15px; font-weight: 800; color: var(--white,#fff); margin-bottom: 3px; text-transform: uppercase; letter-spacing: 0.5px; }
html body .trainer-role { font-size: 10px; font-weight: 600; color: var(--brand-gold,#c9a96e); display: block; text-transform: uppercase; letter-spacing: 1.5px; }
html body .trainer-link-icon { width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, 0.08); background: rgba(255, 255, 255, 0.04); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: all 0.4s ease; }
html body .trainer-card:hover .trainer-link-icon { background: var(--brand-gold,#c9a96e); border-color: var(--brand-gold,#c9a96e); transform: scale(1.1); }
html body .trainer-link-icon svg { width: 16px; height: 16px; fill: rgba(255, 255, 255, 0.25); transition: all 0.3s ease; }
html body .trainer-card:hover .trainer-link-icon svg { fill: var(--black,#0a0705); }
html body .trainer-card-join { border: 2px dashed rgba(255, 255, 255, 0.08); border-radius: 20px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 24px; aspect-ratio: 3/4.2; transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94); cursor: pointer; text-decoration: none; background: rgba(255, 255, 255, 0.02); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
html body .trainer-card-join:hover { border-color: rgba(201, 169, 110, 0.3); background: rgba(201, 169, 110, 0.05); transform: translateY(-6px); }
html body .join-plus-wrapper { width: 60px; height: 60px; border-radius: 50%; border: 1px dashed rgba(255, 255, 255, 0.2); background: rgba(255, 255, 255, 0.03); display: flex; align-items: center; justify-content: center; margin-bottom: 30px; transition: all var(--transition-base,.3s ease); }
html body .trainer-card-join:hover .join-plus-wrapper { border-color: var(--brand-gold,#c9a96e); transform: scale(1.1); }
html body .join-plus-wrapper svg { width: 20px; height: 20px; fill: rgba(255, 255, 255, 0.3); }
html body .trainer-card-join:hover .join-plus-wrapper svg { fill: var(--brand-gold,#c9a96e); }
html body .join-btn { background: rgba(255, 255, 255, 0.04); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); color: #fff; padding: 12px 24px; border-radius: 50px; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px; transition: all 0.4s ease; border: 1px solid rgba(255, 255, 255, 0.08); }
html body .trainer-card-join:hover .join-btn { background: var(--brand-gold,#c9a96e); color: var(--black,#0a0705); box-shadow: 0 8px 20px rgba(201, 169, 110, 0.3); border-color: var(--brand-gold,#c9a96e); }
html body .trainer-card { display:block }