/*
Theme Name: Public Health Plus Challenge
Version: 1.0
Author: Public Health Plus
*/

:root{
    --blue:#063b66;
    --blue2:#075985;
    --sky:#16b8e6;
    --pale:#eef8fc;
    --text:#17354d;
    --muted:#63798a;
    --white:#ffffff;
    --line:#d7e6ef;
}

*{
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    margin:0;
    font-family:Arial,Helvetica,sans-serif;
    color:var(--text);
    background:#fff;
    line-height:1.6;
}

a{
    color:var(--blue);
    text-decoration:none;
}

a:hover{
    color:var(--sky);
}

.php-container{
    width:min(1120px,92%);
    margin:auto;
}

/* HERO */

.php-hero{
    background:linear-gradient(135deg,#063b66 0%,#075985 55%,#16a9d8 100%);
    color:#fff;
    padding:85px 0;
}

.php-hero-grid{
    display:grid;
    grid-template-columns:1.25fr .75fr;
    gap:55px;
    align-items:center;
}

.php-eyebrow{
    display:inline-block;
    color:#8be5ff;
    font-size:13px;
    font-weight:800;
    letter-spacing:2px;
    margin-bottom:14px;
}

.php-hero h1{
    color:#fff;
    font-size:clamp(40px,5vw,62px);
    line-height:1.08;
    margin:0 0 20px;
}

.php-hero h1 span{
    color:#80ddff;
}

.php-hero p{
    color:#eaf8fc;
    font-size:18px;
    max-width:700px;
    margin:0 0 28px;
}

.php-actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

.php-btn{
    display:inline-block;
    padding:13px 21px;
    border-radius:8px;
    font-weight:800;
    transition:.2s;
}

.php-btn-sky{
    background:var(--sky);
    color:#fff;
}

.php-btn-sky:hover{
    background:#fff;
    color:var(--blue);
}

.php-btn-white{
    background:#fff;
    color:var(--blue);
}

.php-btn-white:hover{
    background:#e8f8fd;
    color:var(--blue);
}

.php-hero-card{
    background:rgba(255,255,255,.13);
    border:1px solid rgba(255,255,255,.28);
    border-radius:18px;
    padding:34px;
}

.php-plus{
    width:55px;
    height:55px;
    border-radius:50%;
    background:var(--sky);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:32px;
    font-weight:bold;
    color:#fff;
}

.php-hero-card h2{
    color:#fff;
    font-size:27px;
    margin:15px 0 10px;
}

.php-hero-card p{
    font-size:16px;
    margin:0;
}

/* TRUST BAR */

.php-trust{
    background:#f4fbfe;
    border-bottom:1px solid var(--line);
    padding:20px 0;
}

.php-trust-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:15px;
}

.php-trust-grid div{
    display:flex;
    align-items:center;
    gap:10px;
    font-weight:700;
    color:var(--blue);
}

.php-trust-grid strong{
    color:var(--sky);
    font-size:22px;
}

/* SECTIONS */

.php-section{
    padding:75px 0;
}

.php-section-light{
    background:var(--pale);
}

.php-heading{
    margin-bottom:32px;
}

.php-heading > span{
    color:var(--sky);
    font-size:13px;
    font-weight:800;
    letter-spacing:2px;
}

.php-heading h2{
    color:var(--blue);
    font-size:38px;
    line-height:1.15;
    margin:7px 0;
}

.php-heading p{
    color:var(--muted);
    margin:0;
}

/* NEWS CARDS */

.php-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px;
}

.php-card{
    background:#fff;
    border:1px solid var(--line);
    border-radius:15px;
    overflow:hidden;
    box-shadow:0 8px 25px rgba(6,59,102,.08);
    transition:.2s;
}

.php-card:hover{
    transform:translateY(-4px);
    box-shadow:0 14px 32px rgba(6,59,102,.13);
}

.php-card-body{
    padding:26px;
}

.php-date{
    display:inline-block;
    color:var(--sky);
    font-size:13px;
    font-weight:800;
    margin-bottom:8px;
}

.php-card h3{
    color:var(--blue);
    font-size:21px;
    line-height:1.3;
    margin:0 0 12px;
}

.php-card p{
    color:var(--muted);
    margin:0 0 15px;
}

.php-read{
    font-weight:800;
    color:var(--sky);
}

/* RESOURCES */

.php-resource{
    background:#fff;
    border:1px solid var(--line);
    border-radius:15px;
    padding:30px;
    box-shadow:0 8px 25px rgba(6,59,102,.07);
    transition:.2s;
}

