/* PVANetwork marketplace — catalog + product pages (static) */
:root { --mk-b: var(--primary); }
.mk-sec { padding: 56px 0; }
.mk-sec.alt { background: var(--surface); }
.mk-head { text-align: center; max-width: 680px; margin: 0 auto 30px; }
.mk-kicker { display: inline-block; font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--primary); background: var(--primary-light); padding: 5px 12px; border-radius: 999px; margin-bottom: 12px; }
.mk-head h2 { font-size: clamp(1.5rem, 3vw, 2.1rem); font-weight: 700; letter-spacing: -.02em; color: var(--text1); margin-bottom: 10px; }
.mk-head p { color: var(--text3); font-size: .95rem; line-height: 1.7; }

/* brand icon box */
.mk-ico { --b: var(--primary); width: 56px; height: 56px; border-radius: 16px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--b); background: color-mix(in srgb, var(--b) 11%, #fff); border: 1px solid color-mix(in srgb, var(--b) 18%, #fff); }
.mk-ico svg { width: 28px; height: 28px; fill: currentColor; }
.mk-ico.lg { width: 76px; height: 76px; border-radius: 22px; }
.mk-ico.lg svg { width: 38px; height: 38px; }
.mk-ico.sm { width: 40px; height: 40px; border-radius: 12px; }
.mk-ico.sm svg { width: 20px; height: 20px; }

/* trust strip */
.mk-trust { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: -38px; position: relative; z-index: 3; }
.mk-trust > div { background: var(--surface); border: 1px solid var(--border); border-radius: 16px; padding: 16px 18px; display: flex; gap: 12px; align-items: center; box-shadow: 0 6px 24px rgba(20,16,50,.06); }
.mk-trust .t-ico { width: 40px; height: 40px; border-radius: 12px; background: var(--primary-light); display: flex; align-items: center; justify-content: center; font-size: 1.1rem; flex-shrink: 0; }
.mk-trust strong { display: block; font-size: .88rem; color: var(--text1); }
.mk-trust span { font-size: .76rem; color: var(--text3); }

/* catalog toolbar */
.mk-bar { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; justify-content: space-between; margin-bottom: 26px; }
.mk-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.mk-chip { padding: 9px 16px; border-radius: 999px; border: 1px solid var(--border); background: var(--surface); font-size: .84rem; font-weight: 600; color: var(--text2); cursor: pointer; transition: all .15s; }
.mk-chip:hover { border-color: var(--primary); color: var(--primary); }
.mk-chip.active { background: var(--primary); border-color: var(--primary); color: #fff; box-shadow: 0 6px 16px rgba(91,108,255,.25); }
.mk-chip small { opacity: .7; font-weight: 500; margin-left: 4px; }
.mk-search { position: relative; min-width: 260px; }
.mk-search svg { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: var(--text3); }
.mk-search input { width: 100%; padding: 11px 16px 11px 40px; border-radius: 999px; border: 1px solid var(--border); background: var(--surface); font-size: .9rem; outline: none; }
.mk-search input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(91,108,255,.12); }
.mk-count { font-size: .85rem; color: var(--text3); margin-bottom: 14px; }

/* catalog grid + service cards */
.mk-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.mk-card { background: var(--surface); border: 1px solid var(--border); border-radius: 20px; padding: 22px; display: flex; flex-direction: column; transition: all .25s cubic-bezier(.22,1,.36,1); color: inherit; text-decoration: none; position: relative; }
.mk-card:hover { transform: translateY(-4px); box-shadow: 0 16px 36px rgba(20,16,50,.1); border-color: color-mix(in srgb, var(--b, var(--primary)) 40%, #fff); }
.mk-card-top { display: flex; align-items: center; gap: 13px; }
.mk-card h3 { font-size: 1.02rem; font-weight: 700; color: var(--text1); line-height: 1.25; }
.mk-card .cat { font-size: .7rem; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--text3); margin-top: 2px; }
.mk-tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 16px 0 12px; }
.mk-tag { font-size: .7rem; font-weight: 600; color: var(--text2); background: var(--bg3); border: 1px solid var(--border); padding: 4px 9px; border-radius: 999px; }
.mk-tag.age { color: #3A47D1; background: #1A1F4A; border-color: #252C62; }
.mk-stock { display: inline-flex; align-items: center; gap: 6px; font-size: .72rem; font-weight: 700; color: #34D399; background: #0F2A1E; border: 1px solid rgba(34,197,94,.25); padding: 4px 10px; border-radius: 999px; width: fit-content; }
.mk-stock::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: #22C55E; animation: pulse 2s infinite; }
.mk-price { margin-top: auto; padding-top: 16px; display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; }
.mk-price .from { font-size: .72rem; color: var(--text3); display: block; }
.mk-price b { font-size: 1.55rem; font-weight: 800; color: var(--primary); letter-spacing: -.02em; line-height: 1.1; }
.mk-price b small { font-size: .72rem; font-weight: 500; color: var(--text3); letter-spacing: 0; }
.mk-price .packs { font-size: .72rem; color: var(--text3); text-align: right; }
.mk-go { margin-top: 14px; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 11px; border-radius: 999px; background: var(--primary-light); color: var(--primary); font-weight: 700; font-size: .86rem; transition: all .2s; }
.mk-card:hover .mk-go { background: var(--primary); color: #fff; }
.mk-empty { text-align: center; padding: 50px 20px; color: var(--text3); display: none; }

/* product page */
.pd-hero { background: linear-gradient(135deg, #0B1124 0%, #23206B 55%, #5B6CFF 130%); color: #fff; text-align: center; padding: 56px 0 74px; position: relative; overflow: hidden; }
.pd-hero::after { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 80% 0%, rgba(255,255,255,.12), transparent 50%); pointer-events: none; }
.pd-hero .container { position: relative; z-index: 1; }
.crumbs { font-size: .8rem; color: rgba(255,255,255,.65); margin-bottom: 22px; }
.crumbs a { color: rgba(255,255,255,.85); }
.crumbs a:hover { text-decoration: underline; }
.pd-hero .mk-ico { background: var(--surface); border-color: transparent; box-shadow: 0 10px 30px rgba(0,0,0,.25); margin-bottom: 18px; }
.pd-hero h1 { font-size: clamp(1.8rem, 4.5vw, 2.9rem); font-weight: 800; letter-spacing: -.025em; line-height: 1.15; margin-bottom: 14px; }
.pd-hero h1 em { font-style: normal; color: #2B3370; }
.pd-hero p { max-width: 640px; margin: 0 auto 20px; color: rgba(255,255,255,.78); font-size: 1rem; line-height: 1.7; }
.pd-pills { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.pd-pills span { font-size: .78rem; font-weight: 600; padding: 7px 13px; border-radius: 999px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.2); }
.pd-pills .stock { background: rgba(34,197,94,.2); border-color: rgba(34,197,94,.45); color: #14402A; }

.pk-tabs { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin: 0 auto 30px; }
.pk-tabs button { padding: 11px 22px; border-radius: 999px; border: 1px solid var(--border); background: var(--surface); color: var(--text1); font-weight: 600; font-size: .92rem; cursor: pointer; transition: all .18s; }
.pk-tabs button:hover { background: var(--primary-light); color: var(--primary); }
.pk-tabs button.active { background: var(--primary); border-color: var(--primary); color: #fff; box-shadow: 0 8px 20px rgba(91,108,255,.3); }
.pk-tabs .short { display: none; }
.pk-panel { display: none; }
.pk-panel.active { display: block; animation: pkfade .25s ease; }
@keyframes pkfade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.pk-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; padding-top: 14px; }
.pk-card { background: var(--surface); border: 1px solid var(--border); border-radius: 22px; padding: 28px 22px 22px; text-align: center; position: relative; display: flex; flex-direction: column; transition: all .25s; }
.pk-card:hover { transform: translateY(-4px); box-shadow: 0 16px 36px rgba(20,16,50,.1); }
.pk-card.pop { border: 2px solid var(--primary); box-shadow: 0 14px 38px rgba(91,108,255,.18); }
.pk-badge { position: absolute; top: -13px; right: 18px; background: var(--primary); color: #fff; font-size: .72rem; font-weight: 700; padding: 5px 13px; border-radius: 999px; box-shadow: 0 6px 14px rgba(91,108,255,.35); }
.pk-card .mk-ico { margin: 0 auto 14px; }
.pk-card h4 { font-size: 1.12rem; font-weight: 700; color: var(--text1); }
.pk-qty { font-size: .86rem; color: var(--text3); margin-top: 3px; }
.pk-price { margin: 14px 0 2px; font-size: 2.3rem; font-weight: 800; letter-spacing: -.03em; color: var(--primary); line-height: 1.1; }
.pk-price small { font-size: .85rem; font-weight: 500; color: var(--text3); letter-spacing: 0; }
.pk-per { font-size: .78rem; font-weight: 600; color: #34D399; background: #0F2A1E; display: inline-block; padding: 3px 10px; border-radius: 999px; margin: 6px auto 16px; }
.pk-feats { list-style: none; padding: 0; margin: 0 0 18px; display: flex; flex-direction: column; gap: 7px; }
.pk-feats li { display: flex; align-items: center; gap: 9px; text-align: left; font-size: .8rem; font-weight: 500; color: var(--text1); padding: 9px 12px; border-radius: 12px; background: var(--bg3); border: 1px solid var(--border); }
.pk-feats li::before { content: '✓'; width: 18px; height: 18px; border-radius: 50%; background: #34D399; color: #fff; font-size: .62rem; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.pk-foot { margin-top: auto; }
.qty { display: flex; align-items: center; justify-content: center; margin-bottom: 12px; border: 1px solid var(--border); border-radius: 999px; overflow: hidden; background: var(--surface); }
.qty button { width: 44px; height: 42px; border: none; background: var(--bg3); font-size: 1.2rem; cursor: pointer; color: var(--text2); }
.qty button:hover { background: var(--primary-light); color: var(--primary); }
.qty input { flex: 1; min-width: 0; text-align: center; border: none; font-size: .95rem; font-weight: 700; outline: none; -moz-appearance: textfield; }
.qty input::-webkit-outer-spin-button, .qty input::-webkit-inner-spin-button { -webkit-appearance: none; }
.pk-order { width: 100%; padding: 13px; border: none; border-radius: 999px; background: linear-gradient(135deg, var(--primary), var(--primary-dark)); color: #fff; font-weight: 700; font-size: .95rem; cursor: pointer; box-shadow: 0 8px 20px rgba(91,108,255,.3); transition: all .2s; }
.pk-order:hover { transform: translateY(-1px); box-shadow: 0 12px 26px rgba(91,108,255,.4); }
.pk-note { text-align: center; color: var(--text3); font-size: .82rem; margin-top: 22px; }

/* benefits, steps, related, faq */
.mk-benefits { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.mk-benefit { background: var(--surface); border: 1px solid var(--border); border-radius: 18px; padding: 22px; }
.mk-benefit .e { font-size: 1.5rem; margin-bottom: 10px; }
.mk-benefit h4 { font-size: .98rem; font-weight: 700; margin-bottom: 6px; }
.mk-benefit p { font-size: .84rem; color: var(--text3); line-height: 1.6; }
.mk-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; counter-reset: s; }
.mk-step { background: var(--surface); border: 1px solid var(--border); border-radius: 18px; padding: 24px; position: relative; counter-increment: s; }
.mk-step::before { content: counter(s); width: 34px; height: 34px; border-radius: 50%; background: var(--primary); color: #fff; font-weight: 700; display: flex; align-items: center; justify-content: center; margin-bottom: 12px; }
.mk-step h4 { font-size: .98rem; font-weight: 700; margin-bottom: 6px; }
.mk-step p { font-size: .84rem; color: var(--text3); line-height: 1.6; }
.mk-related { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 14px; }
.mk-rel { background: var(--surface); border: 1px solid var(--border); border-radius: 16px; padding: 18px 12px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 10px; font-weight: 600; font-size: .86rem; color: var(--text1); transition: all .2s; }
.mk-rel:hover { transform: translateY(-3px); box-shadow: 0 10px 24px rgba(20,16,50,.08); border-color: var(--primary); }
.mk-faq { max-width: 780px; margin: 0 auto; display: flex; flex-direction: column; gap: 10px; }
.mk-faq details { background: var(--surface); border: 1px solid var(--border); border-radius: 14px; padding: 16px 20px; }
.mk-faq summary { font-weight: 600; cursor: pointer; font-size: .95rem; list-style: none; display: flex; justify-content: space-between; gap: 12px; }
.mk-faq summary::after { content: '+'; color: var(--primary); font-size: 1.3rem; line-height: 1; }
.mk-faq details[open] summary::after { content: '–'; }
.mk-faq p { margin-top: 10px; color: var(--text3); font-size: .9rem; line-height: 1.7; }

/* order modal */
.od-overlay { position: fixed; inset: 0; background: rgba(20,16,50,.55); backdrop-filter: blur(4px); display: none; align-items: center; justify-content: center; padding: 16px; z-index: 300; }
.od-overlay.open { display: flex; }
.od-box { background: var(--surface); border-radius: 22px; width: 100%; max-width: 480px; max-height: 92vh; overflow: auto; padding: 28px; position: relative; }
.od-close { position: absolute; top: 14px; right: 14px; width: 34px; height: 34px; border-radius: 50%; border: none; background: var(--bg3); font-size: 1.2rem; cursor: pointer; }
.od-box h3 { font-size: 1.25rem; font-weight: 700; margin-bottom: 6px; }
.od-sub { font-size: .85rem; color: var(--text3); margin-bottom: 18px; line-height: 1.6; }
.od-sum { background: var(--bg3); border: 1px solid var(--border); border-radius: 14px; padding: 6px 16px; margin-bottom: 16px; }
.od-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 0; font-size: .88rem; border-bottom: 1px dashed var(--border); }
.od-row:last-child { border-bottom: none; }
.od-row span { color: var(--text3); }
.od-row strong { color: var(--text1); text-align: right; }
.od-row.total strong { font-size: 1.25rem; color: var(--primary); }
.od-row .qty { margin: 0; width: 140px; }
.od-row .qty button { height: 34px; width: 36px; }
.od-field label { display: block; font-size: .8rem; font-weight: 600; margin-bottom: 6px; }
.od-field textarea { width: 100%; border: 1px solid var(--border); border-radius: 12px; padding: 11px 14px; font: inherit; font-size: .88rem; resize: vertical; outline: none; margin-bottom: 16px; }
.od-field textarea:focus { border-color: var(--primary); }
.od-ch { display: flex; flex-direction: column; gap: 9px; }
.od-ch a { display: flex; align-items: center; justify-content: center; gap: 9px; padding: 13px; border-radius: 999px; font-weight: 700; font-size: .92rem; color: #fff; }
.od-ch .wa { background: #25D366; } .od-ch .tg { background: #2AABEE; } .od-ch .em { background: var(--text1); }

@media (max-width: 1100px) { .mk-grid, .pk-grid { grid-template-columns: repeat(2, 1fr); } .mk-benefits { grid-template-columns: repeat(2, 1fr); } .mk-trust { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 700px) {
  .mk-sec { padding: 40px 0; }
  .mk-grid, .pk-grid, .mk-benefits, .mk-steps { grid-template-columns: 1fr; }
  .mk-trust { grid-template-columns: 1fr 1fr; gap: 10px; margin-top: -28px; }
  .mk-trust > div { padding: 12px; flex-direction: column; text-align: center; gap: 6px; }
  .mk-search { min-width: 100%; }
  .mk-chips { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 6px; margin: 0 -16px; padding-left: 16px; padding-right: 16px; width: calc(100% + 32px); scrollbar-width: none; }
  .mk-chip { white-space: nowrap; }
  .pk-tabs { flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start; margin: 0 -16px 24px; padding: 4px 16px; scrollbar-width: none; }
  .pk-tabs button { white-space: nowrap; padding: 10px 16px; font-size: .85rem; }
  .pk-tabs .full { display: none; } .pk-tabs .short { display: inline; }
  .pd-hero { padding: 40px 0 62px; }
}
.pk-price { font-size: 2.1rem; }
.pk-price small { display: block; margin-top: 2px; font-size: .8rem; }
.pk-card.pop { padding: 29px 23px 23px; margin: -1px; }

/* ══ V3.2 — pvaaccounts-style listing cards, light product hero, checkout ══ */
.mk-trust { margin-top: 18px; }
.mk-ico.white { background: var(--surface); border: 1px solid var(--border); box-shadow: 0 4px 14px rgba(6,10,24,.06); }
.mk-active { font-size: .68rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #34D399; background: #0F2A1E; border: 1px solid rgba(34,197,94,.3); padding: 5px 12px; border-radius: 999px; }
.mk-divider { height: 1px; background: var(--border); margin: 16px 0; }
.mk-meta { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 12px; }
.mk-meta div { background: var(--bg3); border-radius: 10px; padding: 8px 10px; }
.mk-meta span { display: block; font-size: .64rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--text3); }
.mk-meta strong { display: block; font-size: .82rem; color: var(--text1); margin-top: 2px; }
.mk-meta strong.g { color: #34D399; }

/* catalog card (left-aligned listing card) */
.mk-card { padding: 20px; border-radius: 22px; }
.mk-card-top { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 14px; }
.mk-card h3 { font-size: 1.08rem; font-weight: 800; letter-spacing: -.01em; }
.mk-card .cat { text-transform: none; letter-spacing: 0; font-size: .8rem; font-weight: 500; margin-top: 3px; }
.mk-tags { margin: 10px 0 0; }
.mk-price { margin-top: 0; padding-top: 0; display: flex; align-items: baseline; gap: 6px; }
.mk-price .usd { font-size: .8rem; font-weight: 700; color: var(--text3); }
.mk-price b { font-size: 1.7rem; color: var(--primary); }
.mk-price small { font-size: .78rem; color: var(--text3); }
.mk-go { margin-top: 16px; background: linear-gradient(135deg, #8B5CF6, #4F6BFF); color: #fff; box-shadow: 0 8px 20px rgba(91,108,255,.28); border-radius: 14px; padding: 12px; }
.mk-card:hover .mk-go { background: linear-gradient(135deg, #9AA6FF, #4453E6); }

/* package card */
.pk-card { text-align: left; padding: 20px; border-radius: 22px; }
.pk-card.pop { padding: 21px; }
.pk-card .mk-ico { margin: 0; }
.pk-top { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 14px; }
.pk-card h4 { font-size: 1.15rem; font-weight: 800; letter-spacing: -.01em; }
.pk-qty { font-size: .82rem; color: var(--text3); margin-top: 3px; line-height: 1.4; }
.pk-price { font-size: 1.9rem; margin: 0; display: flex; align-items: baseline; gap: 6px; }
.pk-price .usd { font-size: .85rem; font-weight: 700; color: var(--text3); letter-spacing: 0; }
.pk-feats { margin: 14px 0 16px; gap: 6px; }
.pk-feats li { background: none; border: none; padding: 0; border-radius: 0; font-size: .8rem; color: var(--text2); align-items: flex-start; }
.pk-feats li::before { margin-top: 1px; }
.pk-badge { top: -12px; right: 16px; left: auto; }
.pk-order { border-radius: 14px; background: linear-gradient(135deg, #8B5CF6, #4F6BFF); box-shadow: 0 8px 20px rgba(91,108,255,.3); }
.qty { border-radius: 12px; }
.qty button { background: var(--surface); border-left: none; }
.pk-tabs button.active { background: linear-gradient(135deg, #8B5CF6, #4F6BFF); border-color: transparent; }
.mk-chip.active { background: linear-gradient(135deg, #8B5CF6, #4F6BFF); border-color: transparent; }

/* product hero → light rounded card */
.pd-hero { background: transparent; color: var(--text1); padding: 26px 0 0; }
.pd-hero::after { display: none; }
.pd-hero .container { background: radial-gradient(900px 300px at 0% 0%, #1A1F4A 0%, transparent 60%), radial-gradient(700px 300px at 100% 100%, #1E2454 0%, transparent 60%), #fff; border: 1px solid var(--border); border-radius: 28px; padding: 38px 28px 46px; box-shadow: 0 14px 44px rgba(91,108,255,.08); }
.crumbs { color: var(--text3); } .crumbs a { color: var(--text2); font-weight: 600; }
.pd-hero .mk-ico { background: var(--surface); border: 1px solid var(--border); box-shadow: 0 10px 28px rgba(6,10,24,.1); }
.pd-hero h1 { color: var(--text1); } .pd-hero h1 em { color: var(--primary); }
.pd-hero p { color: var(--text2); }
.pd-pills span { background: var(--surface); border: 1px solid var(--border); color: var(--text1); }
.pd-pills .stock { background: #0F2A1E; border-color: rgba(34,197,94,.35); color: #34D399; }

/* checkout */
.co-grid { display: grid; grid-template-columns: 1.55fr 1fr; gap: 22px; align-items: start; }
.co-card { background: var(--surface); border: 1px solid var(--border); border-radius: 22px; padding: 26px; margin-bottom: 20px; box-shadow: 0 4px 18px rgba(6,10,24,.04); }
.co-grid > div .co-card:last-child { margin-bottom: 0; }
.co-card h3 { font-size: 1.1rem; font-weight: 800; display: flex; align-items: center; gap: 10px; margin-bottom: 18px; }
.co-ic { font-size: 1.15rem; }
.co-item { display: flex; align-items: center; gap: 16px; padding-bottom: 18px; border-bottom: 1px solid var(--border); }
.co-name { font-size: 1.15rem; font-weight: 800; }
.co-sub { font-size: .84rem; color: var(--text3); margin-top: 5px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.co-pill { font-size: .72rem; font-weight: 700; color: #34D399; background: #0F2A1E; padding: 3px 10px; border-radius: 999px; }
.co-pill.alt { color: var(--primary-dark); background: var(--primary-light); }
.co-sold { padding-top: 14px; font-size: .88rem; color: var(--text3); }
.co-sold strong { color: var(--text1); }
.co-note { background: var(--bg3); border-radius: 14px; padding: 14px 16px; font-size: .86rem; color: var(--text2); line-height: 1.6; margin-bottom: 16px; }
.co-tabs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 14px; }
.co-tabs button { padding: 14px; border-radius: 14px; border: 1.5px solid var(--border); background: var(--surface); font-weight: 700; font-size: .95rem; cursor: pointer; color: var(--text1); transition: all .15s; }
.co-tabs button.active { border-color: var(--primary); background: var(--primary-light); color: var(--primary-dark); }
.co-input { width: 100%; padding: 14px 16px; border: 1.5px solid var(--border); border-radius: 14px; font: inherit; font-size: .95rem; outline: none; background: var(--surface); }
.co-input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(91,108,255,.12); }
.co-hint { font-size: .85rem; color: var(--text3); margin: 10px 2px 18px; }
.co-label { display: block; font-size: .82rem; font-weight: 700; margin-bottom: 8px; }
.co-row { display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 13px 0; font-size: .92rem; }
.co-row span { color: var(--text3); }
.co-row strong { text-align: right; }
.co-row .qty { margin: 0; width: 150px; }
.co-row .qty button { height: 36px; width: 38px; }
.co-row.total { border-top: 1px solid var(--border); margin-top: 6px; padding-top: 18px; }
.co-row.total span { font-weight: 800; color: var(--text1); }
.co-row.total strong { font-size: 1.8rem; color: var(--primary); }
.co-sum .pk-order { margin-top: 10px; padding: 16px; font-size: 1rem; }
.co-err { color: #F87171; font-size: .85rem; font-weight: 600; margin-top: 10px; text-align: center; min-height: 1em; }
.co-trust { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; text-align: center; margin-top: 16px; font-size: 1.1rem; }
.co-trust span { display: block; font-size: .72rem; font-weight: 600; color: var(--text3); margin-top: 3px; }
.co-fine { background: var(--bg3); border-radius: 14px; padding: 12px 14px; font-size: .78rem; color: var(--text3); line-height: 1.6; margin-top: 16px; }
@media (max-width: 900px) { .co-grid { grid-template-columns: 1fr; } }
@media (max-width: 700px) { .page-hero .container, .pd-hero .container { padding: 34px 18px 40px; border-radius: 22px; } .co-card { padding: 20px; } .co-tabs button { font-size: .82rem; padding: 12px 6px; } }
.mk-grid > *, .pk-grid > * { min-width: 0; }
.mk-meta { gap: 6px; }
.mk-meta div { padding: 8px 8px; min-width: 0; }
.mk-meta span { font-size: .6rem; white-space: nowrap; }
.mk-meta strong { font-size: .78rem; white-space: nowrap; }
@media (min-width: 1101px) { .mk-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } .pk-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
