/*
Theme Name: Khánh Phát Custom
Author: Khánh Phát
Description: Custom WordPress theme for Khánh Phát Group staging site.
Version: 0.1.0
Text Domain: khanhphat
*/

/* ===== RESET & TOKENS ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --kp-green:#0a6b2f;
  --kp-dark:#004c24;
  --kp-soft:#f6fbf6;
  --kp-line:#dfe9df;
  --kp-yellow:#ffc928;
  --kp-text:#102016;
  --kp-muted:#5d6b61;
  --kp-radius:12px;
  --kp-max:1280px;
  --kp-orange:#e8600a;
  --shadow-sm:0 2px 8px rgba(9,55,26,.06);
  --shadow-md:0 8px 24px rgba(9,55,26,.10);
  --shadow-lg:0 16px 48px rgba(9,55,26,.14);
}
html{scroll-behavior:smooth}
body{
  font-family:'Be Vietnam Pro',system-ui,-apple-system,sans-serif;
  color:var(--kp-text);
  background:#fff;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{display:block;max-width:100%;height:auto}
a{text-decoration:none;color:inherit}
ul{list-style:none}
h1,h2,h3,h4,p{margin:0}


/* ===== SCROLL REVEAL ===== */
.js-ready .reveal{opacity:0;transform:translateY(32px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
.js-ready .reveal.visible{opacity:1;transform:translateY(0)}
.reveal-delay-1{transition-delay:.1s}
.reveal-delay-2{transition-delay:.2s}
.reveal-delay-3{transition-delay:.3s}
.reveal-delay-4{transition-delay:.35s}
.reveal-delay-5{transition-delay:.4s}


/* ===== UTILITIES ===== */
.container{max-width:var(--kp-max);margin:0 auto;padding:0 24px}
.section{padding:80px 0}
.section-title{
  text-align:center;
  color:var(--kp-dark);
  font-size:clamp(24px,3.2vw,32px);
  font-weight:900;
  text-transform:uppercase;
  margin-bottom:12px;
  line-height:1.3;
  letter-spacing:-.3px;
}
.section-subtitle{
  text-align:center;
  color:var(--kp-muted);
  font-size:16px;
  max-width:640px;
  margin:0 auto 48px;
  line-height:1.7;
}
.section-title::after{
  content:'';
  display:block;
  width:60px;height:3px;
  background:linear-gradient(90deg,var(--kp-green),#72bd20);
  margin:14px auto 0;
  border-radius:99px;
}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:14px 32px;
  border-radius:var(--kp-radius);
  font-weight:800;
  font-size:15px;
  cursor:pointer;
  border:none;
  transition:transform .2s cubic-bezier(.16,1,.3,1),box-shadow .2s;
}
.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
.btn-primary{background:var(--kp-green);color:#fff}
.btn-outline{background:#fff;color:var(--kp-dark);border:2px solid var(--kp-green)}
.btn-yellow{background:var(--kp-yellow);color:#111}
.btn-white{background:#fff;color:var(--kp-green)}