/* Trang nộp CV.
   Bố cục theo mockup đã duyệt: hero tối dùng chung với landing, thẻ biểu mẫu
   trắng bên trái, thẻ navy giải thích lợi ích và quy trình bên phải, dải ba lợi
   ích và dải câu hỏi thường gặp ở dưới.

   Bảng màu giữ nguyên nhận diện: navy #061d3d, xanh #2c6485, đỏ đô #6e1313. */

.cnk-landing-page .cv-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.42fr) minmax(0, 1fr);
  gap: 26px;
  align-items: start;
  padding: 46px 0 0;
}

/* --- thẻ biểu mẫu --- */
.cnk-landing-page .cv-card {
  padding: 34px;
  border: 1px solid var(--lp-line);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 10px 30px rgba(6, 29, 61, .06);
}
.cnk-landing-page .cv-card__title,
.cnk-landing-page .cv-aside__title {
  margin: 0 0 26px;
  padding-bottom: 12px;
  font: 800 1.35rem/1.3 Manrope, sans-serif;
  position: relative;
}
.cnk-landing-page .cv-card__title { color: #061d3d; }
.cnk-landing-page .cv-card__title::after,
.cnk-landing-page .cv-aside__title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 46px;
  height: 3px;
  background: var(--lp-red);
}

