/* ==========================================================
   CLARAUS DESIGN SYSTEM
   FOUNDATION
========================================================== */

:root{

    --cl-text:#111827;
    --cl-muted:#6b7280;
    --cl-border:#e5e7eb;
    --cl-blue:#2563eb;
    --cl-bg:#ffffff;

    --container:1200px;
    --reading:820px;

    --radius:18px;

    --shadow:0 12px 40px rgba(15,23,42,.06);

}


/* ==========================================================
   RESET
========================================================== */

*,
*::before,
*::after{

    box-sizing:border-box;

}

img{

    max-width:100%;
    height:auto;
    display:block;

}

a{

    color:inherit;
    text-decoration:none;
    transition:.25s ease;

}

a:hover{

    color:var(--cl-blue);

}


/* ==========================================================
   BASE
========================================================== */

body{

    background:var(--cl-bg);
    color:var(--cl-text);

    font-family:Inter,sans-serif;

    -webkit-font-smoothing:antialiased;

}


/* ==========================================================
   CONTAINERS
========================================================== */

.claraus-container{

    width:100%;
    max-width:var(--container);

    margin-inline:auto;

    padding-inline:24px;

}

.claraus-reading{

    width:100%;
    max-width:var(--reading);

    margin-inline:auto;

}


/* ==========================================================
   TYPOGRAPHY
========================================================== */

h1{

    margin:0;

    font-size:54px;

    line-height:1.05;

    font-weight:800;

    letter-spacing:-.03em;

}

h2{

    margin:0;

    font-size:34px;

    line-height:1.2;

    font-weight:700;

}

h3{

    margin:0;

    font-weight:700;

}

p{

    margin:0;

    font-size:19px;

    line-height:1.9;

}

.section-title{

    margin-bottom:28px;

}


/* ==========================================================
   SHARED CARD
========================================================== */

.claraus-card{

    background:#fff;

    border:1px solid var(--cl-border);

    border-radius:var(--radius);

    box-shadow:var(--shadow);

}


/* ==========================================================
   SECTION SPACING
========================================================== */

.claraus-section{

    margin:96px 0;

}


/* ==========================================================
   RESPONSIVE FOUNDATION
========================================================== */

@media (max-width:768px){

    h1{

        font-size:38px;

    }

    h2{

        font-size:30px;

    }

    p{

        font-size:17px;

        line-height:1.8;

    }

    .claraus-container{

        padding-inline:20px;

    }

}

/* ==========================================================
   SHARED COMPANY CARD
========================================================== */

.company-card{

    display:flex;

    align-items:flex-start;

    gap:36px;

    padding:40px;

    background:#fff;

    border:1px solid var(--cl-border);

    border-radius:20px;

    box-shadow:0 8px 28px rgba(15,23,42,.05);

    transition:.3s ease;

}

.company-card:hover{

    transform:translateY(-4px);

    border-color:#d1d5db;

    box-shadow:0 18px 45px rgba(15,23,42,.08);

}


/* ==========================================================
   LOGO
========================================================== */

.company-card-logo{

    flex:0 0 80px;

}

.company-card-logo img{

    width:80px;

    height:80px;

    object-fit:contain;

}


/* ==========================================================
   CONTENT
========================================================== */

.company-card-content{

    flex:1;

}

.company-card-title{

    margin:0 0 10px;

    font-size:28px;

    line-height:1.25;

    font-weight:700;

}

.company-card-title a{

    color:var(--cl-text);

}

.company-card-title a:hover{

    color:var(--cl-blue);

}

.company-card-meta{

    margin-bottom:16px;

    font-size:15px;

    font-weight:600;

    color:var(--cl-muted);

}

.company-card-summary{

    margin-bottom:22px;

    font-size:17px;

    line-height:1.8;

    color:#4b5563;

}

.company-card-link{

    display:inline-flex;

    align-items:center;

    gap:8px;

    font-size:15px;

    font-weight:700;

    color:var(--cl-blue);

    transition:.25s ease;

}

.company-card-link:hover{

    gap:14px;

    text-decoration:underline;

}


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

@media (max-width:768px){

    .company-card{

        flex-direction:column;

        gap:22px;

        padding:24px;

    }

    .company-card-logo{

        flex:none;

    }

    .company-card-logo img{

        width:64px;

        height:64px;

    }

    .company-card-title{

        font-size:22px;

    }

    .company-card-summary{

        font-size:16px;

        line-height:1.7;

    }

}

/* ==========================================================
   ARCHIVE PAGE
========================================================== */

.archive-page{

    padding:72px 0 96px;

}


/* ==========================================================
   ARCHIVE HEADER
========================================================== */

.archive-header{

    max-width:860px;

    margin:0 auto 64px;

    text-align:center;

}

.archive-title{

    margin:0;

    font-size:56px;

    line-height:1.08;

    font-weight:800;

    letter-spacing:-.03em;

}

