/* ========================================================= */
/* PRIMEINSURANCEUK                                           */
/* DIVISION CSS                                               */
/* Version: 1.0                                               */
/* ========================================================= */



/* ========================================================= */
/* 01. DIVISION VARIABLES                                     */
/* ========================================================= */

:root{

    --division-section-spacing:80px;

    --division-grid-gap:30px;

    --division-card-radius:12px;

    --division-card-shadow:0 8px 30px rgba(0,0,0,.08);

}



/* ========================================================= */
/* 02. DIVISION DEFAULT SPACING                               */
/* ========================================================= */

.division-overview,
.departments,
.featured-guides,
.division-services,
.faq-section,
.related-divisions,
.newsletter-signup{

    padding:var(--division-section-spacing) 0;

}



/* ========================================================= */
/* 03. DIVISION CARD DEFAULT                                  */
/* ========================================================= */

.department-card,
.guide-card,
.company-card,
.broker-card,
.tool-card,
.division-card,
.stat-card{

    border-radius:var(--division-card-radius);

    box-shadow:var(--division-card-shadow);

}



/* ========================================================= */
/* PART 1 END                                                 */
/* ========================================================= */



/* ========================================================= */
/* 07. DIVISION LAYOUT                                        */
/* ========================================================= */

.division-hero,
.division-overview,
.departments,
.featured-guides,
.division-services,
.faq-section,
.related-divisions,
.newsletter-signup{

    position:relative;

}



/* ========================================================= */
/* 08. SECTION CONTAINER                                      */
/* ========================================================= */

.division-overview .container,
.departments .container,
.featured-guides .container,
.division-services .container,
.faq-section .container,
.related-divisions .container,
.newsletter-signup .container{

    position:relative;

}



/* ========================================================= */
/* 09. DIVISION GRID SYSTEM                                   */
/* ========================================================= */

.department-grid,
.guide-grid,
.company-grid,
.broker-grid,
.tool-grid,
.related-division-grid,
.division-statistics{

    display:grid;

    gap:30px;

}



/* ========================================================= */
/* 10. GRID COLUMNS                                           */
/* ========================================================= */







.related-division-grid{

    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));

}




/* ========================================================= */
/* PART 2 END                                                 */
/* ========================================================= */


/* ========================================================= */
/* 11. DIVISION HERO                                          */
/* ========================================================= */

.division-hero{

    background:linear-gradient(135deg,#eef6ff 0%,#ffffff 100%);

}

.division-hero .container{

    display:grid;

    grid-template-columns:1.2fr .8fr;

    align-items:center;

    gap:60px;

}



/* ========================================================= */
/* 12. HERO CONTENT                                           */
/* ========================================================= */

.hero-content{

    display:flex;

    flex-direction:column;

    justify-content:center;

}

.page-label{

    display:inline-flex;

    align-items:center;

    width:max-content;

    padding:8px 18px;

    margin-bottom:20px;

    border-radius:999px;

    font-size:14px;

    font-weight:700;

}

.division-hero h1{

    margin:0 0 24px;

    font-size:56px;

    line-height:1.15;

}

.hero-description{

    margin-bottom:35px;

    max-width:720px;

    font-size:20px;

    line-height:1.8;

}



/* ========================================================= */
/* 13. HERO BUTTONS                                           */
/* ========================================================= */

.hero-buttons{

    display:flex;

    flex-wrap:wrap;

    gap:20px;

}



/* ========================================================= */
/* 14. HERO IMAGE                                             */
/* ========================================================= */

.hero-image{

    display:flex;

    justify-content:center;

    align-items:center;

    min-height:420px;

}

.hero-image img{

    width:100%;

    max-width:600px;

    height:auto;

}



/* ========================================================= */
/* PART 3 END                                                 */
/* ========================================================= */



/* ========================================================= */
/* 15. DIVISION OVERVIEW                                      */
/* ========================================================= */

.division-overview{

    background:#ffffff;

}

.division-overview .section-header{

    margin-bottom:60px;

}



/* ========================================================= */
/* 16. DIVISION STATISTICS                                    */
/* ========================================================= */

.division-statistics{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));

    gap:30px;

}



/* ========================================================= */
/* 17. STATISTIC CARD                                         */
/* ========================================================= */

.stat-card{

    padding:35px 25px;

    text-align:center;

    transition:.30s ease;

}

.stat-card:hover{

    transform:translateY(-8px);

}

.stat-card h3{

    margin:0 0 12px;

    font-size:42px;

    font-weight:800;

}

