:root {
    --primary-color: #0a2d4d;
    --secondary-color: #d4af37;
    --dark-text: #333333;
    --light-text: #ffffff;
    --background-light: #f9f9f9;
    --background-white: #ffffff;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    margin: 0;
    line-height: 1.6;
    color: var(--dark-text);
}
.container { max-width: 1100px; margin: 0 auto; padding: 0 20px; }
section { padding: 60px 0; }
h1, h2, h3, h4 { color: var(--primary-color); margin: 0 0 20px 0; text-align: center; }
h1 { font-size: 2.8em; }
h2 { font-size: 2.5em; }
h3 { font-size: 1.5em; }

/* --- Buttons --- */
.cta-button { display: inline-block; background-color: var(--secondary-color); color: var(--light-text); padding: 15px 30px; font-size: 1.2em; font-weight: bold; text-decoration: none; border-radius: 5px; transition: all 0.3s ease; border: none; cursor: pointer; box-shadow: 0 4px 15px rgba(0,0,0,0.2); }
.cta-button:hover { background-color: #b89a2e; transform: translateY(-3px); box-shadow: 0 6px 20px rgba(0,0,0,0.3); }

/* --- NEW Header Bar --- */
.header-bar {
    background-color: var(--background-white);
    padding: 10px 0;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    position: sticky;
    top: 0;
    z-index: 1000;
}
.header-bar-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 20px;
}
.dl-header-logo {
    display: block;
    height: 50px;
    width: auto;
}
.header-title {
    color: var(--dark-text);
    font-size: 1.5rem;
    font-weight: 800;
}
.header-right-items {
    display: flex;
    align-items: center;
    gap: 15px;
}
.header-bar .call-now-button {
    white-space: nowrap;
    font-size: 0.9rem;
    padding: 0.55rem 1.1rem;
}

/* --- Español Link --- */
.lang-link {
    font-weight: bold;
    color: var(--primary-color);
    text-decoration: none;
    transition: color 0.2s ease;
}
.lang-link:hover {
    color: var(--secondary-color);
}


/* --- Hero Section --- */
.hero { 
    position: relative; 
    padding: 120px 0;
    text-align: center; 
    color: var(--light-text); 
    overflow: hidden; 
    background-color: #000; 
}
#bg-video { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); min-width: 100%; min-height: 100%; width: auto; height: auto; z-index: 1; object-fit: cover; }
.hero::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(10, 45, 77, 0.6); z-index: 2; }
.hero-content { 
    position: relative; 
    z-index: 3;
    padding: 0 20px;
}
.hero h1 { color: var(--light-text); }


/* --- Trust & Authority Sections --- */
.attorney-section, .as-seen-on, .testimonials-section, .faq-section { background-color: var(--background-light); }
.section-sub-title { text-align: center; margin-top: -20px; font-weight: bold; }
.attorney-cards { display: flex; justify-content: center; gap: 30px; margin-top: 30px; flex-wrap: wrap; }
.attorney-cards .card { background: var(--background-white); padding: 20px; border-radius: 8px; box-shadow: 0 4px 15px rgba(0,0,0,0.05); text-align: center; width: 250px;}
.attorney-cards .card img { width: 120px; height: 120px; border-radius: 50%; margin-bottom: 15px; object-fit: cover; }
.attorney-cards .card p { margin: 5px 0; }

/* --- Testimonials --- */
.testimonials-section { background: var(--background-white); }
.testimonial-cards { display: flex; gap: 30px; justify-content: center; flex-wrap: wrap; }
.testimonial-card { background: var(--background-white); padding: 25px; border-radius: 8px; box-shadow: 0 4px 15px rgba(0,0,0,0.05); width: 30%; text-align: center; border-top: 5px solid var(--secondary-color); box-sizing: border-box; }
.testimonial-card span { color: var(--secondary-color); font-size: 1.5em; }
.testimonial-card p:first-of-type { font-style: italic; }

