/* Trang Headhunt cho doanh nghiệp FDI.
   Dùng lại các khối đã có: hero tối, thẻ "Phù hợp với" (sv-hero-card), thẻ ảnh
   trên (hb-card), hỏi đáp gập mở (hb-faq). Chỉ khai báo thêm phần riêng của
   trang này: lưới sáu khó khăn, nhóm vị trí, cách tiếp cận, khối case và biểu mẫu. */

.cnk-landing-page .fd-section { padding: 50px 0; background: #fff; }
.cnk-landing-page .fd-section--soft { background: #f5f7f9; }
.cnk-landing-page .fd-head { max-width: 820px; margin: 0 auto 28px; text-align: center; }
.cnk-landing-page .fd-head h2 { margin: 0 0 10px; color: #061d3d; font: 800 clamp(1.35rem, 2.4vw, 1.8rem)/1.35 Manrope, sans-serif; }
.cnk-landing-page .fd-head p { margin: 0; color: var(--lp-gray); font-size: 13px; line-height: 1.7; }
.cnk-landing-page .fd-note { margin: 24px auto 0 !important; max-width: 860px; color: var(--lp-gray); font-size: 12.5px; line-height: 1.7; text-align: center; }
.cnk-landing-page .fd-note strong { color: var(--lp-red); }

/* Trích dẫn trong hero */
.cnk-landing-page .fd-hero-quote { margin: 22px 0 !important; padding: 2px 0 2px 20px; border-left: 3px solid var(--lp-red); color: #e1e9ed; font-size: 13.5px; line-height: 1.75; }

/* --- sáu khó khăn --- */
.cnk-landing-page .fd-pains { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; }
.cnk-landing-page .fd-pain { padding: 22px 16px; border: 1px solid var(--lp-line); border-radius: 10px; background: #fff; }
.cnk-landing-page .fd-pain__icon { display: block; width: 30px; height: 30px; margin-bottom: 14px; fill: none; stroke: var(--lp-red); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.cnk-landing-page .fd-pain strong { display: block; margin-bottom: 8px; color: #061d3d; font-size: 13px; font-weight: 700; line-height: 1.4; }
.cnk-landing-page .fd-pain p { margin: 0; color: var(--lp-gray); font-size: 11.5px; line-height: 1.65; }

/* --- sáu tình huống nên dùng --- */
.cnk-landing-page .fd-cases { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; }
.cnk-landing-page .fd-case { overflow: hidden; border: 1px solid var(--lp-line); border-radius: 10px; background: #fff; }
.cnk-landing-page .fd-case img { display: block; width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.cnk-landing-page .fd-case__body { padding: 14px; }
.cnk-landing-page .fd-case strong { display: block; margin-bottom: 5px; color: #061d3d; font-size: 12.5px; font-weight: 700; line-height: 1.4; }
.cnk-landing-page .fd-case p { margin: 0; color: var(--lp-gray); font-size: 11.5px; line-height: 1.6; }

/* --- nhóm vị trí --- */
.cnk-landing-page .fd-roles { display: grid; grid-template-columns: minmax(0, .75fr) minmax(0, 2.4fr); gap: 30px; align-items: start; }
.cnk-landing-page .fd-roles__copy h2 { margin: 0 0 12px; color: #061d3d; font: 800 1.45rem/1.35 Manrope, sans-serif; }
.cnk-landing-page .fd-roles__copy p { color: var(--lp-gray); font-size: 13px; line-height: 1.75; }
.cnk-landing-page .fd-roles__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.cnk-landing-page .fd-role { overflow: hidden; border: 1px solid var(--lp-line); border-radius: 10px; background: #fff; }
.cnk-landing-page .fd-role img { display: block; width: 100%; aspect-ratio: 16/7; object-fit: cover; }
.cnk-landing-page .fd-role__body { padding: 16px 18px; }
.cnk-landing-page .fd-role strong { display: block; margin-bottom: 8px; color: #061d3d; font-size: 13px; font-weight: 700; }
.cnk-landing-page .fd-role ul { margin: 0; padding: 0; list-style: none; }
.cnk-landing-page .fd-role li { position: relative; padding-left: 12px; color: var(--lp-gray); font-size: 12px; line-height: 1.85; }
.cnk-landing-page .fd-role li::before { content: "–"; position: absolute; left: 0; color: var(--lp-red); }

/* --- cách tiếp cận --- */
.cnk-landing-page .fd-approach { display: grid; grid-template-columns: minmax(0, .72fr) minmax(0, 2.5fr); gap: 30px; align-items: start; }
.cnk-landing-page .fd-approach__copy h2 { margin: 0 0 12px; color: #061d3d; font: 800 1.35rem/1.35 Manrope, sans-serif; }
.cnk-landing-page .fd-approach__copy p { color: var(--lp-gray); font-size: 12.5px; line-height: 1.75; }
.cnk-landing-page .fd-approach__grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; }
.cnk-landing-page .fd-step { padding: 18px 14px; border: 1px solid var(--lp-line); border-radius: 8px; background: #fff; }
.cnk-landing-page .fd-step__icon { display: block; width: 24px; height: 24px; margin-bottom: 12px; fill: none; stroke: var(--lp-red); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.cnk-landing-page .fd-step strong { display: block; margin-bottom: 6px; color: #061d3d; font-size: 12px; font-weight: 700; line-height: 1.4; }
.cnk-landing-page .fd-step p { margin: 0; color: var(--lp-gray); font-size: 11px; line-height: 1.6; }

/* --- vì sao chọn CNK + case --- */
.cnk-landing-page .fd-why { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .85fr) minmax(0, 1.3fr); gap: 22px; align-items: start; }
.cnk-landing-page .fd-why h2 { margin: 0 0 16px; color: #061d3d; font: 800 1.35rem/1.35 Manrope, sans-serif; }
.cnk-landing-page .fd-why ul { margin: 0; padding: 0; list-style: none; }
.cnk-landing-page .fd-why li { position: relative; padding: 6px 0 6px 24px; color: #33455f; font-size: 12.5px; line-height: 1.6; }
.cnk-landing-page .fd-why li::before { content: "✓"; position: absolute; left: 0; top: 6px; color: var(--lp-red); font-weight: 800; }
.cnk-landing-page .fd-why__media img { width: 100%; height: auto; border-radius: 10px; }
.cnk-landing-page .fd-cases-card { padding: 22px; border: 1px solid var(--lp-line); border-radius: 10px; background: #fff; }
.cnk-landing-page .fd-cases-card h3 { margin: 0 0 16px; color: #061d3d; font: 700 1rem Manrope, sans-serif; }
.cnk-landing-page .fd-case-row { display: grid; grid-template-columns: 68px minmax(0, 1fr); gap: 14px; margin-bottom: 16px; }
.cnk-landing-page .fd-case-row__tag { color: var(--lp-red); font-size: 11px; font-weight: 800; letter-spacing: .08em; }
.cnk-landing-page .fd-case-row p { margin: 0; color: var(--lp-gray); font-size: 12px; line-height: 1.7; }

/* --- biểu mẫu FDI --- */
.cnk-landing-page .fd-bottom { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); gap: 24px; align-items: start; }
.cnk-landing-page .fd-form { padding: 26px; border: 1px solid var(--lp-line); border-radius: 10px; background: #fff; }
.cnk-landing-page .fd-form h2 { margin: 0 0 6px; color: #061d3d; font: 800 1.15rem Manrope, sans-serif; }
.cnk-landing-page .fd-form__note { margin: 0 0 20px !important; color: var(--lp-gray); font-size: 12.5px; }
.cnk-landing-page .fd-form .wpcf7, .cnk-landing-page .fd-form .fd-cf7 { margin: 0; padding: 0; border: 0; background: none; box-shadow: none; }
.cnk-landing-page .fd-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px 14px; }
.cnk-landing-page .fd-field { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.cnk-landing-page .fd-field--wide { grid-column: span 2; }
.cnk-landing-page .fd-field--full { grid-column: 1 / -1; }
.cnk-landing-page .fd-field label { color: #061d3d; font-size: 11.5px; font-weight: 600; }
.cnk-landing-page .fd-req { color: var(--lp-red); }
.cnk-landing-page .fd-field input[type="text"],
.cnk-landing-page .fd-field input[type="email"],
.cnk-landing-page .fd-field input[type="tel"],
.cnk-landing-page .fd-field select,
.cnk-landing-page .fd-field textarea {
  width: 100%; min-height: 40px; padding: 9px 12px;
  border: 1px solid var(--lp-line); border-radius: 5px; background: #fff;
  color: #14243a; font: inherit; font-size: 13px;
}
.cnk-landing-page .fd-field textarea { height: 74px; min-height: 74px; resize: vertical; }
.cnk-landing-page .fd-field input:focus-visible,
.cnk-landing-page .fd-field select:focus-visible,
.cnk-landing-page .fd-field textarea:focus-visible { outline: none; border-color: var(--lp-blue); box-shadow: 0 0 0 3px rgba(44,100,133,.16); }
.cnk-landing-page .fd-field select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2358595b' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 11px center; background-size: 15px; padding-right: 34px; }
.cnk-landing-page .fd-field .wpcf7-radio { display: flex; flex-wrap: wrap; gap: 16px; padding-top: 6px; }
.cnk-landing-page .fd-field .wpcf7-list-item { margin: 0; }
.cnk-landing-page .fd-field .wpcf7-list-item label { display: flex; align-items: center; gap: 7px; color: var(--lp-gray); font-size: 12.5px; font-weight: 400; cursor: pointer; }
.cnk-landing-page .fd-field input[type="radio"] { width: 15px; height: 15px; accent-color: var(--lp-red); }
.cnk-landing-page .fd-submit, .cnk-landing-page input.fd-submit {
  width: 100%; min-height: 46px; margin-top: 16px; border: 0; border-radius: 5px;
  background: var(--lp-red); color: #fff; font: inherit; font-size: 14px; font-weight: 700; cursor: pointer;
}
.cnk-landing-page .fd-submit:hover { background: #8d1b1b; }
.cnk-landing-page .fd-submit:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(110,19,19,.28), 0 0 0 5px rgba(255,255,255,.9); }
.cnk-landing-page .fd-secure { display: flex; align-items: flex-start; gap: 7px; margin: 14px 0 0 !important; color: #8b949d; font-size: 11.5px; line-height: 1.6; }
.cnk-landing-page .fd-secure svg { flex: 0 0 13px; width: 13px; height: 13px; margin-top: 2px; fill: none; stroke: currentColor; stroke-width: 1.6; }

/* --- khổ hẹp --- */
@media (max-width: 1100px) {
  .cnk-landing-page .fd-pains,
  .cnk-landing-page .fd-cases { grid-template-columns: repeat(3, 1fr); }
  .cnk-landing-page .fd-approach__grid { grid-template-columns: repeat(3, 1fr); }
  .cnk-landing-page .fd-roles,
  .cnk-landing-page .fd-approach,
  .cnk-landing-page .fd-bottom { grid-template-columns: 1fr; }
  .cnk-landing-page .fd-roles__grid { grid-template-columns: 1fr 1fr; }
  .cnk-landing-page .fd-why { grid-template-columns: 1fr 1fr; }
  .cnk-landing-page .fd-cases-card { grid-column: 1 / -1; }
}
@media (max-width: 620px) {
  .cnk-landing-page .fd-pains,
  .cnk-landing-page .fd-cases,
  .cnk-landing-page .fd-roles__grid,
  .cnk-landing-page .fd-approach__grid,
  .cnk-landing-page .fd-why,
  .cnk-landing-page .fd-grid { grid-template-columns: 1fr; }
  .cnk-landing-page .fd-field--wide { grid-column: auto; }
  .cnk-landing-page .fd-form { padding: 20px 16px; }
}

/* Hàng dịch vụ liên quan của trang này có 5 thẻ, không phải 4 như trang hub. */
@media (min-width: 1101px) {
  .cnk-landing-page .fd-section .hb-cards { grid-template-columns: repeat(5, 1fr); }
}