.stat-card p{

    margin:0;

    font-size:16px;

    line-height:1.6;

}



/* ========================================================= */
/* PART 4 END                                                 */
/* ========================================================= */


/* ========================================================= */
/* 18. DEPARTMENT SECTION                                     */
/* ========================================================= */

.departments{

    background:#f8fafc;

}

.departments .section-header{

    margin-bottom:60px;

}



/* ========================================================= */
/* 19. DEPARTMENT GRID                                        */
/* ========================================================= */

.department-grid{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(300px,1fr));

    gap:30px;

}



/* ========================================================= */
/* 20. DEPARTMENT CARD                                        */
/* ========================================================= */

.department-card{

    display:flex;

    flex-direction:column;

    justify-content:space-between;

    text-decoration:none;

    padding:32px;

    background:#ffffff;

    border:1px solid #e5e7eb;

    border-radius:12px;

    transition:all .30s ease;

    min-height:240px;

}

.department-card:hover{

    transform:translateY(-8px);

    box-shadow:0 15px 35px rgba(0,0,0,.10);

}



/* ========================================================= */
/* 21. DEPARTMENT TITLE                                       */
/* ========================================================= */

.department-card h3{

    margin:0 0 18px;

    font-size:24px;

    line-height:1.3;

    color:#111827;

}



/* ========================================================= */
/* 22. DEPARTMENT DESCRIPTION                                 */
/* ========================================================= */

.department-card p{

    margin:0;

    font-size:16px;

    line-height:1.8;

    color:#6b7280;

}



/* ========================================================= */
/* PART 5 END                                                 */
/* ========================================================= */


/* ========================================================= */
/* 23. FEATURED GUIDES                                        */
/* ========================================================= */

.featured-guides{

    background:#ffffff;

}

.featured-guides .section-header{

    margin-bottom:60px;

}



/* ========================================================= */
/* 24. GUIDE GRID                                             */
/* ========================================================= */

.guide-grid{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(320px,1fr));

    gap:30px;

}



/* ========================================================= */
/* 25. GUIDE CARD                                             */
/* ========================================================= */

.guide-card{

    display:flex;

    flex-direction:column;

    justify-content:space-between;

    padding:32px;

    background:#ffffff;

    border:1px solid #e5e7eb;

    border-radius:12px;

    text-decoration:none;

    transition:all .30s ease;

    min-height:220px;

}

.guide-card:hover{

    transform:translateY(-8px);

    box-shadow:0 15px 35px rgba(0,0,0,.10);

}



/* ========================================================= */
/* 26. GUIDE TITLE                                            */
/* ========================================================= */

.guide-card h3{

    margin:0 0 18px;

    font-size:24px;

    line-height:1.35;

    color:#111827;

}



/* ========================================================= */
/* 27. GUIDE DESCRIPTION                                      */
/* ========================================================= */

.guide-card p{

    margin:0;

    font-size:16px;

    line-height:1.8;

    color:#6b7280;

}



/* ========================================================= */
/* PART 6 END                                                 */
/* ========================================================= */


/* ========================================================= */
/* 28. COMPANIES • BROKERS • TOOLS                            */
/* ========================================================= */

.featured-companies,
.featured-brokers,
.division-tools{

    margin-top:80px;

}

.featured-companies h3,
.featured-brokers h3,
.division-tools h3{

    margin:0 0 35px;

    font-size:32px;

    text-align:center;

}



/* ========================================================= */
/* 29. GRID LAYOUT                                            */
/* ========================================================= */

.company-grid,
.broker-grid,
.tool-grid{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));

    gap:30px;

}



/* ========================================================= */
/* 30. COMPANY • BROKER • TOOL CARD                           */
/* ========================================================= */

.company-card,
.broker-card,
.tool-card{

    display:flex;

    justify-content:center;

    align-items:center;

    min-height:180px;

    padding:30px;

    background:#ffffff;

    border:1px solid #e5e7eb;

    border-radius:12px;

    text-decoration:none;

    text-align:center;

    font-size:18px;

    font-weight:600;

    color:#111827;

    transition:all .30s ease;

}

.company-card:hover,
.broker-card:hover,
.tool-card:hover{

    transform:translateY(-8px);

    box-shadow:0 15px 35px rgba(0,0,0,.10);

}



/* ========================================================= */
/* PART 7 END                                                 */
/* ========================================================= */


/* ========================================================= */
/* 31. FAQ SECTION                                            */
/* ========================================================= */

