/* Person Page Styles */

/* Layout */
.person-layout{max-width:1000px;margin:0 auto;padding:0 1rem}

/* Person Hero */
.person-hero{margin-bottom:3rem}
.hero-img-wrap{position:relative;max-width:600px;background:#f1f5f9;border-radius:12px;overflow:hidden;margin:0 auto -80px;display:flex;justify-content:center}
.hero-img-wrap img{max-width:100%;max-height:550px;height:auto;display:block}
.hero-content{background:linear-gradient(to bottom right,#fff 0%,#f8fafc 100%);border:1px solid #e2e8f0;border-radius:12px;padding:2rem;position:relative;max-width:900px;margin:0 auto;box-shadow:0 4px 16px rgba(0,0,0,0.06)}
.hero-title-row{display:flex;justify-content:space-between;align-items:start;gap:1rem;margin-bottom:1rem;flex-wrap:wrap}
.hero-title-row h1{font-size:2rem;font-weight:800;color:#0f172a;margin:0;line-height:1.2}
.hero-subtitle{font-size:1.125rem;color:#64748b;margin-bottom:1.5rem}
.hero-tags{display:flex;flex-wrap:wrap;gap:0.5rem;margin-bottom:1rem}
.content-section{background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:2rem;margin-bottom:2rem}
.section-heading{font-size:1.5rem;font-weight:700;color:#0f172a;margin-bottom:1.5rem;padding-bottom:0.75rem;border-bottom:2px solid #e2e8f0}

/* Biography Block */
.bio-block{background:linear-gradient(135deg,#f8fafc 0%,#fff 100%);border-left:4px solid #2563eb;border-radius:8px;padding:2rem;margin-bottom:2rem;position:relative}
.bio-block::before{content:'"';position:absolute;top:1rem;left:1rem;font-size:4rem;color:#e2e8f0;line-height:1;font-family:Georgia,serif}
.bio-block p{color:#334155;line-height:1.8;font-size:1rem;margin:0;position:relative;z-index:1;padding-left:2rem}

/* Video Block */
.video-spoiler{background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:1rem 2rem;margin-bottom:2rem;cursor:pointer;transition:all 0.3s ease}
.video-spoiler:hover{background:linear-gradient(135deg,#f3f4f6 0%,#e5e7eb 100%);transform:translateY(-2px)}
.video-spoiler summary{font-weight:600;color:#2563eb;display:flex;align-items:center;gap:0.75rem;list-style:none}
.video-spoiler summary::-webkit-details-marker{display:none}
.video-spoiler[open] summary{margin-bottom:1rem}

/* Wikidata Spoilers */
.wiki-spoiler{background:linear-gradient(135deg,#f0fdf4 0%,#dcfce7 100%);border-radius:12px;padding:1rem;margin-bottom:1rem;cursor:pointer;transition:all 0.3s ease}
.wiki-spoiler:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(34,197,94,0.2)}
.wiki-spoiler summary{font-weight:700;color:#166534;list-style:none;display:flex;align-items:center;gap:0.5rem}
.wiki-spoiler summary::-webkit-details-marker{display:none}
.wiki-spoiler[open]{background:linear-gradient(135deg,#dcfce7 0%,#bbf7d0 100%)}
.wiki-spoiler[open] summary{margin-bottom:1rem}

/* News Timeline */
.news-timeline{background:linear-gradient(135deg,#eff6ff 0%,#dbeafe 100%);border-radius:16px;padding:2rem;position:relative;overflow:hidden}
.news-timeline::before{content:'';position:absolute;left:2rem;top:3rem;bottom:3rem;width:3px;background:linear-gradient(to bottom,#3b82f6,#60a5fa,#93c5fd);border-radius:2px}
.news-item{position:relative;padding-left:3rem;margin-bottom:2rem;animation:fadeInUp 0.6s ease forwards;opacity:0}
.news-item:nth-child(1){animation-delay:0.1s}
.news-item:nth-child(2){animation-delay:0.2s}
.news-item:nth-child(3){animation-delay:0.3s}
.news-item:nth-child(4){animation-delay:0.4s}
.news-item:nth-child(5){animation-delay:0.5s}
.news-item::before{content:'';position:absolute;left:-0.5rem;top:0.5rem;width:12px;height:12px;background:#3b82f6;border-radius:50%;border:3px solid #dbeafe;animation:pulse 2s ease-in-out infinite}
.news-card{background:#fff;border-radius:12px;padding:1.5rem;box-shadow:0 4px 12px rgba(59,130,246,0.1);transition:all 0.3s ease}
.news-card:hover{transform:translateX(10px);box-shadow:0 6px 20px rgba(59,130,246,0.2)}
.news-date{color:#3b82f6;font-weight:700;font-size:0.9rem;margin-bottom:0.5rem}
.news-title{font-weight:700;color:#1e40af;margin-bottom:0.5rem}
.news-source{color:#64748b;font-size:0.85rem}

/* FAQ Chat */
.faq-chat{background:linear-gradient(135deg,#f3e8ff 0%,#e9d5ff 100%);border-radius:16px;padding:2rem;position:relative;overflow:hidden}
.faq-chat::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 20% 80%,rgba(139,92,246,0.1) 0%,transparent 50%);animation:floatHome 20s ease-in-out infinite;pointer-events:none}
.faq-item{margin-bottom:2rem;animation:fadeInUp 0.6s ease forwards;opacity:0}
.faq-item:nth-child(1){animation-delay:0.1s}
.faq-item:nth-child(2){animation-delay:0.2s}
.faq-item:nth-child(3){animation-delay:0.3s}
.faq-question{background:linear-gradient(135deg,#8b5cf6,#7c3aed);color:#fff;padding:1rem 1.5rem;border-radius:20px 20px 5px 20px;margin-left:auto;max-width:80%;box-shadow:0 4px 12px rgba(139,92,246,0.3);font-weight:600;margin-bottom:1rem}
.faq-answer{display:flex;gap:1rem;align-items:start}
.faq-avatar{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#6366f1,#4f46e5);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;flex-shrink:0;box-shadow:0 4px 12px rgba(99,102,241,0.3)}
.faq-bubble{background:#fff;padding:1rem 1.5rem;border-radius:20px 20px 20px 5px;max-width:80%;box-shadow:0 4px 12px rgba(0,0,0,0.1);color:#374151;line-height:1.6}

/* Social Share */
.social-share{background:linear-gradient(135deg,#fef3c7 0%,#fde68a 100%);border-radius:16px;padding:2rem;position:relative;overflow:hidden}
.social-share::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 80% 20%,rgba(251,191,36,0.2) 0%,transparent 50%);animation:floatHome 18s ease-in-out infinite;pointer-events:none}
.social-share h3{position:relative;z-index:1}
.social-btns{display:flex;gap:1rem;flex-wrap:wrap;position:relative;z-index:1}
.social-btn{width:60px;height:60px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.5rem;text-decoration:none;transition:all 0.3s ease;box-shadow:0 4px 12px rgba(0,0,0,0.2)}
.social-btn:hover{transform:translateY(-5px) scale(1.1);box-shadow:0 8px 20px rgba(0,0,0,0.3)}
.social-btn.twitter{background:linear-gradient(135deg,#1da1f2,#0d8bd9)}
.social-btn.facebook{background:linear-gradient(135deg,#1877f2,#0c63d4)}
.social-btn.linkedin{background:linear-gradient(135deg,#0077b5,#005885)}
.social-btn.whatsapp{background:linear-gradient(135deg,#25d366,#1da851)}
.social-btn.telegram{background:linear-gradient(135deg,#0088cc,#006699)}
.social-btn.email{background:linear-gradient(135deg,#ea4335,#c5221f)}

/* Poll Widget */
.poll-widget{background:linear-gradient(135deg,#fef3c7 0%,#fde68a 100%);border-radius:16px;padding:2rem;position:relative;overflow:hidden;box-shadow:0 8px 24px rgba(251,191,36,0.2);margin-bottom:2rem}
.poll-widget::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 80% 20%,rgba(251,191,36,0.2) 0%,transparent 50%);animation:floatHome 18s ease-in-out infinite;pointer-events:none}
.poll-widget h3{position:relative;z-index:1;color:#92400e;margin-bottom:1.5rem}
.poll-option{background:linear-gradient(135deg,#fff 0%,#fffbeb 100%);border:2px solid #fde68a;border-radius:12px;padding:1.25rem;margin-bottom:1rem;cursor:pointer;transition:all 0.3s;position:relative;animation:slideIn 0.4s ease forwards;opacity:0}
.poll-option:nth-child(1){animation-delay:0.1s}
.poll-option:nth-child(2){animation-delay:0.2s}
.poll-option:nth-child(3){animation-delay:0.3s}
.poll-option:nth-child(4){animation-delay:0.4s}
.poll-option:hover{border-color:#fbbf24;box-shadow:0 4px 12px rgba(251,191,36,0.3);transform:translateX(4px)}
.poll-option.selected{border-color:#10b981;background:linear-gradient(135deg,#d1fae5 0%,#a7f3d0 100%)}
.poll-option input[type="radio"]{width:20px;height:20px;cursor:pointer}
.poll-votes-badge{background:#fbbf24;color:#fff;padding:0.35rem 0.75rem;border-radius:8px;font-size:0.85rem;font-weight:700}
.poll-progress{position:relative;height:40px;background:#fff;border-radius:12px;overflow:hidden;margin-bottom:0.5rem}
.poll-progress-bar{height:100%;background:linear-gradient(90deg,#fbbf24,#f59e0b);transition:width 0.6s ease;display:flex;align-items:center;padding:0 1rem;color:#fff;font-weight:700}

/* Duel Widget */
.duel-widget{background:linear-gradient(135deg,#fee2e2 0%,#fecaca 100%);border-radius:16px;padding:2rem;position:relative;overflow:hidden;box-shadow:0 8px 24px rgba(239,68,68,0.2);margin-bottom:2rem}
.duel-widget::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at 50% 50%,rgba(239,68,68,0.2) 0%,transparent 50%);animation:pulse 3s ease-in-out infinite;pointer-events:none}
.duel-widget h3{position:relative;z-index:1;color:#991b1b;margin-bottom:1.5rem}
.duel-fighters{display:flex;gap:1rem;align-items:center;position:relative;z-index:1}
.duel-fighter{flex:1;background:#fff;border-radius:12px;padding:1.5rem;text-align:center;cursor:pointer;transition:all 0.3s ease;border:3px solid transparent}
.duel-fighter:hover{transform:scale(1.05);border-color:#ef4444;animation:shake 0.5s ease}
.duel-fighter img{width:80px;height:80px;border-radius:50%;object-fit:cover;margin-bottom:1rem;border:3px solid #fecaca}
.duel-fighter .name{font-weight:700;color:#374151;margin-bottom:0.5rem}
.duel-fighter .votes{color:#64748b;font-size:0.9rem}
.duel-vs{width:60px;height:60px;background:linear-gradient(135deg,#ef4444,#dc2626);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:900;font-size:1.5rem;box-shadow:0 4px 12px rgba(239,68,68,0.4);flex-shrink:0}

/* Bento Grid */
.bento-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;position:relative;z-index:1}
.bento-item{position:relative;border-radius:12px;overflow:hidden;transition:all 0.3s ease}
.bento-item:hover{transform:translateY(-5px);box-shadow:0 8px 24px rgba(0,0,0,0.15)}
.bento-large{grid-column:span 2;grid-row:span 2}
.bento-wide{grid-column:span 2}
.bento-item img{width:100%;height:100%;object-fit:cover}
.bento-overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent 0%,rgba(0,0,0,0.7) 100%);display:flex;flex-direction:column;justify-content:flex-end;padding:1rem}
.bento-name{color:#fff;font-weight:700;font-size:1rem;margin-bottom:0.25rem}
.bento-meta{color:rgba(255,255,255,0.8);font-size:0.75rem}
.bento-badge{position:absolute;top:0.75rem;right:0.75rem;background:rgba(14,165,233,0.9);color:#fff;padding:0.25rem 0.75rem;border-radius:12px;font-size:0.7rem;font-weight:600}

/* Explore Section */
@keyframes floatExplore{0%,100%{transform:translate(0,0)}50%{transform:translate(10px,-10px)}}
.explore-section{background:linear-gradient(135deg,#f8fafc 0%,#fff 100%);border-left:4px solid #0ea5e9;border-radius:8px;padding:2rem;margin-bottom:2rem}
.explore-section h2{font-size:1.5rem;font-weight:700;color:#0f172a;margin-bottom:1.5rem;text-align:center}
.explore-wrap{background:linear-gradient(135deg,#e0f2fe 0%,#bae6fd 100%);padding:2rem;border-radius:16px;position:relative;overflow:hidden}
.explore-wrap::before{content:'';position:absolute;top:-30%;right:-30%;width:150%;height:150%;background:radial-gradient(circle,rgba(14,165,233,0.1) 0%,transparent 70%);animation:floatExplore 15s ease-in-out infinite;pointer-events:none}

@media(max-width:768px){
.person-layout{padding:0 0.5rem}
.content-section{padding:1.5rem}
.section-heading{font-size:1.25rem}
.hero-img-wrap{max-height:200px;margin-bottom:-60px}
.hero-content{padding:1.5rem}
.hero-title-row h1{font-size:1.5rem}
.bento-grid{grid-template-columns:repeat(2,1fr)}
.bento-large,.bento-wide{grid-column:span 2}
}
