/* Start custom CSS for html, class: .elementor-element-cb04147 */<style>
    /* --- FONTS & BASICS --- */
    @import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700;900&display=swap');

    .finish-container {
        font-family: 'Lato', sans-serif;
        color: #444;
        line-height: 1.7;
        background-color: #fdfdfd;
        max-width: 100%;
        overflow-x: hidden;
    }

    /* --- VARIABLES --- */
    :root {
        --finish-blue: #2980b9;    /* Paint Blue */
        --finish-gold: #f39c12;    /* Laminate Gold */
        --finish-dark: #2c3e50;
        --finish-red: #c0392b;     /* Warning */
        --finish-green: #27ae60;   /* Safe */
        --bg-light: #ecf0f1;
    }

    /* --- HERO SECTION (Side-by-Side) --- */
    .finish-hero {
        display: flex;
        flex-wrap: wrap;
        min-height: 500px;
    }
    .hero-text-side {
        flex: 1;
        background: var(--finish-dark);
        color: white;
        padding: 60px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        min-width: 300px;
    }
    .hero-img-side {
        flex: 1;
        background-image: url('https://punalu.com/wp-content/uploads/2026/03/blog-7-2.png');
        background-size: cover;
        background-position: center;
        min-width: 300px;
        min-height: 300px;
    }
    .finish-hero h1 {
        font-size: 2.8rem;
        font-weight: 900;
        margin-bottom: 20px;
        line-height: 1.2;
        color:#c0392b;
    }
    .finish-hero p { font-size: 1.2rem; opacity: 0.9; }

    /* --- INTRO --- */
    .finish-intro {
        max-width: 800px;
        margin: 60px auto;
        text-align: center;
        padding: 0 20px;
        font-size: 1.1rem;
    }

    /* --- SPLIT COMPARISON (Paint vs Laminate) --- */
    .comparison-wrap {
        display: flex;
        gap: 30px;
        max-width: 1200px;
        margin: 0 auto 60px auto;
        padding: 0 20px;
    }
    .compare-card {
        flex: 1;
        background: white;
        border-radius: 12px;
        box-shadow: 0 10px 30px rgba(0,0,0,0.08);
        padding: 40px;
        border-top: 6px solid #ccc;
    }
    .card-paint { border-top-color: var(--finish-blue); }
    .card-lam { border-top-color: var(--finish-gold); }

    .compare-card h2 { margin-top: 0; font-weight: 900; font-size: 2rem; }
    .card-paint h2 { color: var(--finish-blue); }
    .card-lam h2 { color: var(--finish-gold); }

    /* Process Steps */
    .process-step {
        margin-bottom: 15px;
        padding-left: 15px;
        border-left: 3px solid #eee;
    }
    .process-step strong { display: block; color: var(--finish-dark); }

    /* Dos and Donts List */
    .do-dont-list { list-style: none; padding: 0; }
    .do-dont-list li { margin-bottom: 10px; padding-left: 25px; position: relative; }
    .li-good::before { content: '✔'; position: absolute; left: 0; color: var(--finish-green); font-weight: bold; }
    .li-bad::before { content: '✘'; position: absolute; left: 0; color: var(--finish-red); font-weight: bold; }

    /* --- WARNING BANNER (Section 4) --- */
    .warning-zone {
        background: #fff5f5;
        border-left: 10px solid var(--finish-red);
        padding: 50px;
        max-width: 1000px;
        margin: 0 auto 60px auto;
    }
    .warning-zone h2 { color: var(--finish-red); margin-top: 0; }
    .warning-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        gap: 20px;
        margin-top: 20px;
    }
    .warn-item {
        background: white;
        padding: 15px;
        border: 1px solid #ffcccc;
        font-weight: bold;
        text-align: center;
        color: #c0392b;
    }

    /* --- BEST PRACTICES GRID (Section 3) --- */
    .tips-section {
        background: var(--bg-light);
        padding: 60px 20px;
        text-align: center;
    }
    .tips-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
        gap: 30px;
        max-width: 1100px;
        margin: 40px auto 0 auto;
    }
    .tip-box {
        background: white;
        padding: 30px;
        border-radius: 8px;
        transition: transform 0.3s;
    }
    .tip-box:hover { transform: translateY(-5px); }
    .tip-icon { font-size: 2rem; margin-bottom: 15px; display: block; color: var(--finish-green); }

    /* --- FAQ --- */
    .finish-faq {
        max-width: 800px;
        margin: 60px auto;
        padding: 0 20px;
    }
    .finish-faq h2 { text-align: center; color: var(--finish-dark); margin-bottom: 40px; }
    
    details.finish-details {
        background: white;
        border-bottom: 1px solid #ddd;
        padding: 20px;
        transition: 0.3s;
    }
    details.finish-details:hover { background: #f9f9f9; }
    summary.finish-summary { font-weight: 700; cursor: pointer; color: var(--finish-dark); }
    .finish-ans { margin-top: 15px; color: #666; }

    /* --- FOOTER --- */
    .finish-footer {
        background: var(--finish-dark);
        color: white;
        text-align: center;
        padding: 50px;
    }

    /* --- RESPONSIVE --- */
    @media (max-width: 768px) {
        .finish-hero { flex-direction: column-reverse; }
        .hero-img-side { min-height: 250px; }
        .hero-text-side { padding: 40px 20px; }
        .finish-hero h1 { font-size: 2rem; }
        .comparison-wrap { flex-direction: column; }
    }
</style>/* End custom CSS */