/*
Theme Name: Isuzu Lead Pro
Theme URI: https://example.com/isuzu-lead-pro
Author: OpenAI
Description: Tema WordPress responsif untuk website pemasaran dan pengumpulan leads kendaraan niaga. Dapat dikustomisasi melalui Appearance > Customize.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: isuzu-lead-pro
*/
:root{--navy:#092b52;--blue:#0756a5;--red:#e32636;--ink:#142338;--muted:#64748b;--light:#f3f6fa;--line:#e2e8f0;--white:#fff;--radius:9px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);line-height:1.6;background:#fff}a{color:inherit;text-decoration:none}img{max-width:100%;height:auto;display:block}.container{width:min(1160px,90%);margin-inline:auto}.site-top{background:var(--navy);color:#dce8f6;font-size:12px;padding:7px 0}.top-inner{display:flex;justify-content:space-between;gap:16px}.site-header{background:#fff;position:sticky;top:0;z-index:50;box-shadow:0 3px 16px #0b254012}.header-inner{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:24px}.site-brand{display:flex;align-items:center;gap:10px;font-size:19px;font-weight:900;color:var(--navy);letter-spacing:-.5px}.site-brand img{max-height:55px;width:auto}.brand-mark{background:var(--red);color:white;padding:7px 10px;border-radius:3px;letter-spacing:1px}.main-nav ul{list-style:none;display:flex;gap:25px;padding:0;margin:0}.main-nav a{font-size:14px;font-weight:700}.main-nav a:hover{color:var(--red)}.menu-toggle{display:none;background:none;border:0;font-size:25px}.button{display:inline-flex;align-items:center;justify-content:center;padding:12px 20px;background:var(--red);color:#fff;border:0;border-radius:4px;font-weight:800;cursor:pointer;transition:.2s}.button:hover{background:#bd1728;color:#fff;transform:translateY(-1px)}.button-blue{background:var(--blue)}.button-outline{background:transparent;border:1px solid #fff;color:#fff}.hero{min-height:570px;display:flex;align-items:center;color:#fff;background:linear-gradient(90deg,#061d38ed 0%,#092b52c9 0%,#092b5233 0%),url('https://astraisuzu.co.id/wp-content/uploads/2023/09/2022_POSTER-TRAGA-BOX-PU-2000-Pixel-e1695989877245.jpg?auto=format&fit=crop&w=2000&q=85') center/cover}.hero-content{max-width:670px;padding:80px 0}.eyebrow{font-size:12px;letter-spacing:2px;font-weight:800;text-transform:uppercase;color:#ffb8bf}.hero h1{font-size:clamp(38px,5vw,64px);line-height:1.06;margin:14px 0 18px;letter-spacing:-2px;color:#fff}.hero p{font-size:18px;color:#e3edf8;max-width:560px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:27px}.hero-stats{display:flex;gap:28px;margin-top:40px;color:#e3edf8;font-size:13px}.hero-stats strong{display:block;color:#fff;font-size:18px}.section{padding:76px 0}.section-light{background:var(--light)}.section-heading{text-align:center;max-width:720px;margin:0 auto 40px}.section-heading .eyebrow{color:var(--red)}.section-heading h2,.lead-copy h2{font-size:clamp(28px,3.5vw,40px);line-height:1.16;color:var(--navy);margin:9px 0 12px;letter-spacing:-1px}.section-heading p{color:var(--muted);margin:0}.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.product-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:.2s}.product-card:hover{transform:translateY(-4px);box-shadow:0 15px 35px #0b254018}.product-image{height:210px;background:#e8edf3;object-fit:cover;width:100%}.product-content{padding:21px}.product-tag{font-size:11px;color:var(--red);font-weight:900;letter-spacing:1px;text-transform:uppercase}.product-content h3{font-size:23px;color:var(--navy);margin:6px 0}.product-content p{font-size:14px;color:var(--muted);min-height:48px}.product-content .button{width:100%;margin-top:8px}.benefit-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.benefit-card{background:#fff;padding:24px;border-radius:var(--radius);border:1px solid var(--line)}.benefit-number{width: 65px;height: 65px;margin-bottom: 20px;display: flex;align-items: center;justify-content: center;font-size:27px;color:var(--red);font-weight:900}.benefit-card h3{color:var(--navy);margin:7px 0}.benefit-card p{font-size:14px;color:var(--muted);margin:0}.benefit-number img {width: 55px;height: 55px;object-fit: contain;}.promo-panel{background:linear-gradient(110deg,var(--navy),#0b5ca7);color:#fff;padding:42px 5%;border-radius:10px;display:flex;align-items:center;justify-content:space-between;gap:28px}.promo-panel h2{color:#fff;margin:5px 0;font-size:clamp(25px,3vw,36px)}.promo-panel p{color:#d9e7f7;margin:0}.lead-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:40px;align-items:start}.lead-copy{background:var(--navy);color:#fff;padding:32px;border-radius:var(--radius)}.lead-copy h2{color:#fff}.lead-copy p,.lead-copy li{color:#d8e5f4}.lead-copy li{margin:10px 0}.lead-form{background:#fff;padding:28px;border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 12px 35px #0b25400c}.lead-form h3{margin:0 0 18px;color:var(--navy);font-size:23px}.form-field{margin-bottom:14px}.form-field label{display:block;font-size:13px;font-weight:800;margin-bottom:6px}.form-field input,.form-field select,.form-field textarea{width:100%;padding:12px;border:1px solid #cbd5e1;border-radius:4px;font:inherit;background:#fff}.form-field input:focus,.form-field select:focus,.form-field textarea:focus{outline:2px solid #9cc9f2;border-color:var(--blue)}.lead-form small{display:block;color:var(--muted);margin-top:10px}.lead-form .button{width:100%}.site-footer{background:#061d38;color:#d7e2ef;padding:43px 0 18px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:32px}.site-footer h3{color:#fff}.site-footer p,.site-footer a{font-size:14px;color:#c3d2e2}.footer-bottom{border-top:1px solid #ffffff22;margin-top:28px;padding-top:16px;font-size:12px;color:#9fb1c5}.floating-wa{position:fixed;right:18px;bottom:18px;z-index:60;background:#18a957;color:#fff;padding:13px 17px;border-radius:50px;font-weight:900;box-shadow:0 8px 24px #0003}.page-content{padding:55px 0;min-height:45vh}.page-content h1{color:var(--navy)}.screen-reader-text{position:absolute;left:-9999px}
@media(max-width:900px){.main-nav{display:none;position:absolute;top:76px;left:0;right:0;background:#fff;padding:18px 5%;box-shadow:0 10px 20px #0001}.main-nav.is-open{display:block}.main-nav ul{display:flex;flex-direction:column;gap:15px}.menu-toggle{display:block}.header-cta{display:none}.product-grid{grid-template-columns:repeat(2,1fr)}.benefit-grid{grid-template-columns:repeat(2,1fr)}.lead-grid{grid-template-columns:1fr}.promo-panel{align-items:flex-start;flex-direction:column}}
@media(max-width:600px){.top-inner{justify-content:center}.top-inner span:last-child{display:none}.header-inner{min-height:66px}.site-brand{font-size:16px}.hero{min-height:550px;background-position:58% center}.hero-content{padding:60px 0}.hero h1{font-size:41px}.hero p{font-size:16px}.hero-stats{gap:14px;flex-wrap:wrap}.section{padding:55px 0}.product-grid,.benefit-grid,.footer-grid{grid-template-columns:1fr}.product-image{height:220px}.lead-form{padding:21px}.floating-wa{right:12px;bottom:12px}}
.benefit-number {
    width: 65px;
    height: 65px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.benefit-number img {
    width: 55px;
    height: 55px;
    object-fit: contain;
}


/* =================================
   ARTIKEL TERBARU
================================= */

.latest-posts {
    padding: 85px 0;
    background: #f5f8fc;
}

.latest-posts .section-heading {
    text-align: center;
    max-width: 750px;
    margin: 0 auto 45px;
}

.latest-posts-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
}

.latest-post-card {
    background: #ffffff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0, 35, 80, 0.07);
    transition: all 0.3s ease;
}

.latest-post-card:hover {
    transform: translateY(-7px);
    box-shadow: 0 15px 35px rgba(0, 35, 80, 0.13);
}

.latest-post-image {
    display: block;
    height: 230px;
    overflow: hidden;
    background: #eaf1f8;
}

.latest-post-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease;
}

.latest-post-card:hover .latest-post-image img {
    transform: scale(1.06);
}

.post-no-image {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #064b91;
    font-size: 28px;
    font-weight: 800;
}

.latest-post-content {
    padding: 25px;
}

.latest-post-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    color: #778397;
    font-size: 12px;
    margin-bottom: 15px;
}

.post-category {
    color: #07549c;
    font-weight: 700;
}

.latest-post-content h3 {
    font-size: 20px;
    line-height: 1.4;
    margin: 0 0 12px;
}

.latest-post-content h3 a {
    color: #102d50;
    text-decoration: none;
}

.latest-post-content h3 a:hover {
    color: #e31b23;
}

.latest-post-content p {
    color: #657184;
    font-size: 14px;
    line-height: 1.7;
    margin-bottom: 22px;
}

.post-read-more {
    color: #07549c;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
}

.post-read-more:hover {
    color: #e31b23;
}

.post-read-more span {
    margin-left: 5px;
}

.all-posts-button {
    text-align: center;
    margin-top: 40px;
}

.all-posts-button a {
    display: inline-block;
    padding: 13px 28px;
    background: #064b91;
    color: #fff;
    border-radius: 7px;
    text-decoration: none;
    font-weight: 700;
    transition: background 0.3s ease;
}

.all-posts-button a:hover {
    background: #e31b23;
}

.no-posts {
    grid-column: 1 / -1;
    text-align: center;
    padding: 40px;
}

/* TABLET */
@media (max-width: 900px) {
    .latest-posts-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* MOBILE */
@media (max-width: 600px) {
    .latest-posts {
        padding: 55px 0;
    }

    .latest-posts-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .latest-post-image {
        height: 220px;
    }

    .latest-post-content {
        padding: 20px;
    }
}
