/* Hero Section */
body .cvm-hero {
    min-height: 100vh;
    padding: 120px 5% 80px;
    background: radial-gradient(ellipse 80% 60% at 60% 40%, #dbeafe 0%, transparent 70%),
                radial-gradient(ellipse 50% 40% at 10% 80%, #eff6ff 0%, transparent 60%),
                var(--cvm-white);
    position: relative; overflow: hidden;
    font-family: var(--cvm-font-body) !important;
}
.cvm-hero::before {
    content: ''; position: absolute; top: -200px; right: -200px;
    width: 600px; height: 600px; border-radius: 50%;
    background: radial-gradient(circle, rgba(37,99,235,0.08) 0%, transparent 70%);
    pointer-events: none;
}

/* Inner wrapper for width control */
.cvm-hero__inner {
    display: grid; grid-template-columns: 1fr 1fr;
    gap: 60px; align-items: center;
    max-width: 100%; margin: 0 auto;
    width: 100%;
}
.cvm-width-boxed .cvm-hero__inner { max-width: 1200px; }
.cvm-width-narrow .cvm-hero__inner { max-width: 1000px; }

/* Badge */
.cvm-hero__badge {
    display: inline-flex; align-items: center; gap: 8px;
    background: var(--cvm-blue-50); border: 1px solid var(--cvm-blue-200);
    border-radius: 50px; padding: 6px 14px;
    font-size: 0.8rem; font-weight: 600; color: var(--cvm-blue-600);
    margin-bottom: 20px; width: fit-content;
}
.cvm-hero__badge-dot {
    width: 7px; height: 7px; border-radius: 50%;
    background: var(--cvm-accent, var(--cvm-blue-500));
    animation: cvmPulse 2s infinite;
}
@keyframes cvmPulse {
    0%,100% { opacity:1; transform:scale(1); }
    50% { opacity:.6; transform:scale(1.4); }
}

/* Heading */
body .cvm-hero__heading {
    font-family: var(--cvm-font-display) !important;
    font-size: clamp(2.4rem, 4vw, 3.6rem) !important;
    font-weight: 800 !important; line-height: 1.1 !important;
    color: var(--cvm-heading, var(--cvm-blue-900)) !important;
    letter-spacing: -1.5px !important; margin-bottom: 20px;
}
.cvm-hero__highlight { color: var(--cvm-accent, var(--cvm-blue-500)); }

body .cvm-hero__desc {
    font-size: 1.05rem !important; color: var(--cvm-gray-600) !important;
    line-height: 1.7 !important; max-width: 480px; margin-bottom: 36px;
    font-family: var(--cvm-font-body) !important;
}

/* Buttons */
.cvm-hero__buttons {
    display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 40px;
}

/* Trust */
.cvm-hero__trust { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.cvm-hero__avatars { display: flex; }
.cvm-hero__avatars span {
    width: 34px; height: 34px; border-radius: 50%;
    border: 2px solid #fff;
    background: linear-gradient(135deg, var(--cvm-blue-400), var(--cvm-blue-600));
    margin-left: -10px; font-size: 0.6rem; color: #fff;
    display: flex; align-items: center; justify-content: center; font-weight: 700;
}
.cvm-hero__avatars span:first-child { margin-left: 0; }
.cvm-hero__trust-text { font-size: 0.83rem; color: var(--cvm-gray-600); }

/* Visual - CV Mockup */
.cvm-hero__visual { position: relative; display: flex; justify-content: center; }
.cvm-hero__mockup-wrapper { position: relative; width: 100%; max-width: 420px; }

.cvm-hero__cv-card {
    background: var(--cvm-white);
    border-radius: 20px;
    box-shadow: 0 24px 80px rgba(0,0,0,0.12), 0 0 0 1px rgba(0,0,0,0.04);
    padding: 28px; position: relative; z-index: 2;
    transform: rotate(-2deg);
    animation: cvmFloat 6s ease-in-out infinite;
}
@keyframes cvmFloat {
    0%,100% { transform: rotate(-2deg) translateY(0); }
    50% { transform: rotate(-2deg) translateY(-12px); }
}

/* Custom image mode */
.cvm-hero__cv-card--image {
    padding: 0; overflow: hidden; background: transparent;
}
.cvm-hero__cv-card--image img {
    width: 100%; height: auto; display: block;
    border-radius: 20px;
}

.cvm-hero__cv-inner { background: #f8fafc; border-radius: 12px; padding: 22px; }

.cvm-hero__cv-header { display: flex; gap: 14px; margin-bottom: 16px; }
.cvm-hero__cv-avatar {
    width: 44px; height: 44px; border-radius: 10px;
    background: linear-gradient(135deg, var(--cvm-blue-400), var(--cvm-blue-600));
    flex-shrink: 0;
}
.cvm-hero__cv-name-block { flex: 1; display: flex; flex-direction: column; gap: 6px; }

.cvm-line { height: 10px; border-radius: 4px; background: var(--cvm-gray-200); }
.cvm-line-dark { background: var(--cvm-blue-900); width: 60%; height: 13px; }
.cvm-line-accent { background: var(--cvm-blue-400); width: 40%; height: 8px; }
.cvm-line-short { width: 55%; }
.cvm-line-shorter { width: 35%; }

.cvm-hero__cv-section { margin-top: 14px; display: flex; flex-direction: column; gap: 6px; }
.cvm-section-title-bar { height: 8px; background: var(--cvm-blue-500); border-radius: 3px; width: 28%; margin-bottom: 4px; }

/* Floating badges */
.cvm-hero__badge-float {
    position: absolute; top: -18px; right: -18px; z-index: 3;
    background: var(--cvm-blue-500); color: #fff;
    border-radius: 50px; padding: 8px 16px;
    font-size: 0.78rem; font-weight: 700;
    box-shadow: 0 8px 24px rgba(37,99,235,0.4);
    animation: cvmBadgeFloat 4s ease-in-out infinite;
    white-space: nowrap;
}
@keyframes cvmBadgeFloat {
    0%,100%{transform:translateY(0);}
    50%{transform:translateY(-8px);}
}

.cvm-hero__badge-float2 {
    position: absolute; bottom: -20px; left: -24px; z-index: 3;
    background: var(--cvm-white);
    border-radius: 16px; padding: 12px 18px;
    font-size: 0.78rem; font-weight: 600; color: var(--cvm-gray-800);
    box-shadow: 0 8px 32px rgba(0,0,0,0.12);
    display: flex; align-items: center; gap: 10px;
    animation: cvmBadgeFloat2 5s ease-in-out infinite;
    white-space: nowrap;
}
@keyframes cvmBadgeFloat2 {
    0%,100%{transform:translateY(0) rotate(1deg);}
    50%{transform:translateY(-10px) rotate(1deg);}
}
.cvm-hero__badge2-icon {
    width: 32px; height: 32px; border-radius: 8px;
    background: linear-gradient(135deg, #22c55e, #16a34a);
    display: flex; align-items: center; justify-content: center; font-size: 1rem;
}
.cvm-hero__badge2-sub { font-size: 0.72rem; color: var(--cvm-gray-400); margin-bottom: 2px; }
.cvm-hero__badge2-main { font-weight: 700; }

/* Responsive - Tablet (iPad Pro and below) */
@media (max-width: 1024px) {
    .cvm-hero { padding: 100px 5% 50px; min-height: auto; }
    .cvm-hero__inner { grid-template-columns: 1fr; text-align: center; gap: 36px; }
    .cvm-hero__desc { margin: 0 auto 28px; }
    .cvm-hero__buttons { justify-content: center; }
    .cvm-hero__trust { justify-content: center; }
    .cvm-hero__badge { margin: 0 auto 20px; }
    .cvm-hero__visual { order: 2; }
    .cvm-hero__mockup-wrapper { max-width: 320px; }
    .cvm-hero__badge-float { top: -12px; right: -8px; font-size: 0.72rem; padding: 6px 12px; }
    .cvm-hero__badge-float2 { bottom: -14px; left: -10px; font-size: 0.72rem; padding: 10px 14px; }
}

/* Responsive - Mobile */
@media (max-width: 600px) {
    .cvm-hero { padding: 90px 4% 50px; min-height: auto; }
    .cvm-hero__heading { font-size: clamp(1.8rem, 6vw, 2.4rem); letter-spacing: -0.5px; }
    .cvm-hero__mockup-wrapper { max-width: 260px; }
    .cvm-hero__cv-card { padding: 16px; border-radius: 14px; }
    .cvm-hero__cv-card--image { padding: 0; }
    .cvm-hero__cv-card--image img { border-radius: 14px; }
    .cvm-hero__badge-float { position: relative; top: auto; right: auto; margin: 0 auto 12px; display: inline-block; }
    .cvm-hero__badge-float2 { position: relative; bottom: auto; left: auto; margin: 12px auto 0; }
}