.php-resource:hover{
    transform:translateY(-4px);
    box-shadow:0 14px 32px rgba(6,59,102,.12);
}

.php-icon{
    width:52px;
    height:52px;
    border-radius:12px;
    background:#e3f7fd;
    color:var(--sky);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:25px;
    font-weight:bold;
    margin-bottom:18px;
}

.php-resource h3{
    color:var(--blue);
    font-size:22px;
    margin:0 0 10px;
}

.php-resource p{
    color:var(--muted);
    margin:0 0 16px;
}

.php-resource a{
    color:var(--sky);
    font-weight:800;
}

/* ABOUT */

.php-about{
    background:#fff;
    padding:75px 0;
}

.php-about-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:70px;
    align-items:center;
}

.php-about h2{
    color:var(--blue);
    font-size:40px;
    line-height:1.15;
    margin:0;
}

.php-about p{
    color:var(--muted);
    font-size:17px;
}

/* CTA */

.php-cta{
    background:linear-gradient(135deg,#063b66,#087da5);
    color:#fff;
    text-align:center;
    padding:70px 0;
}

.php-cta h2{
    color:#fff;
    font-size:38px;
    margin:0 0 10px;
}

.php-cta p{
    color:#e8f8fd;
    margin:0 0 25px;
}

/* MOBILE */

@media(max-width:800px){

    .php-hero{
        padding:55px 0;
    }

    .php-hero-grid,
    .php-about-grid{
        grid-template-columns:1fr;
        gap:35px;
    }

    .php-hero h1{
        font-size:40px;
    }

    .php-grid{
        grid-template-columns:1fr;
    }

    .php-trust-grid{
        grid-template-columns:1fr 1fr;
    }

    .php-about h2{
        font-size:32px;
    }
}

@media(max-width:500px){

    .php-trust-grid{
        grid-template-columns:1fr;
    }

    .php-heading h2{
        font-size:31px;
    }

    .php-actions{
        flex-direction:column;
        align-items:flex-start;
    }

    .php-btn{
        width:100%;
        text-align:center;
    }
}

/* =========================================
   PUBLIC HEALTH PLUS — FINAL HEADER
   ========================================= */

.php-site-header{
    background:#ffffff;
    border-bottom:1px solid #d7e6ef;
    position:relative;
    z-index:100;
}

.php-header-inner{
    min-height:78px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:28px;
}

/* LOGO */

.php-logo{
    display:flex;
    align-items:center;
    gap:11px;
    color:var(--blue);
    text-decoration:none;
    flex-shrink:0;
}

.php-logo:hover{
    color:var(--blue);
}

.php-logo-plus{
    width:42px;
    height:42px;
    border-radius:50%;
    background:var(--sky);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:25px;
    font-weight:900;
}

.php-logo-text{
    display:flex;
    flex-direction:column;
    line-height:1.1;
}

.php-logo-text strong{
    font-size:18px;
    font-weight:900;
}

.php-logo-text small{
    color:var(--muted);
    font-size:11px;
    margin-top:4px;
}

/* NAVIGATION */

.php-nav{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:22px;
    flex:1;
}

.php-nav a{
    color:var(--blue);
    font-size:14px;
    font-weight:700;
    text-decoration:none;
    white-space:nowrap;
    transition:.2s;
}

.php-nav a:hover{
    color:var(--sky);
}

/* CONTACT BUTTON */

.php-header-button{
    display:inline-block;
    background:var(--blue);
    color:#fff !important;
    padding:11px 18px;
    border-radius:8px;
    font-size:14px;
    font-weight:800;
    text-decoration:none;
    white-space:nowrap;
    transition:.2s;
}

.php-header-button:hover{
    background:var(--sky);
    color:#fff !important;
}

/* MOBILE HEADER */

@media(max-width:900px){

    .php-header-inner{
        flex-wrap:wrap;
        padding-top:15px;
        padding-bottom:15px;
    }

    .php-nav{
        order:3;
        width:100%;
        overflow-x:auto;
        justify-content:flex-start;
        padding-bottom:5px;
    }

    .php-nav a{
        font-size:13px;
    }

    .php-header-button{
        margin-left:auto;
    }
}

@media(max-width:600px){

    .php-logo-text strong{
        font-size:16px;
    }

    .php-logo-text small{
        font-size:10px;
    }

    .php-logo-plus{
        width:38px;
        height:38px;
    }

    .php-header-button{
        padding:9px 13px;
        font-size:13px;
    }

    .php-nav{
        gap:18px;
    }
}