.hero { background-color: #0f0f12; padding: 76px 0 32px; position: relative; overflow: hidden; min-height: 440px; display: flex; align-items: flex-end; }
.hero .hero-bg { position: absolute; inset: 0; z-index: 0; }
.hero .hero-bg img { width: 100%; height: 100%; object-fit: cover; object-position: center 20%; opacity: 0.55; transform: scale(1.4); }
.hero .hero-bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(15, 15, 18, 0.2) 0%, rgba(15, 15, 18, 0.7) 60%, #0f0f12 100%); z-index: 1; pointer-events: none; }
.hero .hero-content { max-width: 1200px; margin: 0 auto; padding: 0 24px; position: relative; z-index: 1; }
.hero .hero-badge { display: inline-block; background-color: #BE1E2D; color: #ffffff; font-family: "Inter", sans-serif; font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; padding: 4px 12px; margin-bottom: 16px; border-radius: 2px; }
.hero .hero-title { font-family: "Plus Jakarta Sans", sans-serif; font-size: 32px; font-weight: 800; color: #ffffff; line-height: 1.1; margin-bottom: 14px; letter-spacing: -0.03em; }
.hero .hero-title .text-accent { color: #BE1E2D; }
.hero .hero-subtitle { font-size: 15px; line-height: 24px; color: rgba(255, 255, 255, 0.9); margin-bottom: 20px; max-width: 520px; font-weight: 400; }
.hero .hero-main { max-width: 100%; }
.hero .hero-trust-bar { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 20px; }
.hero .hero-trust-bar .trust-item { display: flex; align-items: center; gap: 6px; }
.hero .hero-trust-bar .trust-item svg { width: 16px; height: 16px; flex-shrink: 0; }
.hero .hero-trust-bar .trust-item .trust-text { font-size: 11px; font-weight: 600; color: rgba(255, 255, 255, 0.75); white-space: nowrap; }
.hero .hero-cta-group { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 20px; }
.hero .hero-cta-group .cta-primary { display: inline-block; background-color: #BE1E2D; color: #ffffff; font-family: "Plus Jakarta Sans", sans-serif; font-size: 14px; font-weight: 700; padding: 12px 24px; text-decoration: none; border-radius: 24px; transition: background-color 0.2s ease; }
.hero .hero-cta-group .cta-primary:hover { background-color: #930019; color: #ffffff; }
.hero .hero-cta-group .cta-secondary { display: inline-block; color: rgba(255, 255, 255, 0.9); font-family: "Plus Jakarta Sans", sans-serif; font-size: 14px; font-weight: 700; padding: 12px 24px; text-decoration: none; border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 24px; transition: background-color 0.2s ease; }
.hero .hero-cta-group .cta-secondary:hover { background-color: rgba(255, 255, 255, 0.08); color: #ffffff; }
.hero .hero-author-bar, .page-intro .hero-author-bar { display: flex; align-items: center; gap: 14px; padding: 14px 18px; background-color: rgba(255, 255, 255, 0.04); border: 1px solid rgba(255, 255, 255, 0.06); border-left: 3px solid #BE1E2D; border-radius: 4px; margin-top: 20px; }
.hero .hero-author-bar .author-avatar, .page-intro .hero-author-bar .author-avatar { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; flex-shrink: 0; border: 2px solid rgba(190, 30, 45, 0.3); }
.hero .hero-author-bar .author-info, .page-intro .hero-author-bar .author-info { display: flex; flex-direction: column; gap: 2px; }
.hero .hero-author-bar .author-info .author-name, .page-intro .hero-author-bar .author-info .author-name { font-family: "Plus Jakarta Sans", sans-serif; font-size: 15px; font-weight: 700; color: #ffffff; display: flex; align-items: center; gap: 8px; }
.hero .hero-author-bar .author-info .author-name .author-verified, .page-intro .hero-author-bar .author-info .author-name .author-verified { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 600; color: #28a745; }
.hero .hero-author-bar .author-info .author-name .author-verified svg, .page-intro .hero-author-bar .author-info .author-name .author-verified svg { width: 12px; height: 12px; }
.hero .hero-author-bar .author-info .author-role, .page-intro .hero-author-bar .author-info .author-role { font-size: 12px; font-weight: 600; color: #BE1E2D; }
.hero .hero-author-bar .author-info .author-date, .page-intro .hero-author-bar .author-info .author-date { font-size: 12px; color: rgba(255, 255, 255, 0.75); }
.hero .hero-sidebar { background-color: rgba(255, 255, 255, 0.06); padding: 20px; border-radius: 4px; position: relative; margin-top: 20px; }
.hero .hero-sidebar .sidebar-accent { position: absolute; top: 0; left: 0; width: 100%; height: 3px; background-color: #BE1E2D; border-radius: 4px 4px 0 0; }
.hero .hero-sidebar .sidebar-title { font-family: "Plus Jakarta Sans", sans-serif; font-size: 14px; font-weight: 700; color: #ffffff; margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.hero .hero-sidebar .sidebar-title .live-dot { display: inline-block; width: 8px; height: 8px; background-color: #BE1E2D; border-radius: 50%; animation: pulse-dot 2s infinite; }
@keyframes pulse-dot { 0%, 100% { opacity: 1; } 50% { opacity: 0.4; } }
.hero .hero-sidebar .sidebar-item { padding-left: 12px; border-left: 2px solid rgba(255, 255, 255, 0.1); margin-bottom: 14px; }
.hero .hero-sidebar .sidebar-item:first-of-type { border-left-color: #BE1E2D; }
.hero .hero-sidebar .sidebar-item .sidebar-time { font-size: 10px; font-weight: 700; color: rgba(255, 255, 255, 0.75); text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 3px; }
.hero .hero-sidebar .sidebar-item .sidebar-text { font-size: 13px; font-weight: 500; color: rgba(255, 255, 255, 0.9); line-height: 1.4; }
.page-intro { background-color: #0f0f12; padding: 84px 0 28px; }
.page-intro .page-intro-content { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.page-intro .page-intro-badge { display: inline-block; background-color: #BE1E2D; color: #ffffff; font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; padding: 4px 10px; margin-bottom: 12px; border-radius: 2px; }
.page-intro .page-intro-title { font-family: "Plus Jakarta Sans", sans-serif; font-size: 32px; font-weight: 800; color: #ffffff; line-height: 1.1; letter-spacing: -0.03em; margin-bottom: 12px; }
.page-intro .page-intro-title .text-accent { color: #BE1E2D; }
.page-intro .page-intro-text { font-size: 15px; line-height: 24px; color: rgba(255, 255, 255, 0.9); max-width: 600px; }
.page-intro h1 { color: #ffffff; }
.page-intro p { color: rgba(255, 255, 255, 0.9); }
.page-intro .page-intro-author-bar { display: flex; align-items: center; gap: 10px; margin-top: 16px; }
.page-intro .page-intro-author-bar .author-avatar { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; }
.page-intro .page-intro-author-bar .author-info { font-size: 13px; color: rgba(255, 255, 255, 0.75); }
.page-intro .page-intro-author-bar .author-info .author-name { font-weight: 700; color: #ffffff; }
.page-intro .page-intro-subtitle { font-size: 15px; line-height: 24px; color: rgba(255, 255, 255, 0.9); max-width: 600px; }
@media (min-width: 768px) {
  .hero { padding: 100px 0 36px; align-items: center; }
  .hero .hero-bg img { object-position: 85% center; opacity: 0.9; transform: none; }
  .hero .hero-bg::after { background: linear-gradient(to right, #0f0f12 0%, #0f0f12 20%, rgba(15, 15, 18, 0.85) 40%, rgba(15, 15, 18, 0.3) 65%, rgba(15, 15, 18, 0) 80%); }
  .hero .hero-main { max-width: 58%; }
  .hero .hero-title { font-size: 44px; }
  .page-intro { padding: 100px 0 32px; }
  .page-intro .page-intro-title { font-size: 44px; }
  .page-intro h1 { font-size: 44px; }
}
@media (min-width: 1024px) {
  .hero .hero-title { font-size: 50px; }
  .page-intro .page-intro-title { font-size: 50px; }
  .page-intro h1 { font-size: 50px; }
}
@media (min-width: 1200px) {
  .hero .hero-content { padding: 0 32px; }
  .page-intro .page-intro-content { padding: 0 32px; }
}