.consignment-landing {
  --co-ink: #0a174e;
  --co-copy: #526b96;
  --co-blue: #006bff;
  --co-green: #009e88;
  background: #fff;
  color: var(--co-ink);
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.4;
}
.consignment-landing * { box-sizing: border-box; }
.consignment-landing h1, .consignment-landing h2, .consignment-landing h3 { color: var(--co-ink); font-weight: 700; letter-spacing: -.035em; }
.consignment-landing h2 { font-size: 25px; line-height: 1.15; margin: 0 0 6px; }
.consignment-landing h3 { font-size: 16px; line-height: 1.2; margin: 0 0 8px; letter-spacing: -.02em; }
.consignment-landing p { margin: 0; color: var(--co-copy); }
.co-container { width: min(1200px, 94%); margin-inline: auto; }
.co-hero { background: radial-gradient(ellipse at 65% 20%, #d4eafa, transparent 62%), linear-gradient(115deg, #eaf6ff, #fff 77%); overflow: hidden; }
.co-hero-grid { display: grid; grid-template-columns: 42% 58%; align-items: center; min-height: 475px; padding: 30px 17px 25px; }
.co-badge { display: inline-flex; align-items: center; gap: 8px; background: #f9fdff; border-radius: 30px; box-shadow: 0 3px 12px #174d9610; padding: 6px 13px; color: #0064f5; font-size: 14px; }
.co-intro h1 { font-size: clamp(37px, 4.15vw, 55px); line-height: .99; letter-spacing: -.045em; margin: 18px 0 14px; }
.co-intro h1 > span { color: var(--co-blue); }
.co-intro > p { font-size: 19px; line-height: 1.35; max-width: 470px; }
.co-actions { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 22px; }
.co-button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; border: 1px solid var(--co-blue); border-radius: 5px; padding: 13px 22px; background: var(--co-blue); color: #fff; text-decoration: none; font-size: 14px; font-weight: 600; transition: background .15s, transform .15s; }
.co-button:hover { color: #fff; background: #0056d2; transform: translateY(-2px); }
.co-button-outline { background: #ffffffa0; color: var(--co-blue); }
.consignment-landing a:focus-visible { outline: 3px solid #8b49ef; outline-offset: 4px; }
.co-trust { list-style: none; padding: 0; margin: 23px 0 0; display: flex; gap: 24px; font-size: 10px; }
.co-trust li:before { content: '✓'; display: inline-grid; place-items: center; width: 18px; height: 18px; margin-right: 6px; background: #00b791; color: #fff; border-radius: 5px; font-size: 12px; }
.co-visual { position: relative; height: 420px; min-width: 0; }
.co-dashboard { position: absolute; z-index: 2; background: #fff; border: 1px solid #dce5f0; border-radius: 13px; overflow: hidden; box-shadow: 0 10px 24px #163b732b; }
.co-dashboard-customer { width: 87%; top: 0; left: 1%; transform: perspective(1100px) rotateY(-3deg) rotateZ(-1deg); }
.co-appbar { display: flex; gap: 20px; align-items: center; padding: 9px 10px; background: linear-gradient(90deg,#0060e9,#0073fa); color: #fff; font-size: 13px; }
.co-search { background: #e3efff; color: #88a6cb; border-radius: 3px; padding: 5px 9px; font-size: 7px; width: 155px; }
.co-app-user { margin-left: auto; font-size: 7px; }
.co-app-body { padding: 12px 10px 18px; }
.co-app-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 12px; line-height: 1.2; }
.co-app-title > span { padding: 5px; border: 1px solid #94bdff; color: #006aff; border-radius: 3px; font-size: 6px; white-space: nowrap; }
.consignment-landing .co-breadcrumb { font-size: 7px; color: #6b8dbe; margin: 3px 0 11px; }
.co-app-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; }
.co-app-metrics > div { display: flex; align-items: center; gap: 7px; border: 1px solid #e0eceb; border-radius: 5px; padding: 10px 6px; }
.co-app-metrics i { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 50%; background: #dff9ef; color: #00b57b; font-size: 13px; }
.co-app-metrics > div:nth-child(2) { border-color: #ffebd6; }
.co-app-metrics > div:nth-child(2) i { color: #fb8611; background: #fff0df; }
.co-app-metrics > div:nth-child(4) { border-color: #ffe0e3; }
.co-app-metrics > div:nth-child(4) i { color: #ff4d63; background: #ffe6e9; }
.co-app-metrics p { font-size: 6px; }
.co-app-metrics strong { display: block; color: #071b52; font-size: 16px; }
.co-filters { display: grid; grid-template-columns: .85fr .85fr 1fr 1fr 1.4fr; gap: 7px; background: #f5f9ff; padding: 7px 5px; margin: 9px 0; font-size: 6px; color: #5475a7; align-items: end; }
.co-filters b { display: block; padding: 6px 4px; background: #fff; border: 1px solid #dfebf7; border-radius: 3px; margin-top: 4px; font-size: 6px; font-weight: 400; white-space: nowrap; }
.co-filter-search { border: 1px solid #dfebf7; border-radius: 3px; padding: 6px 3px; background: #fff; white-space: nowrap; }
.co-table { width: 100%; border-collapse: collapse; font-size: 7px; color: #35568a; }
.co-table th { background: #f3f7ff; color: #243e71; font-weight: 600; }
.co-table th, .co-table td { padding: 7px 4px; border-bottom: 1px solid #f0f4f9; text-align: left; }
.co-table td:nth-child(2) { color: #006aff; }
.co-table td { white-space: nowrap; }
.co-state { display: inline-block; padding: 3px 5px; border-radius: 4px; font-size: 7px; line-height: 1.2; }
.co-paid { background: #d2f6e5; color: #008c61; }
.co-pending { background: #ffead0; color: #e97c00; }
.co-overdue { background: #ffe0e4; color: #d94a59; }
.co-dashboard-supplier { width: 85%; top: 300px; left: 8%; z-index: 3; transform: rotate(1deg); }
.co-dashboard-supplier .co-appbar { display: none; }
.co-dashboard-supplier .co-app-body { border-left: 55px solid #eef5ff; padding-top: 12px; }
.co-dashboard-supplier:before { content: '☁cloudya'; position: absolute; left: 0; top: 0; width: 55px; height: 30px; background: #006aff; color: white; font-size: 11px; padding: 8px 3px; }
.co-dashboard-supplier:after { content: '▣ Liquidaciones\A\A ▤ Reportes\A\A ▣ Facturas'; white-space: pre; position: absolute; left: 5px; top: 42px; font-size: 6px; color: #5476a6; }
.co-dashboard-supplier .co-app-title { font-size: 11px; }
.co-note { position: absolute; right: -1%; top: 57px; color: #006aff; font-size: 16px; font-style: italic; line-height: 1.15; transform: rotate(-8deg); z-index: 1; }
.co-note > span { display: block; font-size: 55px; line-height: 1; }
.co-boxes { position: absolute; width: 145px; height: 205px; right: -12%; bottom: 6px; }
.co-boxes > span { position: absolute; width: 109px; height: 94px; background: linear-gradient(90deg,#aa7c50,#d8b68e 18%,#c99e71 77%,#ad825d); border: 1px solid #b88f66; box-shadow: 5px 6px 9px #543d2520; border-radius: 2px; }
.co-boxes > span:before { content: ''; position: absolute; top: 0; left: 46%; width: 19px; height: 28px; background: #b58c61; }
.co-boxes > span:after { content: ''; position: absolute; right: 9px; bottom: 9px; width: 23px; height: 29px; background: repeating-linear-gradient(90deg,#3d3025 0 1px,#f4ecdf 1px 3px); border: 4px solid #f4ecdf; }
.co-boxes > span:nth-child(1) { bottom: 0; left: 0; }
.co-boxes > span:nth-child(2) { bottom: 96px; left: 7px; }
.co-boxes > span:nth-child(3) { bottom: 2px; left: 112px; }
.co-section { padding-top: 27px; }
.co-heading { text-align: center; margin-bottom: 17px; }
.co-heading p { font-size: 14px; }
.co-features { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; }
.co-feature { padding: 14px 17px 18px; border: 1px solid #e8eef6; border-radius: 9px; box-shadow: 0 3px 10px #315e9003; }
.co-feature p { font-size: 14px; line-height: 1.35; }
.co-icon { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 15px; font-size: 28px; background: #e8f3ff; color: #0071ff; flex-shrink: 0; margin-bottom: 10px; }
.co-tone-1, .co-tone-2, .co-tone-4 { background: #f1eaff; color: #8842fa; }
.co-tone-2 { color: #006bff; }
.co-tone-3 { background: #def8ed; color: #00b57d; }
.co-types { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; padding-top: 17px; }
.co-type { background: linear-gradient(115deg,#eaf4ff,#e8f4ff); border-radius: 10px; padding: 23px 20px 18px; min-width: 0; }
.co-type-supplier { background: linear-gradient(115deg,#ebf9f6,#ebfaf5); }
.co-type h2 { display: flex; gap: 15px; align-items: center; font-size: 19px; color: #0056e7; letter-spacing: -.03em; margin-bottom: 9px; }
.co-type h2 i { font-size: 26px; color: #0072ff; }
.co-type-supplier h2 { color: #006c84; }
.co-type-supplier h2 i { color: #009f89; }
.co-type-intro { font-size: 14px; max-width: 365px; line-height: 1.45; margin-bottom: 12px !important; }
.co-type-grid { display: grid; grid-template-columns: 46% 54%; gap: 10px; align-items: end; }
.co-type-copy { min-width: 0; }
.co-checks { list-style: none; padding: 0; margin: 6px 0 22px; font-size: 13px; color: #48628b; }
.co-checks li { position: relative; padding-left: 27px; margin-bottom: 10px; }
.co-checks li:before { content: '✓'; position: absolute; left: 0; top: 0; width: 19px; height: 19px; display: grid; place-items: center; background: #0071ff; border-radius: 50%; color: #fff; font-size: 12px; }
.co-type-supplier .co-checks li:before { background: #009f89; }
.co-button-small { font-size: 11px; padding: 11px 12px; font-weight: 400; gap: 8px; }
.co-type-example { min-width: 0; }
.co-mini { background: #fff; padding: 10px 7px 4px; border-radius: 9px; box-shadow: 0 4px 14px #294e7010; margin: 0 0 9px; }
.co-mini figcaption { font-size: 11px; color: #163569; margin-bottom: 8px; letter-spacing: -.02em; }
.co-mini .co-table { font-size: 8px; }
.co-mini .co-table td, .co-mini .co-table th { padding: 8px 3px; }
.co-mini .co-table td:nth-child(2) { white-space: normal; }
.co-example-label { display: block; text-align: right; font-size: 8px; color: #7588a2; margin: 3px 2px 0; }
.co-benefit { background: #eefbf7; border-radius: 8px; padding: 8px; display: flex; align-items: center; gap: 10px; box-shadow: 0 3px 9px #15735905; }
.co-benefit .co-icon { margin: 0; background: #d4f6e8; color: #00b784; width: 42px; height: 42px; font-size: 22px; border-radius: 11px; }
.co-benefit p { font-size: 12px; }
.co-benefit strong { display: block; color: #007a74; font-size: 13px; font-weight: 600; margin-bottom: 2px; }
.co-process { display: grid; grid-template-columns: repeat(5, 1fr); gap: 50px; padding: 0 22px; margin: 0; list-style: none; }
.co-process li { text-align: center; position: relative; }
.co-process li:not(:last-child):after { content: '→'; position: absolute; right: -35px; top: 17px; font-size: 26px; color: #0071ff; }
.co-process .co-icon { margin: 0 auto 10px; width: 70px; height: 62px; border-radius: 19px; font-size: 33px; }
.co-process h3 { font-size: 16px; margin-bottom: 7px; }
.co-process p { font-size: 14px; max-width: 170px; margin: auto; }
.co-industries { display: grid; grid-template-columns: repeat(8, 1fr); padding-top: 4px; }
.co-industries > div { border-right: 1px solid #edf2f8; padding: 0 12px; text-align: center; }
.co-industries > div:last-child { border: 0; }
.co-industries .co-icon { margin: 0 auto 10px; width: 62px; height: 59px; }
.co-industries h3 { font-size: 14px; font-weight: 400; line-height: 1.3; }
.co-final { display: flex; align-items: center; justify-content: space-between; gap: 20px; background: #006dff; border-radius: 9px; padding: 26px 28px; margin-top: 32px; color: #fff; position: relative; overflow: hidden; }
.co-final:before { content: '☁'; position: absolute; left: 42%; top: -34px; color: #ffffff0c; font-size: 190px; line-height: 1; pointer-events: none; }
.co-final > div { position: relative; }
.co-final h2 { color: #fff; font-size: 25px; }
.co-final p { color: #eef8ff; font-size: 14px; }
.co-final .co-actions { margin: 0; flex-shrink: 0; }
.co-button-white { background: #fff; color: #006aff; border-color: #fff; }
.co-button-light { border-color: #b3d7ff; }
.co-assurances { display: grid; grid-template-columns: repeat(4,1fr); padding: 30px 12px 22px; }
.co-assurances > div { display: flex; justify-content: center; gap: 20px; align-items: center; padding: 0 15px; border-right: 1px solid #edf2f8; }
.co-assurances > div:last-child { border: 0; }
.co-assurances i { font-size: 31px; color: #0073ff; }
.co-assurances p { font-size: 13px; }
.co-assurances strong { color: #102355; display: block; font-weight: 600; margin-bottom: 2px; }
@media (max-width: 1150px) {
  .co-hero-grid { padding-inline: 10px; }
  .co-intro h1 { font-size: 46px; }
  .co-intro > p { font-size: 17px; }
  .co-button { padding: 12px 17px; font-size: 13px; }
  .co-actions { gap: 16px; }
  .co-trust { gap: 17px; font-size: 9px; }
  .co-feature { padding: 13px 15px; }
  .co-feature h3 { font-size: 15px; }
  .co-feature p { font-size: 13px; }
  .co-type { padding: 20px 16px 16px; }
  .co-type-grid { grid-template-columns: 45% 55%; gap: 6px; }
  .co-checks { font-size: 12px; }
  .co-checks li { padding-left: 25px; }
  .co-button-small { font-size: 10px; padding: 10px 8px; gap: 5px; }
  .co-mini figcaption { font-size: 9px; }
  .co-mini .co-table { font-size: 7px; }
  .co-mini .co-state { font-size: 6px; }
  .co-benefit p { font-size: 11px; }
  .co-benefit strong { font-size: 12px; }
  .co-final { padding: 25px; }
  .co-final p { font-size: 13px; }
  .co-assurances > div { gap: 13px; }
}
@media (max-width: 900px) {
  .co-hero-grid { grid-template-columns: 1fr; gap: 25px; padding-top: 28px; }
  .co-intro { text-align: center; }
  .co-intro > p { max-width: 520px; margin: auto; }
  .co-actions, .co-trust { justify-content: center; }
  .co-visual { width: min(650px, 96%); margin: auto; height: 440px; }
  .co-features { grid-template-columns: repeat(3,1fr); }
  .co-types { grid-template-columns: 1fr; }
  .co-type-grid { grid-template-columns: 45% 55%; }
  .co-type-intro { max-width: 480px; }
  .co-checks { font-size: 14px; }
  .co-button-small { font-size: 12px; padding: 12px; }
  .co-mini figcaption { font-size: 12px; }
  .co-mini .co-table { font-size: 10px; }
  .co-mini .co-state { font-size: 9px; }
  .co-benefit p { font-size: 13px; }
  .co-benefit strong { font-size: 14px; }
  .co-process { gap: 25px; padding: 0; }
  .co-process li:not(:last-child):after { right: -23px; font-size: 22px; }
  .co-process h3 { font-size: 14px; }
  .co-process p { font-size: 13px; }
  .co-industries { grid-template-columns: repeat(4,1fr); row-gap: 20px; }
  .co-final { flex-direction: column; text-align: center; }
  .co-assurances { grid-template-columns: repeat(2,1fr); gap: 20px 0; }
}
@media (max-width: 540px) {
  .co-container { width: 92%; }
  .co-hero-grid { padding: 24px 0 0; gap: 20px; }
  .co-intro h1 { font-size: 39px; }
  .co-intro > p { font-size: 16px; }
  .co-button { font-size: 12px; padding: 12px 14px; }
  .co-actions { gap: 10px; }
  .co-trust { gap: 10px; font-size: 8px; }
  .co-trust li:before { width: 14px; height: 14px; font-size: 10px; margin-right: 4px; }
  .co-visual { height: 306px; width: 100%; }
  .co-dashboard-customer { width: 97%; left: 0; border-radius: 8px; }
  .co-appbar { font-size: 9px; padding: 6px; gap: 9px; }
  .co-search { font-size: 5px; width: 100px; padding: 4px; }
  .co-app-user { font-size: 5px; }
  .co-app-body { padding: 9px 5px; }
  .co-app-title { font-size: 8px; gap: 5px; }
  .co-app-title > span { font-size: 4px; padding: 3px; }
  .consignment-landing .co-breadcrumb { font-size: 5px; margin-bottom: 7px; }
  .co-app-metrics { gap: 4px; }
  .co-app-metrics > div { gap: 4px; padding: 6px 3px; }
  .co-app-metrics i { width: 20px; height: 20px; font-size: 9px; }
  .co-app-metrics p { font-size: 4px; }
  .co-app-metrics strong { font-size: 11px; }
  .co-filters { font-size: 4px; gap: 4px; padding: 5px 3px; margin: 6px 0; }
  .co-filters b { font-size: 4px; padding: 4px 2px; margin-top: 3px; }
  .co-filter-search { padding: 4px 2px; }
  .co-dashboard .co-table { font-size: 4px; }
  .co-dashboard .co-table th, .co-dashboard .co-table td { padding: 5px 2px; }
  .co-dashboard .co-state { font-size: 4px; padding: 2px; }
  .co-dashboard-supplier { top: 202px; left: 5%; width: 95%; border-radius: 8px; }
  .co-dashboard-supplier .co-app-body { border-left-width: 34px; padding-top: 8px; }
  .co-dashboard-supplier .co-app-title { font-size: 7px; }
  .co-dashboard-supplier:before { width: 34px; font-size: 7px; padding: 6px 2px; height: 22px; }
  .co-dashboard-supplier:after { left: 3px; top: 32px; font-size: 4px; }
  .co-note, .co-boxes { display: none; }
  .consignment-landing h2 { font-size: 23px; }
  .co-heading p { font-size: 13px; }
  .co-features { grid-template-columns: repeat(2,1fr); gap: 10px; }
  .co-feature { padding: 14px; }
  .co-type { padding: 20px 15px 15px; }
  .co-type h2 { font-size: 18px; gap: 10px; }
  .co-type-grid { grid-template-columns: 1fr; gap: 18px; }
  .co-checks { margin-bottom: 16px; font-size: 13px; }
  .co-button-small { font-size: 12px; }
  .co-type-copy .co-button { width: 100%; }
  .co-mini .co-table { font-size: 9px; }
  .co-process { grid-template-columns: 1fr; gap: 24px; }
  .co-process li { display: grid; grid-template-columns: 66px 1fr; text-align: left; align-items: center; column-gap: 15px; }
  .co-process .co-icon { grid-row: 1 / 3; width: 60px; height: 60px; margin: 0; }
  .co-process h3 { font-size: 16px; margin-bottom: 4px; align-self: end; }
  .co-process p { max-width: none; margin: 0; align-self: start; }
  .co-process li:not(:last-child):after { content: '↓'; top: auto; bottom: -24px; left: 25px; right: auto; font-size: 20px; }
  .co-industries { grid-template-columns: repeat(2,1fr); row-gap: 20px; }
  .co-industries h3 { font-size: 13px; }
  .co-final { padding: 24px 18px; }
  .co-final .co-actions, .co-final .co-button { width: 100%; }
  .co-final h2 { font-size: 24px; }
  .co-assurances { gap: 20px 10px; padding: 25px 0; }
  .co-assurances > div { justify-content: start; padding: 0; gap: 10px; border: 0; }
  .co-assurances i { font-size: 26px; }
  .co-assurances p { font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) { .co-button { transition: none; } .co-button:hover { transform: none; } }