.cnk-landing-page .cv-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 22px; }
.cnk-landing-page .cv-field { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.cnk-landing-page .cv-field--full { grid-column: 1 / -1; margin-top: 16px; }
.cnk-landing-page .cv-field label { color: #061d3d; font-size: 13px; font-weight: 600; }
.cnk-landing-page .cv-req { color: var(--lp-red); }
.cnk-landing-page .cv-field input[type="text"],
.cnk-landing-page .cv-field input[type="email"],
.cnk-landing-page .cv-field input[type="tel"],
.cnk-landing-page .cv-field input[type="url"],
.cnk-landing-page .cv-field select,
.cnk-landing-page .cv-field textarea {
  width: 100%;
  min-height: 46px;
  padding: 11px 14px;
  border: 1px solid var(--lp-line);
  border-radius: 6px;
  background: #fff;
  color: #14243a;
  font: inherit;
  font-size: 14px;
  transition: border-color .18s ease, box-shadow .18s ease;
}
.cnk-landing-page .cv-field textarea { min-height: 118px; resize: vertical; line-height: 1.7; }
.cnk-landing-page .cv-field input:focus-visible,
.cnk-landing-page .cv-field select:focus-visible,
.cnk-landing-page .cv-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 .cv-field ::placeholder { color: #9aa4ae; }
/* Chrome trên Windows lấy màu nền hệ thống cho <select>; ép rõ để chế độ tối không đảo màu. */
.cnk-landing-page .cv-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 12px center; background-size: 16px; padding-right: 38px; }

/* --- vùng kéo thả tệp --- */
.cnk-landing-page .cv-drop {
  position: relative;
  display: grid;
  justify-items: center;
  gap: 4px;
  padding: 26px 20px;
  border: 1px dashed #c2ced8;
  border-radius: 8px;
  background: #fbfcfd;
  text-align: center;
  transition: border-color .18s ease, background-color .18s ease;
}
/* Ô chọn tệp thật phủ kín vùng này: bấm đâu cũng mở hộp thoại, kéo thả vẫn chạy
   bằng cơ chế sẵn có của trình duyệt mà không cần script. */
.cnk-landing-page .cv-drop input[type="file"] {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
}
.cnk-landing-page .cv-drop.is-dragging { border-color: var(--lp-red); background: #fdf6f6; }
.cnk-landing-page .cv-drop.has-file { border-style: solid; border-color: var(--lp-blue); background: #f2f7fa; }
.cnk-landing-page .cv-drop__icon svg { width: 30px; height: 30px; fill: none; stroke: var(--lp-red); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.cnk-landing-page .cv-drop__title { color: #061d3d; font-size: 14px; font-weight: 700; }
.cnk-landing-page .cv-drop__hint { color: var(--lp-gray); font-size: 13px; }
.cnk-landing-page .cv-drop__hint b { color: var(--lp-red); }
.cnk-landing-page .cv-drop__limit { color: #8b949d; font-size: 12px; }
.cnk-landing-page .cv-drop .wpcf7-not-valid-tip { position: relative; z-index: 1; }

/* --- đồng ý xử lý dữ liệu --- */
.cnk-landing-page .cv-consent { margin-top: 22px; }
.cnk-landing-page .cv-consent .wpcf7-list-item { margin: 0; }
.cnk-landing-page .cv-consent label { display: flex; align-items: flex-start; gap: 10px; color: var(--lp-gray); font-size: 13px; line-height: 1.65; cursor: pointer; }
.cnk-landing-page .cv-consent input[type="checkbox"] { flex: 0 0 auto; width: 17px; height: 17px; margin-top: 2px; accent-color: var(--lp-red); }
.cnk-landing-page .cv-consent a { color: var(--lp-red); font-weight: 600; text-decoration: underline; }

.cnk-landing-page .cv-submit,
.cnk-landing-page input.cv-submit {
  width: 100%;
  min-height: 52px;
  margin-top: 20px;
  border: 0;
  border-radius: 6px;
  background: var(--lp-red);
  color: #fff;
  font: inherit;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: background-color .18s ease;
}
.cnk-landing-page .cv-submit:hover { background: #8d1b1b; }
.cnk-landing-page .cv-secure { display: flex; align-items: center; justify-content: center; gap: 7px; margin: 16px 0 0; color: #8b949d; font-size: 12px; }
.cnk-landing-page .cv-secure svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.6; }

/* --- thẻ navy bên phải --- */
.cnk-landing-page .cv-aside {
  padding: 32px 30px;
  border-radius: 12px;
  background: linear-gradient(168deg, #071f3c 0%, #0d2d4e 62%, #123a5c 100%);
  color: #fff;
}
.cnk-landing-page .cv-aside__title { color: #fff; }
.cnk-landing-page .cv-aside__title + .cv-benefit { margin-top: 0; }
.cnk-landing-page .cv-benefit { display: grid; grid-template-columns: 44px 1fr; gap: 14px; margin-top: 22px; }
.cnk-landing-page .cv-benefit__icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 10px; background: rgba(255,255,255,.09); }
.cnk-landing-page .cv-benefit__icon svg { width: 21px; height: 21px; fill: none; stroke: #fff; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.cnk-landing-page .cv-benefit strong { display: block; margin-bottom: 5px; color: #fff; font-size: 14.5px; font-weight: 700; }
.cnk-landing-page .cv-benefit p { margin: 0; color: rgba(255,255,255,.72); font-size: 13px; line-height: 1.65; }
.cnk-landing-page .cv-aside__divider { height: 1px; margin: 30px 0; background: rgba(255,255,255,.16); }

/* Các bước nối bằng đường đứt để mắt đi theo thứ tự. */
.cnk-landing-page .cv-steps { display: grid; gap: 22px; }
.cnk-landing-page .cv-step { position: relative; display: grid; grid-template-columns: 44px 1fr; gap: 14px; }
.cnk-landing-page .cv-step:not(:last-child)::before {
  content: "";
  position: absolute;
  left: 21px;
  top: 48px;
  bottom: -22px;
  border-left: 1px dashed rgba(255,255,255,.3);
}
.cnk-landing-page .cv-step__icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 10px; background: rgba(255,255,255,.09); }
.cnk-landing-page .cv-step__icon svg { width: 20px; height: 20px; fill: none; stroke: #fff; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.cnk-landing-page .cv-step strong { display: block; margin-bottom: 5px; color: #fff; font-size: 14.5px; font-weight: 700; }
.cnk-landing-page .cv-step p { margin: 0; color: rgba(255,255,255,.72); font-size: 13px; line-height: 1.65; }

/* --- dải ba lợi ích --- */
.cnk-landing-page .cv-strip {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 26px;
  border: 1px solid var(--lp-line);
  border-radius: 12px;
  background: #fff;
}
.cnk-landing-page .cv-strip__item { display: grid; grid-template-columns: 52px 1fr; gap: 16px; padding: 26px 24px; }
.cnk-landing-page .cv-strip__item + .cv-strip__item { border-left: 1px solid var(--lp-line); }
.cnk-landing-page .cv-strip__icon { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: #f1f4f7; }
.cnk-landing-page .cv-strip__icon svg { width: 23px; height: 23px; fill: none; stroke: #061d3d; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.cnk-landing-page .cv-strip strong { display: block; margin-bottom: 6px; color: #061d3d; font-size: 14.5px; font-weight: 700; }
.cnk-landing-page .cv-strip p { margin: 0; color: var(--lp-gray); font-size: 13px; line-height: 1.65; }

/* --- câu hỏi thường gặp --- */
.cnk-landing-page .cv-faq { margin: 26px 0 0; padding: 30px 24px 34px; border: 1px solid var(--lp-line); border-radius: 12px; background: #fff; }
.cnk-landing-page .cv-faq__title { margin: 0 0 26px; color: #061d3d; font: 800 1.2rem Manrope, sans-serif; text-align: center; }
.cnk-landing-page .cv-faq__grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.cnk-landing-page .cv-faq__item { display: grid; grid-template-columns: 48px 1fr; gap: 14px; padding: 0 22px; }
.cnk-landing-page .cv-faq__item + .cv-faq__item { border-left: 1px solid var(--lp-line); }
.cnk-landing-page .cv-faq__icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: #f1f4f7; }
.cnk-landing-page .cv-faq__icon svg { width: 21px; height: 21px; fill: none; stroke: #061d3d; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.cnk-landing-page .cv-faq strong { display: block; margin-bottom: 6px; color: #061d3d; font-size: 14px; font-weight: 700; }
.cnk-landing-page .cv-faq p { margin: 0; color: var(--lp-gray); font-size: 13px; line-height: 1.65; }

/* --- khổ hẹp --- */
@media (max-width: 1000px) {
  .cnk-landing-page .cv-layout { grid-template-columns: 1fr; }
  .cnk-landing-page .cv-strip,
  .cnk-landing-page .cv-faq__grid { grid-template-columns: 1fr; }
  .cnk-landing-page .cv-strip__item + .cv-strip__item,
  .cnk-landing-page .cv-faq__item + .cv-faq__item { border-left: 0; border-top: 1px solid var(--lp-line); }
  .cnk-landing-page .cv-faq__item { padding: 22px; }
  .cnk-landing-page .cv-faq__item:first-child { padding-top: 0; }
}
@media (max-width: 620px) {
  .cnk-landing-page .cv-card { padding: 24px 20px; }
  .cnk-landing-page .cv-aside { padding: 26px 20px; }
  .cnk-landing-page .cv-grid { grid-template-columns: 1fr; }
}

/* --- nền chung của phần thân --- */
.cnk-landing-page .cv-section { padding: 0 0 60px; background: #f5f7f9; }

/* Chữ trong hàng biểu tượng: dòng tên đậm, dòng mô tả nhạt hơn. */
.cnk-landing-page .cv-benefit__body p,
.cnk-landing-page .cv-step__body p,
.cnk-landing-page .cv-strip__item__body p,
.cnk-landing-page .cv-faq__item__body p { margin: 0; }
.cnk-landing-page .cv-benefit__name,
.cnk-landing-page .cv-step__name { margin-bottom: 5px !important; color: #fff; }
.cnk-landing-page .cv-strip__item__name,
.cnk-landing-page .cv-faq__item__name { margin-bottom: 6px !important; color: #061d3d; }
.cnk-landing-page .cv-benefit__name strong,
.cnk-landing-page .cv-step__name strong { color: #fff; font-size: 14.5px; }
.cnk-landing-page .cv-strip__item__name strong,
.cnk-landing-page .cv-faq__item__name strong { color: #061d3d; font-size: 14px; }
.cnk-landing-page .cv-strip__item__body p,
.cnk-landing-page .cv-faq__item__body p { color: var(--lp-gray); font-size: 13px; line-height: 1.65; }
.cnk-landing-page .cv-benefit__body p,
.cnk-landing-page .cv-step__body p { color: rgba(255,255,255,.72); font-size: 13px; line-height: 1.65; }

/* Bộ style biểu mẫu dùng chung vẽ sẵn một thẻ nền trắng có viền. Ở trang này thẻ
   ngoài đã là `.cv-card`, giữ nguyên sẽ thành thẻ lồng trong thẻ. */
.cnk-landing-page .cv-card .wpcf7,
.cnk-landing-page .cv-card .cv-form {
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
}

/* Nút gửi cũng phải có vòng focus như các ô nhập; nút không viền nên dùng quầng. */
.cnk-landing-page .cv-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);
}