.archive-description{

    max-width:760px;

    margin:24px auto 0;

}

.archive-description p{

    font-size:20px;

    line-height:1.8;

    color:var(--cl-muted);

}


/* ==========================================================
   SEARCH
========================================================== */

.archive-search{

    max-width:760px;

    margin:48px auto 64px;

}

.archive-search form{

    display:flex;

    gap:14px;

}

.archive-search input[type="search"]{

    flex:1;

    height:60px;

    padding:0 22px;

    border:1px solid var(--cl-border);

    border-radius:14px;

    font-size:17px;

    background:#fff;

    transition:.25s ease;

}

.archive-search input[type="search"]:focus{

    outline:none;

    border-color:var(--cl-blue);

    box-shadow:0 0 0 4px rgba(37,99,235,.08);

}

.archive-search button{

    height:60px;

    padding:0 28px;

    border:none;

    border-radius:14px;

    background:var(--cl-text);

    color:#fff;

    font-size:16px;

    font-weight:600;

    cursor:pointer;

    transition:.25s ease;

}

.archive-search button:hover{

    background:#000;

}


/* ==========================================================
   GRID
========================================================== */

.archive-grid{

    display:grid;

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

    gap:42px;

    max-width:1200px;

    margin:0 auto;

}


/* ==========================================================
   PAGINATION
========================================================== */

.navigation.pagination{

    margin-top:72px;

    display:flex;

    justify-content:center;

}

.navigation.pagination .nav-links{

    display:flex;

    flex-wrap:wrap;

    gap:10px;

}

.navigation.pagination a,

.navigation.pagination span{

    display:flex;

    align-items:center;

    justify-content:center;

    min-width:46px;

    height:46px;

    padding:0 16px;

    border-radius:12px;

    border:1px solid var(--cl-border);

    font-weight:600;

    color:var(--cl-text);

    transition:.25s ease;

}

.navigation.pagination a:hover{

    background:var(--cl-text);

    color:#fff;

}

.navigation.pagination .current{

    background:var(--cl-text);

    color:#fff;

    border-color:var(--cl-text);

}


/* ==========================================================
   RESPONSIVE
========================================================== */

@media (max-width:1100px){

    .archive-grid{

        grid-template-columns:repeat(2,minmax(0,1fr));

    }

}

@media (max-width:768px){

    .archive-page{

        padding:48px 0 72px;

    }

    .archive-title{

        font-size:38px;

    }

    .archive-description p{

        font-size:18px;

    }

    .archive-search{

        margin:36px auto 48px;

    }

    .archive-search form{

        flex-direction:column;

    }

    .archive-search input[type="search"],

    .archive-search button{

        width:100%;

        height:56px;

    }

    .archive-grid{

        grid-template-columns:1fr;

        gap:28px;

    }

}

/* ==========================================================
   PROFILE CARD
   Founder + Executive Archive Cards
========================================================== */

.profile-card{

    background:#fff;

    border:1px solid var(--cl-border);

    border-radius:24px;

    overflow:hidden;

    height:100%;

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

    transition:.30s ease;

}

.profile-card:hover{

    transform:translateY(-6px);

    box-shadow:0 22px 55px rgba(15,23,42,.10);

}

.profile-card > a{

    display:flex;

    flex-direction:column;

    height:100%;

    color:inherit;

}


/* ==========================================================
   IMAGE
========================================================== */

.profile-card-image{

    aspect-ratio:16/10;

    overflow:hidden;

    background:#f8fafc;

}

.profile-card-image img{

    width:100%;

    height:100%;

    object-fit:cover;

    transition:.40s ease;

}

.profile-card:hover .profile-card-image img{

    transform:scale(1.04);

}


/* ==========================================================
   CONTENT
========================================================== */

.profile-card-content{

    display:flex;

    flex-direction:column;

    flex:1;

    padding:34px;

}


/* ==========================================================
   LABEL
========================================================== */

.profile-card-label{

    display:inline-block;

    margin-bottom:16px;

    font-size:11px;

    font-weight:700;

    letter-spacing:.18em;

    text-transform:uppercase;

    color:var(--cl-blue);

}


/* ==========================================================
   NAME
========================================================== */

.profile-card-content h3{

    margin:0 0 14px;

    font-size:30px;

    font-weight:800;

    line-height:1.15;

    letter-spacing:-.03em;

    color:var(--cl-text);

}


/* ==========================================================
   POSITION
========================================================== */

.profile-card-headline{

    margin:0 0 14px;

    font-size:17px;

    font-weight:600;

    line-height:1.55;

    color:#374151;

}


/* ==========================================================
   COMPANY
========================================================== */

.profile-card-company{

    margin:0 0 22px;

    font-size:15px;

    font-weight:600;

    color:#6b7280;

}


