/*
Theme Name: Kumud Diagnostics
Author: OpenAI
Description: White and blue home diagnostics WordPress theme.
Version: 1.0
*/
:root{--b:#1769aa;--n:#123b5d;--l:#eaf4fc;--ink:#263746;--muted:#607286}*{box-sizing:border-box}body{margin:0;font:16px/1.65 Arial,sans-serif;color:var(--ink)}a{color:var(--b);text-decoration:none}.container{width:min(1120px,92%);margin:auto}.site-header{background:white;border-bottom:1px solid #dce6ef;position:sticky;top:0;z-index:9}.header-inner{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:17px 0}.brand{font-size:21px;font-weight:bold;color:var(--n)}.brand small{display:block;font-size:10px;letter-spacing:1px;color:#607286}.nav{display:flex;gap:13px;align-items:center;flex-wrap:wrap}.nav a{font-size:13px;font-weight:bold;color:var(--n)}.cta,.btn{display:inline-block;background:var(--b);color:white!important;padding:11px 17px;border-radius:7px;font-weight:bold;border:0;cursor:pointer}.hero{background:linear-gradient(110deg,#f7fbff,var(--l));padding:70px 0}.hero-grid,.two{display:grid;grid-template-columns:1.1fr .9fr;gap:30px;align-items:center}.eyebrow{color:var(--b);font-size:12px;font-weight:bold;letter-spacing:1.3px;text-transform:uppercase}.hero h1{font-size:clamp(34px,5vw,52px);line-height:1.12;color:var(--n);margin:12px 0}.hero p{font-size:18px;color:#52677b}.hero-art,.formbox,.card{background:#fff;border:1px solid #dce6ef;border-radius:14px;padding:24px;box-shadow:0 7px 24px #123b5d0d}.hero-art{text-align:center}.symbol{font-size:60px;color:var(--b)}.section,.content{padding:55px 0}.alt,.page-hero{background:#f2f8fd}.section h2,.content h2{color:var(--n);font-size:30px}.intro{color:#607286;max-width:700px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.card h3{color:var(--n)}.page-hero{padding:38px 0}.page-hero h1{color:var(--n);margin:0;font-size:36px}.notice{background:var(--l);border-left:4px solid var(--b);padding:13px 17px}.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.field{display:flex;flex-direction:column;gap:5px}.field.full{grid-column:1/-1}label{font-weight:bold;color:var(--n);font-size:14px}input,select,textarea{padding:11px;border:1px solid #cbd8e4;border-radius:6px;font:inherit;width:100%}textarea{min-height:95px}.site-footer{background:#102f49;color:#eaf4fc;padding:38px 0 18px}.site-footer a{color:#fff}.footgrid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:22px}.copyright{border-top:1px solid #34536c;margin-top:22px;padding-top:15px;font-size:13px}.postgrid,.gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.postcard{border:1px solid #dce6ef;border-radius:12px;padding:20px}.gallery img{width:100%;height:220px;object-fit:cover;border-radius:10px}.faq details{padding:14px 0;border-bottom:1px solid #dce6ef}.faq summary{font-weight:bold;color:var(--n);cursor:pointer}.float{position:fixed;right:15px;bottom:15px;display:grid;gap:8px;z-index:20}.float a{background:var(--b);color:white;padding:10px 15px;border-radius:25px;font-weight:bold}.float .wa{background:#168b55}@media(max-width:850px){.header-inner{display:block}.nav{margin-top:12px}.hero-grid,.two{grid-template-columns:1fr}.cards{grid-template-columns:1fr}.footgrid{grid-template-columns:1fr}}@media(max-width:560px){.formgrid,.postgrid,.gallery{grid-template-columns:1fr}.hero{padding:45px 0}}


.site-header .brand {
    display: flex;
    align-items: center;
    max-width: 145px;
}

.site-header .site-logo {
    width: 130px;
    height: 52px;
    max-width: 100%;
    object-fit: contain;
    display: block;
}

@media (max-width: 768px) {
    .site-header .brand {
        max-width: 115px;
    }

    .site-header .site-logo {
        width: 105px;
        height: 45px;
    }
}

/* Services Dropdown Menu */
.nav-dropdown {
    position: relative;
    display: inline-block;
}

.nav-dropdown > a {
    display: block;
}

.dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 230px;
    background: #ffffff;
    box-shadow: 0 5px 18px rgba(0,0,0,0.12);
    border-radius: 6px;
    z-index: 9999;
    padding: 8px 0;
}

.dropdown-menu a {
    display: block;
    padding: 11px 16px;
    color: #173b63;
    text-decoration: none;
    white-space: nowrap;
}

