/*
|--------------------------------------------------------------------------
| Masjawa v2.1.1
|--------------------------------------------------------------------------
| Typography refinement + hero readability fix
|--------------------------------------------------------------------------
| Tujuan:
| - memperbesar teks kecil
| - memperjelas navigasi
| - memperbaiki area hero kiri agar tidak terasa overlap
| - menjaga visual locked tetap konsisten
|--------------------------------------------------------------------------
*/

:root{
    --home-nav-size:15px;
    --home-kicker-size:11px;
    --home-intro-size:18px;
    --home-button-size:16px;
    --home-section-copy-size:15px;
    --home-card-title-size:18px;
    --home-card-copy-size:12px;
    --home-card-meta-size:10px;
    --home-blog-title-size:15px;
    --home-blog-copy-size:11px;
    --home-footer-quote-size:14px;
    --home-footer-legal-size:11px;
}

/* Header */
.main-nav a{
    font-size:var(--home-nav-size);
    line-height:1.2;
}

/* Hero */
.home-locked-hero{
    background:
        linear-gradient(
            90deg,
            rgba(251,250,246,1) 0%,
            rgba(251,250,246,1) 31%,
            rgba(251,250,246,.92) 40%,
            rgba(251,250,246,.40) 51%,
            rgba(251,250,246,0) 58%
        ),
        #f7f4ed;
}

.home-hero-visual{
    inset:0 0 0 36%;
}

.home-hero-copy{
    width:44%;
    max-width:530px;
    padding:18px 44px 8px 0;
}

.home-kicker{
    margin-bottom:22px;
    font-size:var(--home-kicker-size);
    letter-spacing:.24em;
}

.home-hero-copy h1{
    max-width:520px;
    font-size:66px;
    line-height:1.01;
}

.home-intro{
    max-width:470px;
    margin-top:24px;
    font-size:var(--home-intro-size);
    line-height:1.6;
}

.home-actions{
    gap:26px;
    margin-top:31px;
}

.home-primary,
.home-secondary{
    font-size:var(--home-button-size);
}

.home-primary{
    min-height:54px;
    padding:0 24px;
    border-radius:8px;
}

.home-secondary{
    padding-bottom:5px;
}

/* Section headings */
.home-section-head{
    margin-bottom:28px;
}

.home-section-head h2{
    font-size:38px;
}

.home-section-copy{
    max-width:560px;
    margin-top:9px;
    font-size:var(--home-section-copy-size);
    line-height:1.6;
}

.home-view-link{
    font-size:13px;
}

/* Tools */
.home-tools-grid{
    gap:16px;
}

.home-tool-card{
    min-height:154px;
    padding:18px;
    gap:18px;
}

.home-tool-icon{
    width:58px;
    height:58px;
    flex:0 0 58px;
    font-size:25px;
}

.home-tool-content h3{
    font-size:var(--home-card-title-size);
    line-height:1.3;
}

.home-tool-content p{
    font-size:var(--home-card-copy-size);
    line-height:1.55;
}

.home-tool-meta{
    padding-top:12px;
    font-size:var(--home-card-meta-size);
}

/* Blogs */
.home-blog-grid{
    gap:16px;
}

.home-blog-card{
    min-height:188px;
    grid-template-columns:112px minmax(0,1fr);
}

.home-blog-image{
    min-height:188px;
}

.home-blog-date{
    font-size:10px;
}

.home-blog-copy{
    padding:15px 15px 13px;
}

.home-blog-copy h3{
    margin:8px 0 8px;
    font-size:var(--home-blog-title-size);
    line-height:1.4;
}

.home-blog-copy p{
    font-size:var(--home-blog-copy-size);
    line-height:1.55;
}

.home-read-link{
    font-size:11px;
}

/* Footer */
.footer-quote-row{
    padding-top:34px;
}

.footer-quote-row p{
    font-size:var(--home-footer-quote-size);
}

.footer-inner{
    color:#7c817c;
    font-size:var(--home-footer-legal-size);
}

/* General empty states */
.home-tools-empty,
.home-blogs-empty{
    font-size:14px;
}

/* Tablet */
@media (max-width:920px){
    .home-hero-visual{
        inset:0 0 0 40%;
    }

    .home-hero-copy{
        width:50%;
        max-width:500px;
        padding-right:36px;
    }

    .home-hero-copy h1{
        font-size:56px;
    }

    .home-intro{
        font-size:17px;
    }

    .main-nav a{
        font-size:14px;
    }

    .home-section-head h2{
        font-size:34px;
    }
}

/* Mobile */
@media (max-width:760px){
    .main-nav a{
        font-size:28px;
    }

    .home-hero-inner{
        padding-top:70px;
        padding-bottom:44px;
    }

    .home-hero-copy{
        width:100%;
        max-width:100%;
        padding-right:0;
    }

    .home-kicker{
        font-size:10px;
        letter-spacing:.20em;
    }

    .home-hero-copy h1{
        font-size:52px;
    }

    .home-intro{
        max-width:100%;
        font-size:17px;
    }

    .home-primary,
    .home-secondary{
        font-size:15px;
    }

    .home-section-head h2{
        font-size:33px;
    }

    .home-section-copy{
        font-size:14px;
    }

    .home-tool-content h3{
        font-size:17px;
    }

    .home-tool-content p{
        font-size:12px;
    }

    .home-blog-card{
        min-height:182px;
        grid-template-columns:126px minmax(0,1fr);
    }

    .home-blog-copy h3{
        font-size:15px;
    }

    .home-blog-copy p{
        font-size:11px;
    }

    .footer-quote-row p{
        font-size:13px;
    }

    .footer-inner{
        font-size:10px;
    }
}

@media (max-width:500px){
    .home-hero-copy h1{
        font-size:46px;
    }

    .home-intro{
        font-size:16px;
    }

    .home-primary{
        min-height:50px;
        padding:0 20px;
    }

    .home-blog-card{
        grid-template-columns:116px minmax(0,1fr);
    }
}