.faq-section{

    background:#f8fafc;

}

.faq-section .section-header{

    margin-bottom:60px;

}



/* ========================================================= */
/* 32. FAQ LIST                                               */
/* ========================================================= */

.faq-list{

    max-width:1000px;

    margin:0 auto;

}



/* ========================================================= */
/* 33. FAQ ITEM                                               */
/* ========================================================= */

.faq-list details{

    margin-bottom:20px;

    background:#ffffff;

    border:1px solid #e5e7eb;

    border-radius:12px;

    overflow:hidden;

    transition:all .30s ease;

}

.faq-list details:hover{

    box-shadow:0 12px 30px rgba(0,0,0,.08);

}



/* ========================================================= */
/* 34. FAQ QUESTION                                           */
/* ========================================================= */

.faq-list summary{

    padding:22px 28px;

    cursor:pointer;

    font-size:20px;

    font-weight:700;

    list-style:none;

    user-select:none;

}

.faq-list summary::-webkit-details-marker{

    display:none;

}



/* ========================================================= */
/* 35. FAQ ANSWER                                             */
/* ========================================================= */

.faq-list p{

    padding:0 28px 24px;

    margin:0;

    font-size:16px;

    line-height:1.8;

    color:#6b7280;

}



/* ========================================================= */
/* PART 8 END                                                 */
/* ========================================================= */

/* ========================================================= */
/* 36. RELATED DIVISIONS                                      */
/* ========================================================= */

.related-divisions{

    background:#ffffff;

}

.related-divisions .section-header{

    margin-bottom:60px;

}



/* ========================================================= */
/* 37. RELATED DIVISION GRID                                  */
/* ========================================================= */

.related-division-grid{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));

    gap:30px;

}



/* ========================================================= */
/* 38. RELATED DIVISION CARD                                  */
/* ========================================================= */

.division-card{

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:flex-start;

    min-height:220px;

    padding:32px;

    background:#ffffff;

    border:1px solid #e5e7eb;

    border-radius:12px;

    text-decoration:none;

    transition:all .30s ease;

}

.division-card:hover{

    transform:translateY(-8px);

    box-shadow:0 15px 35px rgba(0,0,0,.10);

}

.division-card h3{

    margin:0 0 18px;

    font-size:24px;

    color:#111827;

}

.division-card p{

    margin:0;

    line-height:1.8;

    color:#6b7280;

}



/* ========================================================= */
/* 39. NEWSLETTER                                             */
/* ========================================================= */

.newsletter-signup{

    background:#eff6ff;

    text-align:center;

}

.newsletter-signup h2{

    margin-bottom:20px;

    font-size:42px;

}

.newsletter-signup p{

    max-width:700px;

    margin:0 auto;

    font-size:18px;

    line-height:1.8;

}



/* ========================================================= */
/* PART 9 END                                                 */
/* ========================================================= */

/* ========================================================= */
/* 40. RESPONSIVE DESIGN                                      */
/* ========================================================= */

/* ========================================================= */
/* TABLETS                                                    */
/* ========================================================= */

@media (max-width:992px){

    .division-hero .container{

        grid-template-columns:1fr;

        text-align:center;

    }

    .hero-content{

        align-items:center;

    }

    .hero-buttons{

        justify-content:center;

    }

    .hero-image{

        margin-top:40px;

    }

    .section-header h2{

        font-size:36px;

    }

}



/* ========================================================= */
/* MOBILE DEVICES                                             */
/* ========================================================= */

@media (max-width:768px){

    section{

        padding:60px 0;

    }

    .division-hero h1{

        font-size:40px;

    }

    .hero-description{

        font-size:18px;

    }

    .department-grid,
    .guide-grid,
    .company-grid,
    .broker-grid,
    .tool-grid,
    .related-division-grid,
    .division-statistics{

        grid-template-columns:1fr;

    }

    .department-card,
    .guide-card,
    .company-card,
    .broker-card,
    .tool-card,
    .division-card,
    .stat-card{

        min-height:auto;

    }

}



/* ========================================================= */
/* SMALL MOBILE                                               */
/* ========================================================= */

@media (max-width:480px){

    .division-hero h1{

        font-size:32px;

    }

    .section-header h2{

        font-size:28px;

    }

    .hero-buttons{

        flex-direction:column;

        width:100%;

    }

    .hero-buttons a{

        width:100%;

        text-align:center;

    }

}



/* ========================================================= */
/* END OF DIVISION CSS                                        */
/* ========================================================= */