:root {
  --landing-ink: #12233d;
  --landing-muted: #5c6d83;
  --landing-blue: #0756d8;
  --landing-orange: #f08b20;
  --landing-paper: #f5f7fb;
  --landing-line: #dfe6ef;
  --landing-wrap: min(1160px, calc(100% - 48px));
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--landing-ink); background: #fff; font-family: "DM Sans", Arial, sans-serif; line-height: 1.6; }
a { color: inherit; }
.landing-wrap { width: var(--landing-wrap); margin-inline: auto; }
.landing-header { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: 14px max(24px, calc((100% - 1160px) / 2)); background: #fff; }
.landing-brand { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; }
.landing-brand img { width: 112px; height: auto; object-fit: contain; }
.landing-brand strong, .landing-brand small { display: block; letter-spacing: .08em; }
.landing-brand strong { font: 800 16px/1.1 Outfit, Arial, sans-serif; }
.landing-brand small { margin-top: 4px; color: var(--landing-muted); font-size: 9px; font-weight: 700; }
.landing-header nav { display: flex; align-items: center; gap: 24px; font-size: 14px; font-weight: 700; }
.landing-header nav a { text-decoration: none; }
.landing-header nav a:hover { color: var(--landing-blue); }
.landing-nav-cta { padding: 10px 16px; color: #fff !important; background: var(--landing-blue); border-radius: 999px; }
.landing-hero { min-height: 690px; position: relative; display: grid; align-items: center; overflow: hidden; color: #fff; }
.landing-hero-image, .landing-hero-overlay { position: absolute; inset: 0; }
.landing-hero-image { background: center / cover url("assets/images/hero-china-color-v2.webp"); }
.landing-hero-overlay { background: linear-gradient(90deg, rgba(8, 26, 54, .86), rgba(8, 26, 54, .38) 62%, rgba(8, 26, 54, .14)); }
.landing-hero-content { position: relative; padding-block: 100px; }
.landing-eyebrow, .landing-kicker { margin: 0 0 14px; color: var(--landing-orange); font-size: 12px; font-weight: 800; letter-spacing: .16em; }
.landing-hero h1 { max-width: 760px; margin: 0; font: 800 clamp(42px, 6vw, 78px)/1.03 Outfit, Arial, sans-serif; letter-spacing: -.035em; }
.landing-lead { max-width: 620px; margin: 26px 0 0; color: rgba(255,255,255,.88); font-size: clamp(17px, 2vw, 21px); }
.landing-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 22px; margin-top: 34px; }
.landing-button { border: 0; display: inline-flex; align-items: center; justify-content: center; gap: 14px; padding: 15px 22px; border-radius: 4px; cursor: pointer; font: 800 14px/1 Outfit, Arial, sans-serif; text-decoration: none; }
.landing-button span, .landing-text-link span { font-size: 20px; line-height: .7; }
.landing-button-primary { color: #fff; background: var(--landing-blue); box-shadow: 0 10px 26px rgba(7, 86, 216, .2); }
.landing-button-primary:hover { background: #0649b6; }
.landing-text-link { color: #fff; font-weight: 800; text-decoration: none; }
.landing-trust { display: flex; flex-wrap: wrap; gap: 30px; margin-top: 86px; }
.landing-trust span { display: grid; grid-template-columns: auto 1fr; column-gap: 10px; align-items: center; min-width: 150px; }
.landing-trust b { grid-row: span 2; color: var(--landing-orange); font: 700 28px/1 Outfit, Arial, sans-serif; }
.landing-trust small { color: rgba(255,255,255,.75); font-size: 12px; }
.landing-intro { display: grid; grid-template-columns: 1.1fr 1fr; gap: 80px; padding-block: 100px; }
.landing-intro h2, .landing-section-heading h2, .landing-planner h2 { margin: 0; font: 800 clamp(32px, 4vw, 52px)/1.08 Outfit, Arial, sans-serif; letter-spacing: -.025em; }
.landing-intro > p { align-self: end; margin: 0; color: var(--landing-muted); font-size: 18px; }
.landing-section { padding-block: 92px; }
.landing-paper { background: var(--landing-paper); }
.landing-paper > .landing-wrap { width: var(--landing-wrap); }
.landing-section-heading { max-width: 690px; }
.landing-benefits, .landing-process-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 46px; }
.landing-benefits article, .landing-process-grid article { padding: 28px; border: 1px solid var(--landing-line); background: #fff; }
.landing-benefits article > span { color: var(--landing-blue); font: 800 24px/1 Outfit, Arial, sans-serif; }
.landing-benefits h3, .landing-process-grid h3 { margin: 28px 0 8px; font: 800 23px/1.15 Outfit, Arial, sans-serif; }
.landing-benefits p, .landing-process-grid p { margin: 0; color: var(--landing-muted); }
.landing-process { padding-block: 100px; }
.landing-process-grid article { position: relative; padding-top: 34px; }
.landing-process-grid strong { color: var(--landing-orange); font: 800 38px/1 Outfit, Arial, sans-serif; }
.landing-process-grid h3 { margin-top: 22px; }
.landing-route-band { padding-block: 90px; color: #fff; background: var(--landing-ink); }
.landing-route-band h2 { margin: 0; font: 800 clamp(32px, 4vw, 52px)/1.08 Outfit, Arial, sans-serif; }
.landing-route-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-top: 40px; }
.landing-route-grid a { min-height: 150px; display: flex; flex-direction: column; justify-content: space-between; padding: 22px; border: 1px solid rgba(255,255,255,.2); text-decoration: none; }
.landing-route-grid a:hover { border-color: var(--landing-orange); }
.landing-route-grid b { font: 800 20px/1.2 Outfit, Arial, sans-serif; }
.landing-route-grid span { color: rgba(255,255,255,.7); font-size: 14px; }
.landing-planner { display: grid; grid-template-columns: .9fr 1.1fr; gap: 80px; padding-block: 110px; scroll-margin-top: 30px; }
.landing-planner-copy > p:not(.landing-kicker) { color: var(--landing-muted); font-size: 17px; }
.landing-planner-copy ul { padding: 0; margin: 32px 0 0; list-style: none; }
.landing-planner-copy li { padding: 11px 0 11px 28px; border-bottom: 1px solid var(--landing-line); position: relative; }
.landing-planner-copy li::before { content: "✓"; position: absolute; left: 0; color: var(--landing-blue); font-weight: 800; }
.landing-form { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; padding: 30px; border: 1px solid var(--landing-line); background: #fff; box-shadow: 0 20px 50px rgba(18,35,61,.09); }
.landing-form label { display: grid; gap: 7px; color: var(--landing-ink); font-size: 13px; font-weight: 800; }
.landing-form label span small { color: var(--landing-muted); font-weight: 500; }
.landing-form input, .landing-form select, .landing-form textarea { width: 100%; border: 1px solid #cbd5e1; border-radius: 3px; padding: 13px 14px; color: var(--landing-ink); background: #fff; font: inherit; }
.landing-form textarea { min-height: 128px; resize: vertical; }
.landing-form input:focus, .landing-form select:focus, .landing-form textarea:focus { outline: 2px solid rgba(7,86,216,.22); border-color: var(--landing-blue); }
.landing-form-wide, .landing-form button, .landing-form-note, .landing-form-feedback { grid-column: 1 / -1; }
.landing-form button { justify-self: start; }
.landing-form-note, .landing-form-feedback { margin: 0; color: var(--landing-muted); font-size: 12px; }
.landing-form-note a, .landing-consent a { color: var(--landing-blue); }
.landing-consent { display: flex; gap: 10px; align-items: flex-start; color: var(--landing-muted); font-size: 13px; line-height: 1.55; }
.landing-form .landing-consent input { width: auto; flex: 0 0 auto; margin-top: 4px; }
.landing-form-feedback { min-height: 20px; }
.landing-form-feedback.is-success { color: #237443; font-weight: 700; }
.landing-form-feedback.is-error { color: #a12727; font-weight: 700; }
.landing-faq { padding-block: 40px 110px; }
.landing-faq-grid { margin-top: 42px; border-top: 1px solid var(--landing-line); }
.landing-faq details { border-bottom: 1px solid var(--landing-line); }
.landing-faq summary { display: flex; justify-content: space-between; gap: 20px; padding: 22px 0; cursor: pointer; font: 800 18px/1.3 Outfit, Arial, sans-serif; list-style: none; }
.landing-faq summary::-webkit-details-marker { display: none; }
.landing-faq summary span { color: var(--landing-blue); font-size: 24px; }
.landing-faq details p { max-width: 760px; margin: -6px 0 22px; color: var(--landing-muted); }
.landing-footer { padding-block: 28px; color: rgba(255,255,255,.75); background: var(--landing-ink); font-size: 13px; }
.landing-footer .landing-wrap { display: flex; justify-content: space-between; gap: 20px; }
.landing-footer a { color: #fff; font-weight: 800; text-decoration: none; }

@media (max-width: 820px) {
  .landing-header { align-items: flex-start; flex-direction: column; }
  .landing-header nav { width: 100%; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
  .landing-intro, .landing-planner { grid-template-columns: 1fr; gap: 34px; }
  .landing-benefits, .landing-process-grid, .landing-route-grid { grid-template-columns: 1fr; }
  .landing-hero { min-height: 650px; }
  .landing-trust { margin-top: 58px; }
}

@media (max-width: 560px) {
  :root { --landing-wrap: min(100% - 32px, 1160px); }
  .landing-header { padding-inline: 16px; }
  .landing-brand img { width: 92px; }
  .landing-header nav { font-size: 12px; }
  .landing-hero-content { padding-block: 72px; }
  .landing-hero h1 { font-size: 43px; }
  .landing-trust { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
  .landing-trust span { display: block; min-width: 0; }
  .landing-trust b, .landing-trust small { display: block; }
  .landing-trust b { margin-bottom: 6px; font-size: 22px; }
  .landing-form { grid-template-columns: 1fr; padding: 20px; }
  .landing-form-wide, .landing-form button, .landing-form-note, .landing-form-feedback { grid-column: auto; }
  .landing-form button { width: 100%; }
  .landing-footer .landing-wrap { align-items: flex-start; flex-direction: column; }
}