/* --- Why Us & How It Works --- */
.trust-badges { display: flex; justify-content: center; gap: 20px; margin-bottom: 40px; flex-wrap: wrap; }
.badge { background: #eef; color: var(--primary-color); padding: 10px 15px; border-radius: 20px; font-weight: bold; }
.why-us-section { background-color: var(--background-light); }
.columns-container { display: flex; gap: 40px; margin-top: 30px; }
.column { flex: 1; padding: 25px; border-radius: 5px; }
.column:first-child { background: #fdecec; border: 2px solid #f9c5c5; }
.column:last-child { background: #eaf6ec; border: 2px solid #b7e0c1; }

.steps-container { display: flex; gap: 30px; align-items: flex-start; }
.step { flex: 1; text-align: center; }
.step h3 { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 3.5em; }
.step h3 span:first-child { background: var(--secondary-color); color: var(--light-text); width: 40px; height: 40px; line-height: 40px; border-radius: 50%; font-size: 1.2em; display: inline-block; flex-shrink: 0; }

/* --- FAQ Section --- */
.faq-section details { background: var(--background-white); border-radius: 5px; margin-bottom: 10px; border: 1px solid #eee; }
.faq-section summary { padding: 15px; font-weight: bold; cursor: pointer; }
.faq-section p { padding: 0 15px 15px; border-top: 1px solid #eee; margin-top: 10px; padding-top: 15px; }

/* --- Contact Form Section --- */
.contact-section { background-color: var(--primary-color); }
.contact-section h2, .contact-section p { color: var(--light-text); text-align: center; }
#evaluation-form { max-width: 450px; margin: 30px auto 0; text-align: center; }
.form-row { display: flex; gap: 15px; }
.form-group { margin-bottom: 15px; flex-grow: 1; text-align: left; }
input, select { width: 100%; padding: 15px; border-radius: 5px; border: 1px solid #ccc; font-size: 1em; box-sizing: border-box; }
.form-footer { margin-top: 20px; text-align: center; }
.micro-copy, .disclaimer { color: #ccc; font-size: 0.9em; }
.micro-copy { margin-bottom: 10px; }
.disclaimer { font-size: 0.8em; }
.form-group label { color:#fff; font-weight:600; font-size:0.95rem; text-shadow:0 1px 2px rgba(0,0,0,.35); display: block; margin-bottom: 5px; }

/* --- Footer & NAP Block --- */
footer { background-color: #222; color: #c7c7c7; text-align: center; padding: 25px 0; font-size: 1rem; }
footer a { color: var(--secondary-color); text-decoration: none; }
.nap-block { border-bottom: 1px solid #555; padding-bottom: 15px; margin-bottom: 15px; }
.nap-block p { margin: 5px 0; color: #fff; font-weight: bold; }

/* ---------- Modal ---------- */
.modal { position: fixed; inset: 0; display: none; z-index: 2000; }
.modal.is-open { display: block; }
.modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.5); }
.modal-dialog { position: relative; z-index: 1; max-width: 520px; margin: 10vh auto; background: #fff; border-radius: 10px; box-shadow: 0 20px 60px rgba(0,0,0,.25); padding: 24px; }
.modal-title { margin: 0 0 8px 0; text-align: center; color: var(--primary-color); }
.modal-sub { margin: 0 0 20px 0; text-align: center; color: #444; }
.modal-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.modal-close { position: absolute; top: 8px; right: 10px; background: transparent; border: none; font-size: 28px; line-height: 1; cursor: pointer; color: #666; }
.cta-outline { background: transparent; color: var(--primary-color); border: 2px solid var(--primary-color); }
.cta-outline:hover { transform: translateY(-3px); box-shadow: 0 6px 20px rgba(0,0,0,0.15); }

.pricing-highlight { margin-top: 0.75rem; padding: 0.75rem 1rem; border-radius: 6px; font-weight: 600; background: #fff7e6; border: 1px solid #f0c36d; }

/* --- Mobile Responsiveness --- */
@media (max-width: 820px) {
    .header-bar-content {
        flex-wrap: wrap;
        justify-content: center;
        gap: 15px;
    }
    .header-title {
        order: -1; /* Make title appear first */
        width: 100%; /* Take full width to center properly */
        text-align: center;
        font-size: 1.3rem;
    }

    h1 { font-size: 2em; } 
    h2 { font-size: 1.8em; }

    .hero { background: url('https://images.streaming-inference.models.runwayml.cloud/streams-server-cpu/raw_image/commands/compressed_image/result.jpg?input_image=https%3A%2F%2Fdnznrvs05pmza.cloudfront.net%2F0438d4e1-2c45-44bb-ba08-f3f7fec0935a.png%3F_jwt%3DeyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJrZXlIYXNoIjoiNWYwNTAyN2VmYTA5MTA1OCIsImJ1Y2tldCI6InJ1bndheS10YXNrLWFydGlmYWN0cyIsInN0YWdlIjoicHJvZCIsImV4cCI6MTc2MDc0NTYwMH0.YO0Uds7oxEtkJRC44qWObNv75bgt9yFQbBFbCiUvIQc&input_max_width=1920&input_max_height=1920') center center / cover; }
    #bg-video { display: none; }
    
    .testimonial-cards, .columns-container, .steps-container { flex-direction: column; }
    .testimonial-card, .column { width: 100%; box-sizing: border-box; margin-bottom: 20px; }
    
    .form-row { flex-direction: column; gap: 0; }
    
    .modal-dialog { margin: 12vh 16px; }
}