/* ==========================================================
   SUMMARY
========================================================== */

.profile-card-summary{

    margin:0;

    font-size:16px;

    line-height:1.75;

    color:#4b5563;

    display:-webkit-box;

    -webkit-box-orient:vertical;

    -webkit-line-clamp:3;

    overflow:hidden;

}


/* ==========================================================
   LINK
========================================================== */

.profile-card-link{

    margin-top:auto;

    padding-top:28px;

    display:inline-flex;

    align-items:center;

    gap:8px;

    font-size:15px;

    font-weight:700;

    color:var(--cl-blue);

    transition:.25s ease;

}

.profile-card:hover .profile-card-link{

    gap:14px;

}


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

@media (max-width:768px){

    .profile-card-content{

        padding:24px;

    }

    .profile-card-content h3{

        font-size:25px;

    }

    .profile-card-headline{

        font-size:16px;

    }

    .profile-card-summary{

        font-size:15px;

    }

}

/* ==========================================================
   CLARAUS SINGLE FOUNDER FINAL HERO FIX
   Layout overflow + title wrapping correction
========================================================== */


/* Founder hero width control */

.entity-hero{

    width:100%;

    max-width:1100px;

    margin-left:auto;

    margin-right:auto;

    display:grid;

    grid-template-columns:280px minmax(0,1fr);

    gap:60px;

    align-items:center;

}



/* Prevent founder names breaking badly */

.entity-title{

    width:100%;

    max-width:none;

    white-space:normal;

    word-break:normal;

    overflow-wrap:normal;

    font-size:56px;

    line-height:1.08;

    letter-spacing:-0.03em;

}



/* Keep hero content inside viewport */

.entity-hero-content{

    min-width:0;

}



/* Company link */

.entity-company{

    margin-top:14px;

    font-size:20px;

    font-weight:700;

}



/* Biography width */

.entity-summary{

    max-width:820px;

    line-height:1.8;

}



/* ==========================================================
   MOBILE SINGLE FOUNDER
========================================================== */

@media(max-width:768px){


    .entity-hero{

        grid-template-columns:1fr;

        gap:32px;

        padding-left:20px;

        padding-right:20px;

        text-align:center;

    }


    .entity-image{

        margin:auto;

    }


    .entity-title{

        font-size:38px;

        line-height:1.12;

        word-break:normal;

    }


    .entity-summary{

        max-width:100%;

    }


}

/* ==========================================================
   FOUNDER POSITION TEXT FIX
   Prevent unnecessary wrapping on founder titles
========================================================== */

.founder-position{

    white-space:nowrap;

    display:block;

    width:max-content;

    max-width:100%;

}


@media(max-width:768px){

    .founder-position{

        white-space:normal;

        width:auto;

    }

}

/* ==========================================================
   FOUNDER ARCHIVE CARD HEADLINE FIX
========================================================== */

.profile-card-headline{

    max-width:100%;

    white-space:normal;

    word-break:normal;

    overflow-wrap:normal;

    line-height:1.5;

}



/* Keep professional titles together better */

.profile-card-headline{

    text-wrap:balance;

}

/* ==========================================================
   FOUNDER ARCHIVE TITLE WRAPPING FIX
========================================================== */

.profile-card-headline{

    max-width:340px;

    white-space:normal;

    word-spacing:normal;

    letter-spacing:-0.01em;

}


/* Prevent breaking executive title words badly */

.profile-card-headline{
    overflow-wrap:normal;
    word-break:normal;
}

/* ==========================================================
   CLARAUS COMPANY ARCHIVE REFINEMENT
   Editorial horizontal company cards
========================================================== */

.archive-grid:has(.company-card){

    grid-template-columns:1fr;

    max-width:1000px;

    gap:32px;

}


.company-card{

    align-items:center;

}


.company-card-logo{

    flex:0 0 96px;

}


.company-card-logo img{

    width:96px;

    height:96px;

    object-fit:contain;

}


.company-card-content{

    min-width:0;

}


.company-card-title{

    font-size:32px;

    line-height:1.2;

    letter-spacing:-0.02em;

}


.company-card-summary{

    max-width:720px;

}


@media(max-width:768px){

    .archive-grid:has(.company-card){

        grid-template-columns:1fr;

    }


    .company-card{

        flex-direction:column;

        align-items:flex-start;

    }


    .company-card-logo img{

        width:72px;

        height:72px;

    }


    .company-card-title{

        font-size:24px;

    }

}

/* ==========================================================
   EXECUTIVE ARCHIVE IMAGE REFINEMENT
========================================================== */

.post-type-archive-executives .profile-card-image{

    aspect-ratio:5 / 5;

    background:#f8fafc;

}


.post-type-archive-executives .profile-card-image img{

    width:100%;
    height:100%;

    object-fit:cover;

    object-position:center 40%;

}