/* Trang hồ sơ người sáng lập.
   Mockup dùng tông xanh lá; ở đây giữ bảng màu thương hiệu (navy + đỏ CNK) như
   các trang khác, chỉ lấy bố cục. Dùng lại hero tối, hỏi đáp gập mở (hb-faq) và
   dải CTA. Phần riêng: hero có thẻ tên chồng lên ảnh, bảng thông tin, ba cột
   giới thiệu, hai bảng bài toán, dải bảy bước và khối kết nối. */

/* --- hero --- */
.cnk-landing-page .fp-hero .lp-hero__grid { min-height: 0; padding: 34px 0 44px; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); align-items: center; }
.cnk-landing-page .fp-hero__media { position: relative; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 26px; align-items: center; }
.cnk-landing-page .fp-portrait { position: relative; }
.cnk-landing-page .fp-portrait img { display: block; width: 100%; max-width: 330px; margin-left: auto; border-radius: 10px; }
.cnk-landing-page .fp-namecard { position: absolute; right: 0; bottom: 16px; padding: 12px 16px; border-radius: 8px; background: rgba(6,29,61,.92); backdrop-filter: blur(6px); }
.cnk-landing-page .fp-namecard strong { display: block; color: #fff; font-size: 12.5px; font-weight: 800; letter-spacing: .06em; }
.cnk-landing-page .fp-namecard span { display: block; color: rgba(255,255,255,.72); font-size: 11px; line-height: 1.6; }
.cnk-landing-page .fp-hero__quote p { margin: 0; color: #fff; font: 600 1.05rem/1.7 Manrope, sans-serif; }
.cnk-landing-page .fp-hero__quote p::before { content: "”"; display: block; margin-bottom: 4px; color: var(--lp-red); font: 800 2.4rem/.4 Manrope, sans-serif; }

/* Nút có biểu tượng LinkedIn ở hero. */
.cnk-landing-page .fp-hero .lp-button--light .wp-block-button__link::after {
  content: ""; width: 17px; height: 17px; margin-left: 2px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.6' stroke-linecap='round'%3E%3Crect x='3.5' y='3.5' width='17' height='17' rx='2.5'/%3E%3Cpath d='M7.6 10v6.4M7.6 7.6v.01M11.2 16.4V10M11.2 12.6c0-1.5 1-2.6 2.4-2.6s2.4 1.1 2.4 2.6v3.8'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* --- tiêu đề đánh số --- */
.cnk-landing-page .fp-h2 { margin: 0 0 14px; padding-bottom: 10px; position: relative; color: #061d3d; font: 800 1.05rem/1.4 Manrope, sans-serif; }
.cnk-landing-page .fp-h2::after { content: ""; position: absolute; left: 0; bottom: 0; width: 34px; height: 3px; background: var(--lp-red); }
.cnk-landing-page .fp-num { color: var(--lp-red); }

/* --- ba cột giới thiệu --- */
.cnk-landing-page .fp-intro { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; align-items: start; }
.cnk-landing-page .fp-intro p { color: var(--lp-gray); font-size: 12.5px; line-height: 1.8; }
.cnk-landing-page .fp-intro strong { color: #061d3d; }

/* Bảng thông tin nhanh */
.cnk-landing-page .fp-facts { margin-top: 16px; padding: 6px 16px; border: 1px solid var(--lp-line); border-radius: 10px; background: #fff; }
.cnk-landing-page .fp-fact { display: grid; grid-template-columns: 26px minmax(0, .8fr) minmax(0, 1.2fr); gap: 10px; padding: 11px 0; border-bottom: 1px solid var(--lp-line); align-items: start; }
.cnk-landing-page .fp-fact:last-child { border-bottom: 0; }
.cnk-landing-page .fp-fact svg { width: 17px; height: 17px; margin-top: 2px; fill: none; stroke: var(--lp-red); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.cnk-landing-page .fp-fact dt, .cnk-landing-page .fp-fact__key { color: var(--lp-gray); font-size: 11.5px; }
.cnk-landing-page .fp-fact__val { color: #061d3d; font-size: 11.5px; font-weight: 600; line-height: 1.6; }

/* Trích dẫn trong cột giữa */
.cnk-landing-page .fp-quote { margin-top: 18px; padding: 18px 20px; border-radius: 10px; background: #f3f6f8; }
.cnk-landing-page .fp-quote p { margin: 0; color: #33455f; font: italic 500 12.5px/1.8 "Be Vietnam Pro", sans-serif; }
.cnk-landing-page .fp-quote p::before { content: "”"; display: block; color: #c8d2da; font: 800 2rem/.5 Manrope, sans-serif; }

/* Danh sách góc nhìn */
.cnk-landing-page .fp-view { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 11px; margin-bottom: 16px; }
.cnk-landing-page .fp-view svg { width: 19px; height: 19px; margin-top: 2px; fill: none; stroke: var(--lp-red); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.cnk-landing-page .fp-view strong { display: block; margin-bottom: 3px; color: #061d3d; font-size: 12.5px; font-weight: 700; }
.cnk-landing-page .fp-view p { margin: 0; color: var(--lp-gray); font-size: 11.5px; line-height: 1.65; }

/* --- hai bảng bài toán --- */
.cnk-landing-page .fp-focus { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.cnk-landing-page .fp-focus__card { padding: 22px; border: 1px solid var(--lp-line); border-radius: 10px; background: #fff; }
.cnk-landing-page .fp-focus__head { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.cnk-landing-page .fp-focus__head span { display: grid; place-items: center; flex: 0 0 40px; width: 40px; height: 40px; border-radius: 50%; background: #061d3d; }
.cnk-landing-page .fp-focus__head svg { width: 20px; height: 20px; fill: none; stroke: #fff; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.cnk-landing-page .fp-focus__head strong { color: #061d3d; font-size: 13.5px; font-weight: 800; }
.cnk-landing-page .fp-focus ul { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 20px; margin: 0; padding: 0; list-style: none; }
.cnk-landing-page .fp-focus li { position: relative; padding: 5px 0 5px 14px; color: #33455f; font-size: 11.5px; line-height: 1.6; }
.cnk-landing-page .fp-focus li::before { content: "•"; position: absolute; left: 0; color: var(--lp-red); }

/* --- dải bảy bước --- */
.cnk-landing-page .fp-steps { display: grid; grid-template-columns: repeat(7, 1fr); gap: 10px; }
.cnk-landing-page .fp-step { position: relative; padding: 26px 12px 16px; border: 1px solid var(--lp-line); border-radius: 8px; background: #fff; text-align: center; }
.cnk-landing-page .fp-step__num { position: absolute; top: -13px; left: 50%; transform: translateX(-50%); display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--lp-red); color: #fff; font: 800 11px Manrope, sans-serif; }
.cnk-landing-page .fp-step__icon { display: block; width: 26px; height: 26px; margin: 0 auto 10px; fill: none; stroke: var(--lp-red); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }
.cnk-landing-page .fp-step strong { display: block; margin-bottom: 6px; color: #061d3d; font-size: 11.5px; font-weight: 700; line-height: 1.4; }
.cnk-landing-page .fp-step p { margin: 0; color: var(--lp-gray); font-size: 10.5px; line-height: 1.6; }

/* --- ba khối cuối --- */
.cnk-landing-page .fp-bottom { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; align-items: start; }
.cnk-landing-page .fp-panel { padding: 22px; border: 1px solid var(--lp-line); border-radius: 10px; background: #fff; }
.cnk-landing-page .fp-message p { color: #33455f; font-size: 12.5px; line-height: 1.8; }
.cnk-landing-page .fp-message > p:first-of-type::before,
.cnk-landing-page .fp-message > .wp-block-group__inner-container > p:first-of-type::before { content: "”"; display: block; color: #c8d2da; font: 800 2rem/.5 Manrope, sans-serif; }
.cnk-landing-page .fp-signature { display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 12px; align-items: center; margin-top: 16px; }
.cnk-landing-page .fp-signature img { width: 46px; height: 46px; border-radius: 50%; object-fit: cover; }
.cnk-landing-page .fp-signature strong { display: block; color: #061d3d; font-size: 12.5px; }
.cnk-landing-page .fp-signature span { display: block; color: var(--lp-gray); font-size: 11px; line-height: 1.5; }
.cnk-landing-page .fp-connect p { color: var(--lp-gray); font-size: 12px; line-height: 1.7; }
.cnk-landing-page .fp-connect__links a { display: flex; align-items: center; gap: 10px; margin-top: 10px; padding: 12px 14px; border: 1px solid var(--lp-line); border-radius: 8px; color: #061d3d; font-size: 12px; font-weight: 600; text-decoration: none; }
.cnk-landing-page .fp-connect__links a:hover { border-color: var(--lp-blue); }
.cnk-landing-page .fp-connect__links svg { flex: 0 0 17px; width: 17px; height: 17px; fill: none; stroke: var(--lp-red); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }

/* Hỏi đáp trang hồ sơ xếp hai cột như mockup; sáu câu một cột kéo trang quá dài. */
.cnk-landing-page .fp-faq { display: grid; grid-template-columns: 1fr 1fr; gap: 0 20px; }
.cnk-landing-page .fp-faq details { margin-bottom: 12px; }

/* --- khổ hẹp --- */
@media (max-width: 1200px) {
  .cnk-landing-page .fp-steps { grid-template-columns: repeat(4, 1fr); row-gap: 26px; }
  .cnk-landing-page .fp-intro,
  .cnk-landing-page .fp-bottom { grid-template-columns: 1fr 1fr; }
  .cnk-landing-page .fp-intro > :last-child,
  .cnk-landing-page .fp-bottom > :last-child { grid-column: 1 / -1; }
}
@media (max-width: 1100px) {
  .cnk-landing-page .fp-hero .lp-hero__grid { grid-template-columns: 1fr; }
  .cnk-landing-page .fp-focus { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .cnk-landing-page .fp-faq,
  .cnk-landing-page .fp-intro,
  .cnk-landing-page .fp-bottom,
  .cnk-landing-page .fp-hero__media,
  .cnk-landing-page .fp-focus ul { grid-template-columns: 1fr; }
  .cnk-landing-page .fp-steps { grid-template-columns: 1fr 1fr; }
  .cnk-landing-page .fp-portrait img { margin-inline: auto; }
  .cnk-landing-page .fp-namecard { position: static; margin-top: 12px; }
  .cnk-landing-page .fp-fact { grid-template-columns: 26px minmax(0, 1fr); }
  .cnk-landing-page .fp-fact__val { grid-column: 2; }
}
