/* Trang dịch vụ tư vấn định hướng nghề nghiệp 1:1.
   Dùng lại hero tối + thẻ "Phù hợp với" (sv-hero-card), thẻ có icon (fd-pain),
   vùng kéo thả CV (cv-drop), hỏi đáp gập mở (hb-faq) và dải CTA đỏ (sv-cta).
   Phần riêng: tiêu đề đánh số, các lưới thẻ 5–7 cột, dải bước ngang có nhãn bên
   trái, ba gói dịch vụ nền tối, hai cột nội dung chính và biểu mẫu đăng ký. */

/* Tiêu đề có số thứ tự như mockup. */
.cnk-landing-page .cc-h2 { margin: 0 0 16px; color: #061d3d; font: 800 1.05rem/1.4 Manrope, sans-serif; }
.cnk-landing-page .cc-num { color: var(--lp-red); }

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

/* --- các lưới thẻ --- */
.cnk-landing-page .cc-grid { display: grid; gap: 14px; }
.cnk-landing-page .cc-grid--6 { grid-template-columns: repeat(6, 1fr); }
.cnk-landing-page .cc-grid--7 { grid-template-columns: repeat(7, 1fr); }
.cnk-landing-page .cc-tile { padding: 20px 14px; border: 1px solid var(--lp-line); border-radius: 8px; background: #fff; text-align: center; }
.cnk-landing-page .cc-tile svg { display: block; width: 26px; height: 26px; margin: 0 auto 12px; fill: none; stroke: #061d3d; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.cnk-landing-page .cc-tile strong { display: block; margin-bottom: 8px; color: #061d3d; font-size: 12px; font-weight: 700; line-height: 1.4; }
.cnk-landing-page .cc-tile p { margin: 0; color: var(--lp-gray); font-size: 11px; line-height: 1.6; }

/* Thẻ có icon lệch trái (mục 2). */
.cnk-landing-page .cc-tile--left { text-align: left; }
.cnk-landing-page .cc-tile--left svg { width: 22px; height: 22px; margin: 0 0 10px; stroke: var(--lp-red); }

/* --- dải bước ngang có nhãn bên trái --- */
.cnk-landing-page .cc-flow-row { display: grid; grid-template-columns: minmax(0, .62fr) minmax(0, 3fr); gap: 24px; align-items: center; }
.cnk-landing-page .cc-flow-row h2 { margin: 0; color: #061d3d; font: 800 1.05rem/1.45 Manrope, sans-serif; }
.cnk-landing-page .cc-flow { display: grid; gap: 12px; }
.cnk-landing-page .cc-flow--6 { grid-template-columns: repeat(6, 1fr); }
.cnk-landing-page .cc-flow--5 { grid-template-columns: repeat(5, 1fr); }
.cnk-landing-page .cc-flow__item { position: relative; padding-top: 34px; text-align: center; }
.cnk-landing-page .cc-flow__num { position: absolute; top: 0; left: 50%; transform: translateX(-50%); display: grid; place-items: center; width: 28px; height: 28px; border: 1px solid var(--lp-red); border-radius: 50%; background: #fff; color: var(--lp-red); font: 800 11px Manrope, sans-serif; }
.cnk-landing-page .cc-flow__item:not(:last-child)::after { content: ""; position: absolute; top: 14px; left: calc(50% + 20px); right: calc(-50% + 20px); border-top: 1px dashed #d8c2c2; }
.cnk-landing-page .cc-flow__item strong { display: block; margin-bottom: 5px; color: #061d3d; font-size: 11.5px; font-weight: 700; line-height: 1.4; }
.cnk-landing-page .cc-flow__item p { margin: 0; color: var(--lp-gray); font-size: 10.5px; line-height: 1.6; }

/* --- năm điều rõ hơn sau buổi tư vấn --- */
.cnk-landing-page .cc-gains { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.cnk-landing-page .cc-gain { padding: 16px 14px; border: 1px solid var(--lp-line); border-radius: 8px; background: #fff; }
.cnk-landing-page .cc-gain strong { display: flex; align-items: flex-start; gap: 8px; margin-bottom: 6px; color: #061d3d; font-size: 11.5px; font-weight: 700; line-height: 1.45; }
.cnk-landing-page .cc-gain strong::before { content: "✓"; flex: 0 0 auto; color: var(--lp-red); font-weight: 800; }
.cnk-landing-page .cc-gain p { margin: 0 0 0 16px; color: var(--lp-gray); font-size: 10.5px; line-height: 1.6; }

/* --- hai cột nội dung chính --- */
.cnk-landing-page .cc-main { display: grid; grid-template-columns: minmax(0, 1.85fr) minmax(0, 1fr); gap: 26px; align-items: start; }
.cnk-landing-page .cc-col { display: grid; gap: 26px; }

/* Ba gói dịch vụ nền tối */
.cnk-landing-page .cc-plans { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.cnk-landing-page .cc-plan { position: relative; display: flex; flex-direction: column; padding: 22px 20px; border-radius: 10px; color: #fff; background: linear-gradient(160deg, #061d3d 0%, #0d2d4e 100%); }
.cnk-landing-page .cc-plan--hot { outline: 2px solid var(--lp-red); outline-offset: -1px; }
.cnk-landing-page .cc-plan__badge { position: absolute; top: 14px; right: 14px; padding: 3px 9px; border-radius: 3px; background: var(--lp-red); color: #fff; font-size: 9px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.cnk-landing-page .cc-plan h3 { margin: 0 0 6px; color: #fff; font: 800 1.05rem Manrope, sans-serif; }
.cnk-landing-page .cc-plan > p,
.cnk-landing-page .cc-plan > .wp-block-group__inner-container > p { margin: 0 0 16px; color: rgba(255,255,255,.68); font-size: 11.5px; line-height: 1.6; }
.cnk-landing-page .cc-plan ul { margin: 0 0 20px; padding: 0; list-style: none; }
.cnk-landing-page .cc-plan li { position: relative; padding: 6px 0 6px 20px; color: rgba(255,255,255,.86); font-size: 11.5px; line-height: 1.5; }
.cnk-landing-page .cc-plan li::before { content: "✓"; position: absolute; left: 0; top: 6px; color: #e08a8a; font-weight: 800; }
.cnk-landing-page .cc-plan .wp-block-buttons { margin-top: auto; }
.cnk-landing-page .cc-plan .lp-button--primary .wp-block-button__link { width: 100%; padding-inline: 10px; font-size: 12.5px; text-align: center; white-space: nowrap; }

/* Bốn thẻ dịch vụ liên quan có ảnh */
.cnk-landing-page .cc-related { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.cnk-landing-page .cc-rcard { overflow: hidden; border: 1px solid var(--lp-line); border-radius: 8px; background: #fff; }
.cnk-landing-page .cc-rcard img { display: block; width: 100%; aspect-ratio: 16/10; object-fit: cover; }
.cnk-landing-page .cc-rcard__body { padding: 14px; }
.cnk-landing-page .cc-rcard strong { display: block; margin-bottom: 6px; color: #061d3d; font-size: 12px; font-weight: 700; line-height: 1.4; }
.cnk-landing-page .cc-rcard p { margin: 0 0 10px; color: var(--lp-gray); font-size: 11px; line-height: 1.6; }
.cnk-landing-page .cc-rcard a { color: var(--lp-red); font-size: 11.5px; font-weight: 700; text-decoration: none; }
.cnk-landing-page .cc-rcard a:hover { text-decoration: underline; }

/* --- vì sao chọn founder --- */
.cnk-landing-page .cc-why { padding: 22px; border: 1px solid var(--lp-line); border-radius: 10px; background: #fff; }
.cnk-landing-page .cc-why__grid { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 18px; align-items: start; }
.cnk-landing-page .cc-portrait { position: relative; overflow: hidden; border-radius: 8px; background: #0d2d4e; }
.cnk-landing-page .cc-portrait img { display: block; width: 100%; aspect-ratio: 3/4; object-fit: cover; }
.cnk-landing-page .cc-portrait figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 26px 12px 12px; background: linear-gradient(transparent, rgba(6,29,61,.92)); color: #fff; }
.cnk-landing-page .cc-portrait figcaption span { display: block; color: rgba(255,255,255,.72); font-size: 9.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.cnk-landing-page .cc-portrait figcaption strong { display: block; margin-top: 4px; font-size: 12.5px; font-weight: 800; }
.cnk-landing-page .cc-portrait figcaption em { display: block; color: rgba(255,255,255,.7); font-size: 10.5px; font-style: normal; }
.cnk-landing-page .cc-why ul { margin: 0; padding: 0; list-style: none; }
.cnk-landing-page .cc-why li { position: relative; padding: 8px 0 8px 20px; color: #33455f; font-size: 11.5px; line-height: 1.6; }
.cnk-landing-page .cc-why li::before { content: "✓"; position: absolute; left: 0; top: 8px; color: var(--lp-red); font-weight: 800; }

/* --- thẻ liên hệ founder --- */
.cnk-landing-page .cc-card { padding: 20px; border: 1px solid var(--lp-line); border-radius: 10px; background: #fff; }
.cnk-landing-page .cc-card__top { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 14px; align-items: center; margin-bottom: 14px; }
.cnk-landing-page .cc-card__top img { width: 76px; height: 76px; border-radius: 8px; object-fit: cover; }
.cnk-landing-page .cc-card__kicker { margin: 0 0 4px !important; color: var(--lp-gray); font-size: 10px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.cnk-landing-page .cc-card__name { margin: 0 !important; color: #061d3d; font-size: 13.5px; font-weight: 800; }
.cnk-landing-page .cc-card__role { margin: 2px 0 0 !important; color: var(--lp-gray); font-size: 11px; }
.cnk-landing-page .cc-card__links a { display: flex; align-items: center; gap: 9px; margin-bottom: 8px; color: #33455f; font-size: 11.5px; text-decoration: none; }
.cnk-landing-page .cc-card__links svg { flex: 0 0 15px; width: 15px; height: 15px; fill: none; stroke: var(--lp-red); stroke-width: 1.6; }
.cnk-landing-page .cc-card__links a:hover { color: var(--lp-red); text-decoration: underline; }
.cnk-landing-page .cc-card__sign { margin: 14px 0 0 !important; padding-top: 12px; border-top: 1px solid var(--lp-line); color: var(--lp-gray); font-size: 11px; }
.cnk-landing-page .cc-card__sign strong { display: block; color: #061d3d; font-size: 12px; }

/* --- biểu mẫu đăng ký --- */
.cnk-landing-page .cc-form { padding: 24px; border: 1px solid var(--lp-line); border-radius: 10px; background: #fff; }
.cnk-landing-page .cc-form .wpcf7, .cnk-landing-page .cc-form .cc-cf7 { margin: 0; padding: 0; border: 0; background: none; box-shadow: none; }
.cnk-landing-page .cc-grid-form { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px 14px; }
.cnk-landing-page .cc-field { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.cnk-landing-page .cc-field--full { grid-column: 1 / -1; }
.cnk-landing-page .cc-field label { color: #33455f; font-size: 11.5px; font-weight: 600; }
.cnk-landing-page .cc-req { color: var(--lp-red); }
.cnk-landing-page .cc-field input[type="text"],
.cnk-landing-page .cc-field input[type="email"],
.cnk-landing-page .cc-field input[type="tel"],
.cnk-landing-page .cc-field input[type="url"],
.cnk-landing-page .cc-field select,
.cnk-landing-page .cc-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: 12.5px;
}
.cnk-landing-page .cc-field textarea { height: 64px; min-height: 64px; resize: vertical; line-height: 1.6; }
.cnk-landing-page .cc-field input:focus-visible,
.cnk-landing-page .cc-field select:focus-visible,
.cnk-landing-page .cc-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 .cc-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: 32px; }

/* Hàng "muốn tư vấn về" + ô tải CV */
.cnk-landing-page .cc-wants-row { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 14px; margin-top: 14px; align-items: start; }
.cnk-landing-page .cc-wants { padding: 14px; border: 1px solid var(--lp-line); border-radius: 6px; }
.cnk-landing-page .cc-wants > label { display: block; margin-bottom: 10px; color: #33455f; font-size: 11.5px; font-weight: 600; }
.cnk-landing-page .cc-wants .wpcf7-checkbox { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 14px; }
.cnk-landing-page .cc-wants .wpcf7-list-item { margin: 0; }
.cnk-landing-page .cc-wants .wpcf7-list-item label { display: flex; align-items: center; gap: 8px; color: var(--lp-gray); font-size: 11.5px; cursor: pointer; }
.cnk-landing-page .cc-wants input[type="checkbox"] { width: 14px; height: 14px; accent-color: var(--lp-red); }
.cnk-landing-page .cc-upload > label { display: block; margin-bottom: 6px; color: #33455f; font-size: 11.5px; font-weight: 600; }
.cnk-landing-page .cc-drop { position: relative; display: grid; place-items: center; gap: 4px; min-height: 92px; padding: 14px; border: 1px dashed #c3ced6; border-radius: 6px; background: #fbfcfd; text-align: center; }
.cnk-landing-page .cc-drop input[type="file"] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.cnk-landing-page .cc-drop.is-dragging { border-color: var(--lp-red); background: #fdf6f6; }
.cnk-landing-page .cc-drop.has-file { border-style: solid; border-color: var(--lp-blue); background: #f2f7fa; }
.cnk-landing-page .cc-drop .cv-drop__title { color: #061d3d; font-size: 11.5px; font-weight: 600; }
.cnk-landing-page .cc-drop .cv-drop__hint { color: #9aa4ae; font-size: 10.5px; }

.cnk-landing-page .cc-consent { margin-top: 14px; }
.cnk-landing-page .cc-consent label { display: flex; align-items: flex-start; gap: 9px; color: var(--lp-gray); font-size: 11.5px; line-height: 1.6; cursor: pointer; }
.cnk-landing-page .cc-consent input[type="checkbox"] { flex: 0 0 auto; width: 15px; height: 15px; margin-top: 2px; accent-color: var(--lp-red); }
.cnk-landing-page .cc-consent a { color: var(--lp-red); }
.cnk-landing-page .cc-submit, .cnk-landing-page input.cc-submit {
  min-width: 220px; min-height: 44px; margin-top: 14px; padding: 0 24px; border: 0; border-radius: 5px;
  background: var(--lp-red); color: #fff; font: inherit; font-size: 13.5px; font-weight: 700; cursor: pointer;
}
.cnk-landing-page .cc-submit:hover { background: #8d1b1b; }
.cnk-landing-page .cc-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); }

/* --- khổ hẹp --- */
@media (max-width: 1200px) {
  .cnk-landing-page .cc-grid--6,
  .cnk-landing-page .cc-grid--7 { grid-template-columns: repeat(4, 1fr); }
  .cnk-landing-page .cc-gains { grid-template-columns: repeat(3, 1fr); }
  .cnk-landing-page .cc-main { grid-template-columns: 1fr; }
  .cnk-landing-page .cc-related { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 1100px) {
  .cnk-landing-page .cc-flow-row { grid-template-columns: 1fr; }
  .cnk-landing-page .cc-flow--6,
  .cnk-landing-page .cc-flow--5 { grid-template-columns: repeat(3, 1fr); row-gap: 26px; }
  .cnk-landing-page .cc-flow__item::after { display: none; }
  .cnk-landing-page .cc-plans { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .cnk-landing-page .cc-grid--6,
  .cnk-landing-page .cc-grid--7,
  .cnk-landing-page .cc-gains,
  .cnk-landing-page .cc-related,
  .cnk-landing-page .cc-grid-form,
  .cnk-landing-page .cc-wants-row,
  .cnk-landing-page .cc-why__grid,
  .cnk-landing-page .cc-wants .wpcf7-checkbox { grid-template-columns: 1fr; }
  .cnk-landing-page .cc-flow--6,
  .cnk-landing-page .cc-flow--5 { grid-template-columns: 1fr 1fr; }
  .cnk-landing-page .cc-form { padding: 20px 16px; }
  .cnk-landing-page .cc-submit { width: 100%; }
}