.kbo, .kbo-button {
 --kbo-accent: #2178c5;
 --kbo-hover: #1670bf;
 --kbo-ink: #112844;
 --kbo-muted: #53677e;
 --kbo-gold: #1670bf;
 --kbo-line: #dce7f1;
 --kbo-wash: #f4f8fc;
 --kbo-sky: #eaf4ff;
 --kbo-ease: cubic-bezier(.2,.8,.2,1);
}

.kbo-button, .kbo .kbo-button {
 background: var(--kbo-accent);
 color: white !important;
 font: inherit;
 font-weight: 700;
 text-transform: none;
 letter-spacing: normal;
 border: 1px solid transparent;
 border-radius: 9px;
 transition: background-color .2s, box-shadow .25s, transform .25s var(--kbo-ease);
}
.kbo-button:not(:disabled):hover, .kbo .kbo-button:not(:disabled):hover {
 background: var(--kbo-hover);
 opacity: 1;
 box-shadow: 0 8px 18px #10487928;
 transform: translateY(-2px);
}
.kbo-button:not(:disabled):active { transform: translateY(0) scale(.985); }
.kbo .kbo-button:disabled { opacity: .7; cursor: wait; }
.kbo .kbo-whatsapp { background: #17684d; }
.kbo .kbo-whatsapp:not(:disabled):hover { background: #12543e; }
.kbo .kbo-eyebrow, .kbo .kbo-link { color: var(--kbo-hover); }
.kbo .kbo-notice { background: var(--kbo-sky); border-color: var(--kbo-accent); }
.kbo .kbo-card { border-color: var(--kbo-line); }
.kbo-modal.kbo { background: #fff; }
.kbo-modal.kbo[open] { animation: kbo-dialog-in 400ms var(--kbo-ease); }
.kbo .kbo-timeline li.is-complete { border-color: var(--kbo-accent); }
.kbo .kbo-timeline li.is-complete::before { background: var(--kbo-accent); }
.kbo .kbo-timeline li:not(.is-complete) { color: var(--kbo-muted); }

body:has(.kbo-checkout, .kbo-thankyou) :is(main h1.wp-block-post-title, .entry-header h1.entry-title) { display: none; }
.kbo.kbo-checkout, .kbo.kbo-thankyou {
 width: 100%;
 max-width: 1160px;
 margin: clamp(16px, 3vw, 40px) auto 56px;
 padding: 0;
 container-type: inline-size;
}
.kbo-checkout *, .kbo-thankyou * { min-width: 0; }
.kbo-checkout .kbo-sr, .kbo-thankyou .kbo-sr {
 position: absolute; inline-size: 1px; block-size: 1px; padding: 0; margin: -1px;
 clip-path: inset(50%); overflow: hidden; white-space: nowrap; border: 0;
}
.kbo .kbo-hero {
 position: relative;
 isolation: isolate;
 display: grid;
 grid-template-columns: minmax(0, 1fr) minmax(155px, .52fr);
 align-items: center;
 gap: 12px;
 min-height: 224px;
 padding: clamp(24px, 4.5vw, 50px);
 overflow: hidden;
 border: 1px solid #d7e8f9;
 border-radius: 18px;
 background: radial-gradient(ellipse at 88% 20%, #d4eaff 0, transparent 54%), linear-gradient(115deg, #f8fcff, #eaf4ff);
}
.kbo-hero::before {
 content: "";
 position: absolute;
 inset: 0;
 z-index: -1;
 background-image: radial-gradient(#4483bc36 1px, transparent 1px);
 background-size: 13px 13px;
 mask-image: linear-gradient(100deg, transparent 35%, #000 100%);
 pointer-events: none;
}
.kbo .kbo-hero .kbo-eyebrow {
 display: flex; gap: 9px; align-items: center; margin: 0 0 12px;
 text-transform: uppercase; letter-spacing: .15em; font-size: .73rem; font-weight: 750;
}
.kbo-brand-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--kbo-hover); box-shadow: 0 0 0 4px #d7eaff; }
.kbo .kbo-hero h1 {
 margin: 0;
 font-family: inherit;
 font-size: clamp(2rem, 4.8vw, 3.65rem);
 font-weight: 760;
 letter-spacing: -.045em;
 line-height: 1.06;
 text-transform: none;
}
.kbo .kbo-hero-description { margin: 14px 0 0; color: var(--kbo-muted); font-size: .95rem; line-height: 1.55; max-width: 34rem; }
.kbo-hero-art { width: 100%; max-width: 285px; justify-self: end; overflow: visible; }
.kbo-art-orbit { stroke: #83b8e5; stroke-width: 1.05; }
.kbo-art-orbit-dashed { stroke: #a5cceb; stroke-dasharray: 3 6; }
.kbo-parcel { filter: drop-shadow(0 12px 14px #2070ba34); }
.kbo-parcel-shadow { fill: #a9ccec; opacity: .5; }
.kbo-parcel-front { fill: #73b4ed; }
.kbo-parcel-side { fill: #2178c5; }
.kbo-parcel-top { fill: #c2e1fc; }
.kbo-parcel-tape { fill: #eff7ff; }
.kbo-parcel-mark { stroke: #175a98; stroke-width: 2.4; stroke-linecap: round; }
.kbo-art-spark { stroke: #3a87ca; stroke-width: 2; stroke-linecap: round; }
.kbo-art-dot { fill: #5da7e6; }
.kbo-seal-halo { fill: #d5eaff; stroke: #a8cef3; }
.kbo-seal-face { fill: #fff; stroke: #9dc9ef; stroke-width: 2; filter: drop-shadow(0 9px 11px #1d5d9b28); }
.kbo-seal-check { stroke: var(--kbo-hover); stroke-width: 7; stroke-linecap: round; stroke-linejoin: round; }
.kbo-hero-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-block-start: 17px; font-size: .83rem; font-weight: 700; }
.kbo-status { display: inline-flex; align-items: center; gap: 6px; border-radius: 30px; padding: 4px 10px; color: #154e80; background: #fff; border: 1px solid #c8dff5; }
.kbo-status > span { width: 6px; height: 6px; border-radius: 50%; background: var(--kbo-hover); }

.kbo .kbo-progress {
 display: flex; flex-wrap: nowrap; align-items: center; gap: clamp(8px, 2vw, 22px);
 padding: 16px 0; margin: 0 0 12px; list-style: none;
 border-bottom: 1px solid var(--kbo-line);
}
.kbo .kbo-progress li { display: flex; align-items: center; gap: 8px; margin: 0; padding: 0; color: var(--kbo-muted); font-size: .8rem; font-weight: 600; }
.kbo .kbo-progress li::marker { content: ""; }
.kbo .kbo-progress li:not(:last-child)::after { content: ""; width: clamp(8px, 2vw, 22px); height: 1px; margin-inline-start: 5px; background: #cadceb; }
.kbo-progress-number { display: grid; flex: 0 0 28px; width: 28px; height: 28px; place-items: center; border-radius: 50%; background: var(--kbo-wash); font-size: .67rem; }
.kbo .kbo-progress .is-current { color: var(--kbo-hover); }
.kbo-progress .is-current .kbo-progress-number { background: var(--kbo-hover); color: #fff; box-shadow: 0 0 0 3px #e6f2fe; }
.kbo-progress .is-complete .kbo-progress-number { color: var(--kbo-hover); background: var(--kbo-sky); }
.kbo-progress svg, .kbo-summary svg, .kbo-copy svg, .kbo-confirm-payment svg { width: 19px; height: 19px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.kbo .kbo-checkout-grid, .kbo .kbo-receipt-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(290px, .9fr); align-items: start; gap: clamp(14px, 2.4vw, 28px); margin-top: 24px; }
.kbo .kbo-receipt-single { grid-template-columns: minmax(0, 600px); justify-content: center; }
.kbo-checkout-main, .kbo-receipt-main { display: grid; gap: 16px; }
.kbo .kbo-checkout-grid .kbo-card, .kbo .kbo-receipt-grid .kbo-card {
 margin: 0;
 padding: clamp(17px, 2.5vw, 28px);
 border-radius: 14px;
 box-shadow: 0 8px 22px #17416c08;
}
.kbo .kbo-checkout-aside, .kbo .kbo-receipt-aside { position: sticky; top: var(--kbo-sticky-offset, 104px); }
.kbo .kbo-section-heading { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 17px; }
.kbo-section-heading > span {
 display: grid; place-items: center; flex: 0 0 36px; height: 36px;
 border-radius: 9px; color: #155d9a; background: var(--kbo-sky); font-weight: 750; font-size: .75rem;
}
.kbo .kbo-section-heading h2, .kbo .kbo-summary h2 { margin: 0; font-family: inherit; font-size: clamp(1.1rem, 2.1vw, 1.45rem); font-weight: 740; letter-spacing: -.025em; text-transform: none; }
.kbo .kbo-section-heading p { margin: 4px 0 0; color: var(--kbo-muted); font-size: .83rem; line-height: 1.5; }
.kbo-checkout .kbo-field-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; }
.kbo-checkout label { margin: 12px 0 0; color: var(--kbo-ink); line-height: 1.4; }
.kbo-checkout input:not([type=radio]):not([type=checkbox]), .kbo-checkout select, .kbo-checkout textarea {
 border-color: #cdddec; background: #fff; color: var(--kbo-ink);
 box-shadow: none; min-height: 46px; height: auto;
 transition: border-color .18s, box-shadow .18s, background-color .18s;
}
.kbo-checkout textarea { resize: vertical; }
.kbo-checkout input:not([type=radio]):not([type=checkbox]):focus, .kbo-checkout select:focus, .kbo-checkout textarea:focus {
 outline: none; border-color: var(--kbo-hover); box-shadow: 0 0 0 3px #1670bf24;
}
.kbo-checkout .kbo-destination { padding: 10px 12px; min-height: 44px; border: 1px solid var(--kbo-line); border-radius: 9px; background: var(--kbo-wash); width: fit-content; cursor: pointer; }
.kbo .kbo-destination input, .kbo .kbo-method input { margin: 0; }
.kbo .kbo-notes { margin-top: 16px; color: var(--kbo-hover); font-size: .85rem; }
.kbo-notes summary { cursor: pointer; padding: 6px 0; }
.kbo-notes summary > span { margin-inline-start: 5px; color: var(--kbo-muted); font-size: .75rem; }
.kbo-checkout #kbo-delivery-panel { animation: none; }
.kbo .kbo-delivery { margin: 0; border: 0; min-width: 0; }
.kbo .kbo-delivery legend { position: absolute; clip-path: inset(50%); width: 1px; height: 1px; overflow: hidden; }
.kbo .kbo-method { margin: 0 0 8px; padding: 12px; border-color: var(--kbo-line); border-radius: 9px; transition: border-color .2s, background-color .2s, box-shadow .2s; }
.kbo .kbo-method:last-child { margin-bottom: 0; }
.kbo .kbo-method:hover { border-color: #8cb6dd; background: #f7fbff; }
.kbo .kbo-method:has(input:checked) { border-color: var(--kbo-hover); background: var(--kbo-sky); box-shadow: inset 3px 0 var(--kbo-hover); }
.kbo .kbo-method small { margin-top: 3px; }

.kbo .kbo-checkout-grid .kbo-summary, .kbo .kbo-receipt-grid .kbo-summary { padding: 0; overflow: hidden; }
.kbo .kbo-summary-header { padding: 20px 23px; border-bottom: 1px solid var(--kbo-line); background: linear-gradient(115deg, #f9fcff, #ecf5ff); }
.kbo-summary-header .kbo-eyebrow { display: block; margin: 0 0 4px; font-size: .69rem; text-transform: uppercase; letter-spacing: .12em; }
.kbo-summary-body { padding: 18px 23px 23px; }
.kbo .kbo-checkout-row { display: flex; align-items: flex-start; gap: 12px; padding: 12px 0; border-color: var(--kbo-line); }
.kbo .kbo-checkout-row:first-child { padding-top: 0; }
.kbo .kbo-checkout-row > img, .kbo .kbo-receipt-items img { flex: none; width: 58px; height: 68px; border-radius: 8px; object-fit: cover; margin: 0; background: var(--kbo-wash); }
.kbo .kbo-line-copy h3 { margin: 0; font: inherit; font-weight: 700; line-height: 1.35; overflow-wrap: anywhere; }
.kbo .kbo-line-copy p { margin: 4px 0 8px; color: var(--kbo-muted); font-size: .8rem; }
.kbo .kbo-stepper { gap: 3px; max-width: 152px; }
.kbo .kbo-stepper button, .kbo .kbo-stepper input {
 margin: 0; padding: 0; min-width: 38px; min-height: 42px; height: 42px;
 border: 1px solid #cdddec; border-radius: 7px; box-shadow: none; color: var(--kbo-ink); background: #fff;
 font-family: inherit; line-height: 1.1;
}
.kbo .kbo-stepper input { appearance: textfield; }
.kbo .kbo-stepper input::-webkit-inner-spin-button, .kbo .kbo-stepper input::-webkit-outer-spin-button { appearance: none; margin: 0; }
.kbo .kbo-stepper button:hover { color: var(--kbo-hover); background: var(--kbo-sky); border-color: var(--kbo-hover); }
.kbo .kbo-payment { display: flex; align-items: flex-start; gap: 10px; margin-top: 14px; padding: 12px; border: 1px solid var(--kbo-line); border-radius: 9px; background: var(--kbo-wash); font-size: .86rem; }
.kbo .kbo-payment p { margin: 3px 0 0; line-height: 1.45; }
.kbo-payment-icon { display: grid; place-items: center; width: 30px; height: 30px; flex: 0 0 30px; color: var(--kbo-hover); background: var(--kbo-sky); border-radius: 7px; }
.kbo .kbo-total { margin: 12px 0 0; padding: 7px 0 2px; font-size: .91rem; font-weight: 650; }
.kbo .kbo-total strong, .kbo .kbo-amount-band strong { color: var(--kbo-ink); font-variant-numeric: tabular-nums; font-size: clamp(1.1rem, 2.4vw, 1.6rem); font-weight: 760; text-align: end; overflow-wrap: anywhere; }
.kbo .kbo-total-note { margin: 6px 0 14px; color: var(--kbo-muted); font-size: .75rem; line-height: 1.45; }
.kbo .kbo-error:empty, .kbo .kbo-row-message:empty { display: none; }
.kbo .kbo-summary .kbo-button { width: 100%; gap: 12px; justify-content: space-between; min-height: 50px; padding: 10px 15px; }
.kbo .kbo-summary .kbo-button svg { transition: transform .25s var(--kbo-ease); }
.kbo .kbo-summary .kbo-button:hover svg { transform: translateX(3px); }
.kbo .kbo-track-action { margin-top: 15px; }
.kbo .kbo-button-spinner { display: none; flex: none; width: 18px; height: 18px; border: 2px solid #fff6; border-top-color: #fff; border-radius: 50%; }
.kbo form[aria-busy=true] .kbo-primary-action > svg { display: none; }
.kbo form[aria-busy=true] .kbo-button-spinner { display: block; animation: kbo-spin .8s linear infinite; }

.kbo .kbo-amount-band { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 12px 15px; border: 1px solid #c7dff6; border-radius: 9px; background: var(--kbo-sky); font-size: .86rem; font-weight: 650; }
.kbo .kbo-bank-layout { display: flex; align-items: flex-start; gap: 14px; flex-wrap: wrap; margin-top: 8px; }
.kbo-bank-layout dl { flex: 1 1 240px; margin: 0; }
.kbo .kbo-bank-field { padding: 9px 0; border-bottom: 1px solid var(--kbo-line); }
.kbo .kbo-bank-field:last-child { border-bottom: 0; }
.kbo .kbo-bank-field dt { margin: 0; color: var(--kbo-muted); font-size: .73rem; }
.kbo .kbo-bank-field dd { display: flex; align-items: center; justify-content: space-between; gap: 6px 10px; flex-wrap: wrap; margin: 2px 0 0; font-size: .94rem; font-weight: 660; }
.kbo .kbo-bank-field dd > span { overflow-wrap: anywhere; }
.kbo .kbo-copy {
 display: inline-flex; align-items: center; gap: 5px; padding: 5px 9px; min-height: 35px;
 border: 1px solid #cdddec; border-radius: 7px; background: var(--kbo-wash);
 font: inherit; font-size: .74rem; text-transform: none; color: #175d9b; cursor: pointer;
}
.kbo .kbo-copy:hover { background: var(--kbo-sky); border-color: var(--kbo-hover); }
.kbo .kbo-copy[data-copied] { background: #e7f7ef; border-color: #a4d6bf; color: #145a42; }
.kbo .kbo-copy svg { width: 14px; height: 14px; }
.kbo .kbo-bank-layout figure { margin: 10px 0 0; padding: 8px; text-align: center; border: 1px solid var(--kbo-line); border-radius: 9px; }
.kbo .kbo-bank-layout figure img { max-width: 130px; width: 100%; height: auto; }
.kbo .kbo-bank-layout figcaption, .kbo .kbo-bank-instructions { color: var(--kbo-muted); font-size: .8rem; }
.kbo .kbo-receipt-items { list-style: none; padding: 0; margin: 0; }
.kbo .kbo-receipt-items li { display: flex; align-items: center; gap: 12px; padding: 9px 0; margin: 0; border-bottom: 1px solid var(--kbo-line); overflow-wrap: anywhere; }
.kbo .kbo-receipt-items li:first-child { padding-top: 0; }
.kbo .kbo-receipt-items small { display: block; margin-top: 4px; color: var(--kbo-muted); }
.kbo .kbo-receipt-detail { display: flex; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--kbo-line); font-size: .85rem; }
.kbo .kbo-receipt-detail strong { text-align: end; overflow-wrap: anywhere; }
.kbo .kbo-confirm-payment .kbo-button { min-height: 44px; padding: 10px 16px; }

@media (prefers-reduced-motion: no-preference) {
 .kbo-hero-copy { animation: kbo-rise 530ms var(--kbo-ease) backwards; }
 .kbo-enter { animation: kbo-rise 530ms var(--kbo-ease) var(--kbo-delay, 0ms) backwards; }
 .kbo-word, .kbo-character { display: inline-block; }
 .kbo-character { transform-origin: center 85%; animation: kbo-character-in 540ms cubic-bezier(.17,.8,.25,1) calc(55ms + var(--kbo-index, 0) * 23ms) backwards; }
 .kbo-parcel, .kbo-confirm-seal { transform-box: fill-box; transform-origin: center; animation: kbo-art-in 850ms var(--kbo-ease) 70ms backwards; }
 .kbo-seal-check { stroke-dasharray: 1; animation: kbo-draw 620ms cubic-bezier(.4,0,.2,1) 340ms backwards; }
 .kbo-art-spark, .kbo-art-dot { transform-box: fill-box; transform-origin: center; animation: kbo-spark 690ms var(--kbo-ease) 430ms backwards; }
}
@keyframes kbo-character-in {
 from { opacity: 0; transform: translateY(.48em) scale(.94); filter: blur(4px); }
 70% { opacity: 1; filter: blur(0); }
 to { transform: none; }
}
@keyframes kbo-rise { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@keyframes kbo-art-in { 0% { opacity: 0; transform: translateY(15px) rotate(-7deg) scale(.85); } 72% { transform: translateY(-3px) rotate(1.5deg) scale(1.025); } 100% { opacity: 1; transform: none; } }
@keyframes kbo-draw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes kbo-spark { from { opacity: 0; transform: scale(.25); } 60% { opacity: 1; transform: scale(1.18); } to { transform: scale(1); } }
@keyframes kbo-dialog-in { from { opacity: 0; transform: translateY(14px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes kbo-spin { to { transform: rotate(360deg); } }

@container (max-width: 685px) {
 .kbo .kbo-checkout-grid, .kbo .kbo-receipt-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
 .kbo .kbo-checkout-aside, .kbo .kbo-receipt-aside { position: static; }
}
@media (max-width: 720px) {
 .kbo .kbo-checkout-grid, .kbo .kbo-receipt-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
 .kbo .kbo-checkout-aside, .kbo .kbo-receipt-aside { position: static; }
 .kbo .kbo-hero { padding: 22px; min-height: 164px; border-radius: 13px; }
 .kbo .kbo-hero h1 { font-size: clamp(1.75rem, 5vw, 2.45rem); }
}
@media (max-width: 480px) {
 .kbo .kbo-hero { grid-template-columns: minmax(0, 1fr); padding: 19px; }
 .kbo .kbo-hero-copy { padding-inline-end: 40px; }
 .kbo .kbo-hero-art { position: absolute; inset-inline-end: -11px; inset-block-start: 9px; width: 90px; z-index: -1; }
 .kbo .kbo-progress { gap: 7px; }
 .kbo .kbo-progress li { gap: 4px; font-size: .7rem; }
 .kbo .kbo-progress li:not(:last-child)::after { width: 5px; margin-inline-start: 2px; }
 .kbo-progress-number { width: 23px; height: 23px; flex-basis: 23px; }
 .kbo-checkout .kbo-field-grid { grid-template-columns: 1fr; }
 .kbo .kbo-summary-header, .kbo-summary-body { padding-inline: 16px; }
}
@media (prefers-reduced-motion: reduce) {
 .kbo, .kbo *, .kbo-button { animation: none !important; transition: none !important; }
 .kbo .kbo-button:hover, .kbo-button:hover, .kbo .kbo-summary .kbo-button:hover svg { transform: none; }
}
