/* public/assets/css/fonts.css
   Default typography for entire site (self-host)
   Be Vietnam Pro: 400/500/600/700
*/

/* =========================
   1) Font faces (self-host)
========================= */
@font-face{
  font-family:"Be Vietnam Pro";
  src:url("../fonts/be-vietnam-pro/BeVietnamPro-Regular.woff2") format("woff2");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Be Vietnam Pro";
  src:url("../fonts/be-vietnam-pro/BeVietnamPro-Medium.woff2") format("woff2");
  font-weight:500;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Be Vietnam Pro";
  src:url("../fonts/be-vietnam-pro/BeVietnamPro-SemiBold.woff2") format("woff2");
  font-weight:600;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"Be Vietnam Pro";
  src:url("../fonts/be-vietnam-pro/BeVietnamPro-Bold.woff2") format("woff2");
  font-weight:700;
  font-style:normal;
  font-display:swap;
}

/* =========================
   2) Variables
========================= */
:root{
  --font-sans:"Be Vietnam Pro", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  --fs-body:16px;
  --lh-body:1.75;
  --lh-heading:1.2;

  /* chữ Việt: đừng âm nhiều, nhìn sẽ "nặng" */
  --ls-body:0.01em;
  --ls-heading:-0.01em;
}

/* =========================
   3) Base
========================= */
html{
  font-family:var(--font-sans);
  font-size:var(--fs-body);
  line-height:var(--lh-body);
  letter-spacing:var(--ls-body);

  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;

  /* không cho giả BOLD (vì không có 800/900) */
  font-synthesis:style;
}

body{ margin:0; }

/* =========================
   4) Headings: TO nhưng "thanh"
   - dùng !important để thắng mọi CSS khác kiểu h2{font-weight:800}
========================= */
h1,h2,h3,h4,h5,h6{
  font-family:var(--font-sans);
  font-weight:600 !important;     /* muốn mảnh hơn: 500 */
  line-height:var(--lh-heading);
  letter-spacing:var(--ls-heading);
  margin:0 0 .6em;
}

/* nếu dính <strong>/<b> trong heading thì không đậm thêm */
h1 strong, h1 b,
h2 strong, h2 b,
h3 strong, h3 b,
h4 strong, h4 b,
h5 strong, h5 b,
h6 strong, h6 b{
  font-weight:inherit !important;
}

/* size to nhưng không đậm (tuỳ chọn, đẹp kiểu landing) */
h1{ font-size:clamp(28px, 3.2vw + 6px, 52px); }
h2{ font-size:clamp(20px, 1.5vw + 12px, 34px); }
h3{ font-size:clamp(18px, 1.0vw + 12px, 24px); }

/* =========================
   5) Paragraph / form
========================= */
p{ margin:0 0 1em; }

button,input,textarea,select{
  font-family:inherit;
  font-size:inherit;
}

/* =========================
   6) Fix các class "font-*" đang dính trong HTML (giống Tailwind)
   - để thắng trường hợp .font-semibold đang bị set 800 ở nơi khác
========================= */
.font-thin{font-weight:100 !important;}
.font-extralight{font-weight:200 !important;}
.font-light{font-weight:300 !important;}
.font-normal{font-weight:400 !important;}
.font-medium{font-weight:500 !important;}
.font-semibold{font-weight:600 !important;}
.font-bold{font-weight:700 !important;}
.font-extrabold,.font-black{font-weight:700 !important;}