/* ============================================

   PREMIUM VERIFICATION PAGE STYLES

   Matches home and about page aesthetic

============================================ */



/* Hero Section */

.verification-hero {

    background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);

    padding: 140px 0 100px;

    position: relative;

    overflow: hidden;

    color: white;

    text-align: center;

}



.verification-hero::before {

    content: '';

    position: absolute;

    top: 0;

    left: 0;

    right: 0;

    bottom: 0;

    background: radial-gradient(circle at 70% 30%, rgba(212, 165, 116, 0.12) 0%, transparent 60%);

    pointer-events: none;

}



.verification-hero-shape {

    position: absolute;

    border-radius: 50%;

    filter: blur(100px);

    opacity: 0.3;

    animation: verifyFloat 25s infinite alternate ease-in-out;

}



.verification-hero-shape.shape-1 {

    width: 500px;

    height: 500px;

    background: rgba(212, 165, 116, 0.25);

    top: -150px;

    right: -100px;

}



.verification-hero-shape.shape-2 {

    width: 400px;

    height: 400px;

    background: rgba(30, 58, 138, 0.3);

    bottom: -100px;

    left: -100px;

    animation-delay: -10s;

}



@keyframes verifyFloat {

    0% {

        transform: translate(0, 0) scale(1);

    }



    100% {

        transform: translate(40px, 40px) scale(1.1);

    }

}



.verification-hero-content {

    position: relative;

    z-index: 2;

    max-width: 800px;

    margin: 0 auto;

}



.verification-hero-badge {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    background: rgba(212, 165, 116, 0.15);

    backdrop-filter: blur(10px);

    border: 1px solid rgba(212, 165, 116, 0.3);

    padding: 12px 28px;

    border-radius: 50px;

    margin-bottom: 30px;

}



.verification-hero-badge i {

    color: #d4a574;

    font-size: 18px;

}



.verification-hero-badge span {

    font-family: 'Poppins', sans-serif;

    font-size: 14px;

    font-weight: 600;

    color: #d4a574;

    text-transform: uppercase;

    letter-spacing: 2px;

}



.verification-hero h1 {

    font-family: 'Poppins', sans-serif;

    font-size: 56px;

    font-weight: 800;

    line-height: 1.15;

    margin-bottom: 25px;

}