.dropdown-menu a:hover {
    background: #eef5fb;
    color: #0877c9;
}

.nav-dropdown:hover .dropdown-menu,
.nav-dropdown:focus-within .dropdown-menu {
    display: block;
}
/* Home Page Hero Image */
.hero-art {
    padding: 0;
    overflow: hidden;
    border-radius: 18px;
}

.home-hero-image {
    width: 100%;
    height: 370px;
    object-fit: cover;
    object-position: center;
    display: block;
    border-radius: 18px;
}

@media (max-width: 768px) {
    .home-hero-image {
        height: 260px;
    }
}

/* ===== KUMUD PREMIUM HOMEPAGE DESIGN ===== */

:root {
    --b: #1769aa;
    --n: #123b5d;
    --l: #eef6fc;
    --orange: #f28b25;
}

/* HERO SECTION */

.hero {
    background: linear-gradient(115deg, #f4f9ff, #e6f2fc);
    padding: 65px 0;
}

.hero-grid {
    grid-template-columns: 1.05fr .95fr;
    gap: 45px;
}

.hero h1 {
    color: #123b5d;
    font-size: clamp(34px, 4vw, 50px);
    font-weight: 800;
}

.hero h1 span {
    color: #1769aa;
}

.hero-content > p {
    max-width: 560px;
}

.hero-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 24px 0;
}

.btn-orange {
    background: #f28b25;
    color: #fff !important;
}

.btn-orange:hover {
    background: #db7410;
}

.hero-art {
    padding: 0;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 15px 35px rgba(18,59,93,.13);
}

.home-hero-image {
    width: 100%;
    height: 390px;
    object-fit: cover;
    display: block;
}

/* SERVICE SECTION */

.services-section {
    background: #fff;
}

.section-title {
    text-align: center;
    margin-bottom: 35px;
}

.cards {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.card {
    padding: 0;
    overflow: hidden;
    border-radius: 15px;
    border: 1px solid #e0eaf3;
    box-shadow: 0 7px 22px rgba(18,59,93,.08);
    transition: transform .25s, box-shadow .25s;
}

.card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 28px rgba(18,59,93,.14);
}

.service-image {
    height: 175px;
    overflow: hidden;
    background: #eaf4fc;
}

.service-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.card-content {
    padding: 19px;
}

.card h3 {
    font-size: 19px;
    line-height: 1.4;
    min-height: 52px;
}

.card p {
    color: #607286;
    font-size: 14px;
    min-height: 65px;
}

.card-content a {
    color: #1769aa;
    font-weight: bold;
}

.card-content a span {
    color: #f28b25;
}

/* TEMPORARY SERVICE IMAGE BACKGROUNDS */

.service-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #e5f2fc, #c7e2f7);
}

.service-placeholder span {
    color: #123b5d;
    font-size: 25px;
    font-weight: bold;
}

.ecg-placeholder {
    background: linear-gradient(135deg, #e8f4ff, #c9e8f5);
}

.blood-placeholder {
    background: linear-gradient(135deg, #fff0e2, #fbd5b3);
}

.animal-placeholder {
    background: linear-gradient(135deg, #e5f4ed, #c9e7d8);
}

/* BENEFITS STRIP */

.benefits-section {
    background: #123b5d;
    padding: 32px 0;
}

.benefits-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
    text-align: center;
}

.benefit {
    color: #fff;
}

.benefit span {
    display: block;
    color: #ffad4d;
    font-size: 32px;
    font-weight: bold;
}

.benefit p {
    font-size: 14px;
    line-height: 1.5;
}

/* MOBILE RESPONSIVE */

@media (max-width: 900px) {
    .cards {
        grid-template-columns: repeat(2, 1fr);
    }

    .benefits-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 600px) {
    .hero {
        padding: 40px 0;
    }

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

    .home-hero-image {
        height: 260px;
    }

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

    .benefits-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .hero-buttons .btn {
        width: 100%;
        text-align: center;
    }
}
.service-image {
    width: 100%;
    height: 200px;
    overflow: hidden;
}

.service-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
/* FIX: Service Cards Alignment */

.services-section .cards {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
    align-items: stretch;
}

.services-section .card {
    width: 100%;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.services-section .service-image {
    width: 100%;
    height: 175px;
    flex-shrink: 0;
    overflow: hidden;
}

.services-section .service-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.services-section .card-content {
    width: 100%;
    flex: 1;
}

@media (max-width: 900px) {
    .services-section .cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .services-section .cards {
        grid-template-columns: 1fr;
    }
}