.elementor-23942 .elementor-element.elementor-element-dc1a8a2{--display:flex;}:root{--page-title-display:none;}/* Start custom CSS *//* Custom CSS for Premium Look and Feel */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700;800&display=swap');

:root {
    --primary-color: #0d1117; /* Deep Charcoal/Navy */
    --secondary-color: #1a202c; /* Card background */
    --accent-color-silver: #e2e8f0; /* Metallic Silver Text */
    --highlight-color-gold: #FFC300; /* Matte Gold for highlights/buttons */
}

/* 1. Full-Screen Background and Font Reset */
body {
    font-family: 'Inter', sans-serif;
    /* Subtle radial gradient background for premium depth */
    background: radial-gradient(circle at top right, #1a202c 0%, #04070a 70%); 
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh; /* Ensures it covers full viewport height on mobile */
    padding: 20px; /* Padding around the outside edge */
}

/* 2. Main Card Styling (vcard-container) */
.vcard-container {
    background-color: var(--secondary-color);
    color: var(--accent-color-silver);
    /* Enhanced Shadow and Gold Border */
    box-shadow: 0 30px 60px -12px rgba(0, 0, 0, 0.7), 0 18px 36px -18px rgba(0, 0, 0, 0.6);
    border: 2px solid var(--highlight-color-gold); 
    max-width: 480px; /* ESSENTIAL: Constrains width for perfect mobile viewing */
    width: 100%;
}

/* 3. Button and Interactive Element Styling */
.action-button {
    transition: all 0.3s ease;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.4);
    border: 1px solid rgba(255, 255, 255, 0.15);
}

/* Creative Hover Effect: Scale up and add Gold Glow (for touch/desktop) */
.action-button:hover {
    transform: scale(1.02);
    background-color: var(--highlight-color-gold);
    color: var(--primary-color) !important;
    box-shadow: 0 10px 20px -5px rgba(255, 195, 0, 0.4);
}

/* Styling for the small brand logo initials */
.brand-logo-placeholder {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 14px;
    margin-right: 12px;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}

.brand-button {
    padding: 8px 12px;
    font-size: 11px;
    font-weight: 600;
}/* End custom CSS */