.verification-hero h1 span {

    background: linear-gradient(135deg, #d4a574 0%, #f3d2b3 100%);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

    background-clip: text;

}



.verification-hero-subtitle {

    font-family: 'Open Sans', sans-serif;

    font-size: 20px;

    color: rgba(255, 255, 255, 0.8);

    line-height: 1.8;

    max-width: 650px;

    margin: 0 auto;

}



/* Options Section */

.verification-options-section {

    padding: 100px 0;

    background: #f8fafc;

}



.section-header {

    text-align: center;

    margin-bottom: 60px;

}



.section-pretitle {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    font-family: 'Poppins', sans-serif;

    font-size: 14px;

    font-weight: 600;

    color: #d4a574;

    text-transform: uppercase;

    letter-spacing: 2px;

    margin-bottom: 20px;

    background: rgba(212, 165, 116, 0.1);

    padding: 10px 25px;

    border-radius: 50px;

}



.section-header h2 {

    font-family: 'Poppins', sans-serif;

    font-size: 40px;

    font-weight: 800;

    color: #0f172a;

    margin-bottom: 20px;

}



.section-header h2 span {

    color: #d4a574;

}



.section-header p {

    font-family: 'Open Sans', sans-serif;

    font-size: 18px;

    color: #64748b;

    max-width: 700px;

    margin: 0 auto;

    line-height: 1.8;

}



.options-grid {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 30px;

}



.option-card-premium {

    background: white;

    border-radius: 24px;

    padding: 40px 35px;

    box-shadow: 0 15px 50px rgba(0, 0, 0, 0.05);

    border: 1px solid rgba(0, 0, 0, 0.03);

    transition: all 0.4s ease;

    display: flex;

    flex-direction: column;

}



.option-card-premium:hover {

    transform: translateY(-10px);

    box-shadow: 0 30px 70px rgba(0, 0, 0, 0.1);

    border-color: rgba(212, 165, 116, 0.3);

}



.option-icon {

    width: 70px;

    height: 70px;

    background: linear-gradient(135deg, rgba(212, 165, 116, 0.15) 0%, rgba(212, 165, 116, 0.05) 100%);

    border-radius: 20px;

    display: flex;

    align-items: center;

    justify-content: center;

    margin-bottom: 25px;

    transition: all 0.4s ease;

}



.option-card-premium:hover .option-icon {

    background: linear-gradient(135deg, #d4a574 0%, #b88a58 100%);

    transform: scale(1.1) rotate(5deg);

}



.option-icon i {

    font-size: 28px;

    color: #d4a574;

    transition: all 0.3s ease;

}



.option-card-premium:hover .option-icon i {

    color: white;

}



.option-card-premium h3 {

    font-family: 'Poppins', sans-serif;

    font-size: 22px;

    font-weight: 700;

    color: #0f172a;

    margin-bottom: 15px;

}



.option-card-premium p {

    font-family: 'Open Sans', sans-serif;

    font-size: 15px;

    color: #64748b;

    line-height: 1.7;

    margin-bottom: 25px;

}



.option-features {

    margin-top: auto;

    padding-top: 25px;

    border-top: 1px solid #f1f5f9;

}



.option-features h4 {

    font-family: 'Poppins', sans-serif;

    font-size: 14px;

    font-weight: 700;

    color: #0f172a;

    margin-bottom: 15px;

    text-transform: uppercase;

    letter-spacing: 1px;

}



.option-features ul {

    list-style: none;

    padding: 0;

}



.option-features li {

    display: flex;

    align-items: flex-start;

    gap: 10px;

    font-family: 'Open Sans', sans-serif;

    font-size: 14px;

    color: #64748b;

    margin-bottom: 10px;

}



.option-features li i {

    color: #d4a574;

    font-size: 14px;

    margin-top: 3px;

}



/* Why Verify Section */

.why-verify-section {

    padding: 100px 0;

    background: white;

}



.why-verify-grid {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 40px;

}



.why-verify-item {

    text-align: center;

}



.why-verify-icon {

    width: 80px;

    height: 80px;

    background: #f8fafc;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    margin: 0 auto 25px;

    transition: all 0.3s ease;

}



.why-verify-item:hover .why-verify-icon {

    background: #0f172a;

    transform: scale(1.1);

}



.why-verify-icon i {

    font-size: 32px;

    color: #d4a574;

}



.why-verify-item h3 {

    font-family: 'Poppins', sans-serif;

    font-size: 20px;

    font-weight: 700;

    color: #0f172a;

    margin-bottom: 15px;

}



.why-verify-item p {

    font-family: 'Open Sans', sans-serif;

    font-size: 15px;

    color: #64748b;

    line-height: 1.7;

}



/* Privacy Section */

.verify-privacy-section {

    padding: 100px 0;

    background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);

    color: white;

}



.privacy-grid {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 40px;

}



.privacy-item {

    text-align: center;

}



.privacy-item i {

    font-size: 40px;

    color: #d4a574;

    margin-bottom: 25px;

}



.privacy-item h4 {

    font-family: 'Poppins', sans-serif;

    font-size: 20px;

    font-weight: 700;

    margin-bottom: 15px;

}



.privacy-item p {

    font-family: 'Open Sans', sans-serif;

    font-size: 15px;

    color: rgba(255, 255, 255, 0.7);

    line-height: 1.7;

}



/* Comparison Section */

.comparison-section {

    padding: 100px 0;

    background: #f8fafc;

}



.comparison-grid {

    display: grid;

    grid-template-columns: repeat(3, 1fr);

    gap: 30px;

    max-width: 1000px;

    margin: 0 auto;

}



.comparison-card-premium {

    background: white;

    border-radius: 24px;

    padding: 45px 35px;

    text-align: center;

    box-shadow: 0 15px 50px rgba(0, 0, 0, 0.05);

    border: 1px solid #e2e8f0;

    display: flex;

    flex-direction: column;

    position: relative;

}



.comparison-card-premium.highlight {

    border: 2px solid #d4a574;

    transform: scale(1.05);

    z-index: 2;

    box-shadow: 0 25px 70px rgba(212, 165, 116, 0.15);

}



.popular-badge {

    position: absolute;

    top: -15px;

    left: 50%;

    transform: translateX(-50%);

    background: linear-gradient(135deg, #d4a574 0%, #b88a58 100%);

    color: #0f172a;

    padding: 6px 20px;

    border-radius: 50px;

    font-family: 'Poppins', sans-serif;

    font-size: 12px;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: 1px;

}



.comparison-card-premium h3 {

    font-family: 'Poppins', sans-serif;

    font-size: 20px;

    font-weight: 700;

    color: #0f172a;

    margin-bottom: 10px;

}



.comparison-price {

    font-family: 'Poppins', sans-serif;

    font-size: 32px;

    font-weight: 800;

    color: #d4a574;

    margin-bottom: 25px;

}



.comparison-features {

    list-style: none;

    padding: 0;

    margin: 0 0 35px;

    text-align: left;

}



.comparison-features li {

    padding: 12px 0;

    border-bottom: 1px solid #f1f5f9;

    font-family: 'Open Sans', sans-serif;

    font-size: 14px;

    color: #64748b;

    display: flex;

    align-items: center;

    gap: 10px;

}



.comparison-features li::before {

    content: '•';

    color: #d4a574;

    font-weight: 700;

    font-size: 18px;

}



.btn-verify-premium {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    padding: 14px 25px;

    border-radius: 12px;

    font-family: 'Poppins', sans-serif;

    font-size: 14px;

    font-weight: 700;

    text-transform: uppercase;

    letter-spacing: 1px;

    text-decoration: none;

    transition: all 0.3s ease;

    margin-top: auto;

}



.btn-verify-primary {

    background: linear-gradient(135deg, #d4a574 0%, #b88a58 100%);

    color: #0f172a;

}



.btn-verify-secondary {

    background: #0f172a;

    color: white;

}



.btn-verify-outline {

    border: 2px solid #e2e8f0;

    color: #64748b;

}



.btn-verify-premium:hover {

    transform: translateY(-3px);

    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);

}



/* Responsive */

@media (max-width: 991px) {



    .options-grid,

    .why-verify-grid,

    .privacy-grid,

    .comparison-grid {

        grid-template-columns: 1fr;

        gap: 30px;

    }



    .comparison-card-premium.highlight {

        transform: scale(1);

    }

}



@media (max-width: 768px) {

    .verification-hero h1 {

        font-size: 36px;

    }



    .section-header h2 {

        font-size: 30px;

    }

}