/* ════════════════════════════════════════
   Oxen Kraft B2B Product Template v2
   Light Theme | Outfit + Playfair Display
════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&family=Playfair+Display:ital,wght@0,600;0,700;1,600&display=swap');

/* ── Reset ── */
#okpt-wrap, #okpt-wrap * { box-sizing: border-box !important; }

#okpt-wrap {
    font-family: 'Outfit', sans-serif !important;
    color: #111827 !important;
    background: #fff !important;
    max-width: 1400px !important;
    margin: 0 auto !important;
    padding: 0 24px 80px !important;
}

#okpt-wrap h1, #okpt-wrap h2, #okpt-wrap h3, #okpt-wrap h4 {
    font-family: 'Playfair Display', serif !important;
    color: #111827 !important;
    margin: 0 !important;
    line-height: 1.15 !important;
}
#okpt-wrap p  { color: #4b5563 !important; line-height: 1.7 !important; margin: 0 !important; }
#okpt-wrap a  { text-decoration: none !important; color: inherit !important; }
#okpt-wrap ul { list-style: none !important; padding: 0 !important; margin: 0 !important; }
#okpt-wrap button { cursor: pointer !important; }

/* Eyebrow */
#okpt-wrap .okpt-eyebrow {
    display: inline-block !important;
    font-family: 'Outfit', sans-serif !important;
    font-size: 10px !important; font-weight: 700 !important;
    letter-spacing: .25em !important; text-transform: uppercase !important;
    color: #f97316 !important; margin-bottom: 10px !important;
}

/* ════ BREADCRUMB ════ */
#okpt-wrap .okpt-bc {
    display: flex !important; gap: 6px !important; align-items: center !important;
    flex-wrap: wrap !important; font-size: 12px !important; color: #9ca3af !important;
    padding: 20px 0 32px !important;
}
#okpt-wrap .okpt-bc a         { color: #9ca3af !important; transition: color .2s !important; }
#okpt-wrap .okpt-bc a:hover   { color: #f97316 !important; }
#okpt-wrap .okpt-bc-sep       { color: #d1d5db !important; }
#okpt-wrap .okpt-bc-cur       { color: #374151 !important; font-weight: 600 !important; }

/* ════ HERO ════ */
#okpt-wrap .okpt-hero {
    display: grid !important;
    grid-template-columns: 1fr 1.2fr !important;
    gap: 64px !important;
    align-items: start !important;
    margin-bottom: 72px !important;
}
@media (max-width: 960px) {
    #okpt-wrap .okpt-hero { grid-template-columns: 1fr !important; gap: 32px !important; }
}

/* Gallery */
#okpt-wrap .okpt-gallery       { position: sticky !important; top: 24px !important; }
#okpt-wrap .okpt-main-wrap     {
    position: relative !important; border-radius: 18px !important; overflow: hidden !important;
    background: #f9fafb !important;
    border: 1.5px solid #f3f4f6 !important;
    box-shadow: 0 4px 24px rgba(0,0,0,.06) !important;
}
#okpt-wrap .okpt-main-img      {
    width: 100% !important;
    display: block !important;
    aspect-ratio: 4/5 !important;
    object-fit: contain !important;
    object-position: center center !important;
    background-color: #f9fafb !important;
    border-radius: 16px !important;
    transition: opacity .25s ease !important;
}
#okpt-wrap .okpt-stock {
    position: absolute !important; top: 14px !important; left: 14px !important;
    font-size: 11px !important; font-weight: 700 !important;
    padding: 4px 12px !important; border-radius: 20px !important;
    font-family: 'Outfit', sans-serif !important;
}
#okpt-wrap .okpt-stock-ok   { background: #d1fae5 !important; color: #065f46 !important; }
#okpt-wrap .okpt-stock-low  { background: #fef3c7 !important; color: #92400e !important; }
#okpt-wrap .okpt-stock-out  { background: #fee2e2 !important; color: #991b1b !important; }
#okpt-wrap .okpt-stock-back { background: #e0e7ff !important; color: #3730a3 !important; }

#okpt-wrap .okpt-compare-badge {
    position: absolute !important; top: 14px !important; right: 14px !important; z-index: 5 !important;
}
#okpt-wrap .okpt-thumbs {
    display: flex !important; gap: 10px !important; margin-top: 12px !important; flex-wrap: wrap !important;
}
#okpt-wrap .okpt-thumb {
    width: 84px !important; height: 84px !important;
    border-radius: 10px !important; flex-shrink: 0 !important;
    background-size: contain !important; background-position: center !important;
    background-repeat: no-repeat !important;
    background-color: #f9fafb !important;
    border: 2.5px solid transparent !important;
    transition: border-color .2s !important; cursor: pointer !important;
    padding: 0 !important;
}
#okpt-wrap .okpt-thumb.active, #okpt-wrap .okpt-thumb:hover { border-color: #f97316 !important; }

/* Info column */
#okpt-wrap .okpt-cat {
    display: inline-block !important;
    font-size: 10px !important; font-weight: 700 !important;
    letter-spacing: .18em !important; text-transform: uppercase !important;
    color: #f97316 !important; background: #fff7ed !important;
    border: 1px solid #fed7aa !important;
    padding: 4px 12px !important; border-radius: 20px !important;
    margin-bottom: 14px !important; font-family: 'Outfit', sans-serif !important;
}
#okpt-wrap .okpt-title  { font-size: clamp(22px,4vw,38px) !important; font-weight: 700 !important; margin-bottom: 8px !important; line-height: 1.2 !important; }
#okpt-wrap .okpt-sku    { font-size: 12px !important; color: #9ca3af !important; margin-bottom: 14px !important; font-family: 'Outfit', sans-serif !important; }
#okpt-wrap .okpt-sku strong { color: #6b7280 !important; }
#okpt-wrap .okpt-sdesc  {
    font-size: 14px !important; color: #4b5563 !important; line-height: 1.75 !important;
    padding-bottom: 22px !important; margin-bottom: 22px !important;
    border-bottom: 1px solid #f3f4f6 !important; font-family: 'Outfit', sans-serif !important;
}

/* Specs grid */
#okpt-wrap .okpt-specs {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    margin-bottom: 28px !important;
}
#okpt-wrap .okpt-spec {
    display: flex !important; gap: 11px !important; align-items: flex-start !important;
    background: #f9fafb !important; border: 1px solid #f3f4f6 !important;
    border-radius: 10px !important; padding: 13px !important;
    transition: border-color .2s !important;
}
#okpt-wrap .okpt-spec:hover { border-color: #fed7aa !important; }
#okpt-wrap .okpt-spec-ic {
    color: #f97316 !important; flex-shrink: 0 !important;
    width: 20px !important; margin-top: 1px !important;
}
#okpt-wrap .okpt-spec-ic svg { display: block !important; }
#okpt-wrap .okpt-spec div    { display: flex !important; flex-direction: column !important; gap: 2px !important; }
#okpt-wrap .okpt-spec-l      { font-size: 10px !important; text-transform: uppercase !important; letter-spacing: .1em !important; color: #9ca3af !important; font-weight: 700 !important; }
#okpt-wrap .okpt-spec-v      { font-size: 13px !important; font-weight: 600 !important; color: #111827 !important; }

/* CTA Buttons */
#okpt-wrap .okpt-cta {
    display: flex !important; gap: 10px !important;
    flex-wrap: wrap !important; align-items: center !important;
    margin-bottom: 20px !important;
}
#okpt-wrap .okpt-btn {
    display: inline-flex !important; align-items: center !important;
    justify-content: center !important; gap: 8px !important;
    font-family: 'Outfit', sans-serif !important;
    font-size: 13px !important; font-weight: 700 !important;
    padding: 13px 22px !important; border-radius: 10px !important;
    cursor: pointer !important; border: none !important;
    text-decoration: none !important; white-space: nowrap !important;
    transition: all .25s ease !important;
}
#okpt-wrap .okpt-btn svg { flex-shrink: 0 !important; display: block !important; }
#okpt-wrap .okpt-btn-primary {
    background: #f97316 !important; color: #fff !important;
    box-shadow: 0 4px 14px rgba(249,115,22,.22) !important; flex: 1 !important;
}
#okpt-wrap .okpt-btn-primary:hover { background: #ea580c !important; transform: translateY(-1px) !important; }
#okpt-wrap .okpt-btn-dark {
    background: #111827 !important; color: #fff !important;
    width: 48px !important; height: 48px !important; padding: 0 !important;
}
#okpt-wrap .okpt-btn-dark:hover { background: #1f2937 !important; }
#okpt-wrap .okpt-btn-wa {
    background: #22c55e !important; color: #fff !important;
    width: 48px !important; height: 48px !important; padding: 0 !important;
}
#okpt-wrap .okpt-btn-wa:hover { background: #16a34a !important; }
#okpt-wrap .okpt-btn-full   { width: 100% !important; }

/* Trust */
#okpt-wrap .okpt-trust {
    display: flex !important; flex-wrap: wrap !important; gap: 16px !important;
    font-family: 'Outfit', sans-serif !important;
    font-size: 12px !important; font-weight: 500 !important; color: #6b7280 !important;
    padding-top: 18px !important; border-top: 1px solid #f3f4f6 !important;
}
#okpt-wrap .okpt-trust span {
    display: flex !important; align-items: center !important;
    gap: 5px !important; color: #6b7280 !important;
}
#okpt-wrap .okpt-trust svg { color: #f97316 !important; flex-shrink: 0 !important; }

/* ════ TABS ════ */
#okpt-wrap .okpt-tabs         { margin-bottom: 72px !important; }
#okpt-wrap .okpt-tabs-nav     { display: flex !important; border-bottom: 2px solid #f3f4f6 !important; margin-bottom: 32px !important; flex-wrap: wrap !important; }
#okpt-wrap .okpt-tab {
    font-family: 'Outfit', sans-serif !important; font-size: 13px !important; font-weight: 600 !important;
    padding: 12px 24px !important; background: none !important; border: none !important;
    color: #9ca3af !important; border-bottom: 2px solid transparent !important; margin-bottom: -2px !important;
    transition: all .2s !important;
}
#okpt-wrap .okpt-tab:hover          { color: #374151 !important; }
#okpt-wrap .okpt-tab.active         { color: #f97316 !important; border-bottom-color: #f97316 !important; }
#okpt-wrap .okpt-tab-panel          { display: none !important; }
#okpt-wrap .okpt-tab-panel.active   { display: block !important; }

#okpt-wrap .okpt-ldesc { font-size: 15px !important; line-height: 1.8 !important; color: #374151 !important; max-width: 800px !important; font-family: 'Outfit', sans-serif !important; }
#okpt-wrap .okpt-ldesc h2, #okpt-wrap .okpt-ldesc h3 { margin: 24px 0 12px !important; }
#okpt-wrap .okpt-ldesc ul, #okpt-wrap .okpt-ldesc ol { padding-left: 20px !important; margin-bottom: 16px !important; list-style: initial !important; }
#okpt-wrap .okpt-ldesc li { margin-bottom: 6px !important; color: #374151 !important; }

#okpt-wrap .okpt-spec-tbl { width: 100% !important; border-collapse: collapse !important; font-family: 'Outfit', sans-serif !important; font-size: 14px !important; }
#okpt-wrap .okpt-spec-tbl tr { border-bottom: 1px solid #f3f4f6 !important; transition: background .15s !important; }
#okpt-wrap .okpt-spec-tbl tr:hover { background: #fafafa !important; }
#okpt-wrap .okpt-spec-tbl th { width: 36% !important; padding: 13px 16px !important; text-align: left !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: .1em !important; text-transform: uppercase !important; color: #9ca3af !important; }
#okpt-wrap .okpt-spec-tbl td { padding: 13px 16px !important; color: #111827 !important; font-weight: 500 !important; }

#okpt-wrap .okpt-ship-grid { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(200px,1fr)) !important; gap: 16px !important; }
#okpt-wrap .okpt-ship-card { background: #f9fafb !important; border: 1px solid #f3f4f6 !important; border-radius: 12px !important; padding: 22px !important; transition: border-color .2s !important; }
#okpt-wrap .okpt-ship-card:hover { border-color: #fed7aa !important; }
#okpt-wrap .okpt-ship-ic { color: #f97316 !important; margin-bottom: 12px !important; }
#okpt-wrap .okpt-ship-ic svg { display: block !important; width: 22px !important; height: 22px !important; }
#okpt-wrap .okpt-ship-card h4 { font-family: 'Outfit', sans-serif !important; font-size: 14px !important; font-weight: 700 !important; color: #111827 !important; margin-bottom: 6px !important; }
#okpt-wrap .okpt-ship-card p  { font-size: 13px !important; color: #6b7280 !important; line-height: 1.6 !important; }

/* ════ FORM SECTION ════ */
#okpt-wrap .okpt-form-sec {
    background: #fff7ed !important; border: 1px solid #fed7aa !important;
    border-radius: 20px !important; margin-bottom: 72px !important; overflow: hidden !important;
}
#okpt-wrap .okpt-form-inner { display: grid !important; grid-template-columns: 1fr 1.2fr !important; }
@media (max-width: 820px) { #okpt-wrap .okpt-form-inner { grid-template-columns: 1fr !important; } }

#okpt-wrap .okpt-form-left { padding: 44px 36px !important; border-right: 1px solid #fed7aa !important; }
@media (max-width:820px) { #okpt-wrap .okpt-form-left { border-right: none !important; border-bottom: 1px solid #fed7aa !important; padding: 32px 24px !important; } }
#okpt-wrap .okpt-form-left h2 { font-size: clamp(22px,3vw,32px) !important; margin-bottom: 10px !important; }
#okpt-wrap .okpt-form-left h2 em { color: #f97316 !important; font-style: italic !important; }
#okpt-wrap .okpt-form-sub { font-size: 14px !important; margin-bottom: 24px !important; }
#okpt-wrap .okpt-perks { display: flex !important; flex-direction: column !important; gap: 10px !important; }
#okpt-wrap .okpt-perks li { display: flex !important; align-items: center !important; gap: 8px !important; font-size: 13px !important; color: #374151 !important; font-family: 'Outfit', sans-serif !important; }
#okpt-wrap .okpt-perks li svg { color: #f97316 !important; flex-shrink: 0 !important; }

#okpt-wrap .okpt-form-right { padding: 44px 36px !important; background: #fff !important; }
@media (max-width:820px) { #okpt-wrap .okpt-form-right { padding: 28px 24px !important; } }

#okpt-wrap .okpt-row { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 12px !important; margin-bottom: 12px !important; }
@media (max-width: 560px) { #okpt-wrap .okpt-row { grid-template-columns: 1fr !important; } }

#okpt-wrap .okpt-f { display: flex !important; flex-direction: column !important; gap: 5px !important; margin-bottom: 12px !important; }
#okpt-wrap .okpt-f-full { grid-column: 1/-1 !important; }
#okpt-wrap .okpt-f label {
    font-family: 'Outfit', sans-serif !important;
    font-size: 11px !important; font-weight: 700 !important;
    letter-spacing: .1em !important; text-transform: uppercase !important; color: #6b7280 !important;
}
#okpt-wrap .req { color: #f97316 !important; }
#okpt-wrap .okpt-f input:not([type="checkbox"]),
#okpt-wrap .okpt-f textarea {
    width: 100% !important; background: #f9fafb !important;
    border: 1.5px solid #e5e7eb !important; border-radius: 8px !important;
    padding: 11px 13px !important; font-family: 'Outfit', sans-serif !important;
    font-size: 14px !important; color: #111827 !important;
    outline: none !important; transition: border-color .2s, background .2s !important;
    -webkit-appearance: none !important;
}
#okpt-wrap .okpt-f input:not([type="checkbox"]):focus,
#okpt-wrap .okpt-f textarea:focus { border-color: #f97316 !important; background: #fff !important; box-shadow: 0 0 0 3px rgba(249,115,22,.08) !important; }
#okpt-wrap .okpt-f input:not([type="checkbox"])::placeholder,
#okpt-wrap .okpt-f textarea::placeholder { color: #c4c4c4 !important; }
#okpt-wrap .okpt-f textarea { resize: vertical !important; min-height: 100px !important; }

#okpt-wrap .okpt-chk-label {
    display: flex !important; align-items: center !important; gap: 10px !important;
    font-family: 'Outfit', sans-serif !important; font-size: 13px !important;
    font-weight: 500 !important; color: #374151 !important; cursor: pointer !important;
    text-transform: none !important; letter-spacing: 0 !important;
    background: #f9fafb !important; border: 1.5px solid #e5e7eb !important;
    border-radius: 8px !important; padding: 12px 14px !important;
    transition: border-color .2s, background .2s !important;
}
#okpt-wrap .okpt-chk-label:hover { border-color: #f97316 !important; background: #fff7ed !important; }
#okpt-wrap .okpt-chk-label input[type="checkbox"] {
    -webkit-appearance: checkbox !important;
    appearance: checkbox !important;
    width: 18px !important; height: 18px !important;
    accent-color: #f97316 !important; flex-shrink: 0 !important;
    padding: 0 !important; cursor: pointer !important;
    margin: 0 !important;
}
#okpt-wrap .okpt-chk-label svg { color: #f97316 !important; flex-shrink: 0 !important; }

#okpt-wrap .okpt-msg { padding: 12px 16px !important; border-radius: 8px !important; font-family: 'Outfit', sans-serif !important; font-size: 14px !important; margin-bottom: 12px !important; }
#okpt-wrap .okpt-msg.success { background: #d1fae5 !important; color: #065f46 !important; border: 1px solid #a7f3d0 !important; }
#okpt-wrap .okpt-msg.error   { background: #fee2e2 !important; color: #991b1b !important; border: 1px solid #fca5a5 !important; }
#okpt-wrap .okpt-fn { font-size: 11px !important; color: #9ca3af !important; text-align: center !important; margin-top: 10px !important; font-family: 'Outfit', sans-serif !important; }

/* ════ REVIEWS ════ */
#okpt-wrap .okpt-reviews { margin-bottom: 72px !important; }
#okpt-wrap .okpt-sec-head { margin-bottom: 28px !important; }
#okpt-wrap .okpt-sec-title { font-size: clamp(20px,3vw,30px) !important; }

/* ════ ABOUT ════ */
#okpt-wrap .okpt-about {
    display: grid !important; grid-template-columns: 300px 1fr !important;
    gap: 0 !important; margin-bottom: 72px !important;
    background: #fff !important;
    border: 1px solid #f3f4f6 !important;
    border-radius: 24px !important; overflow: hidden !important;
    box-shadow: 0 8px 40px rgba(0,0,0,.06) !important;
}
@media (max-width: 700px) { #okpt-wrap .okpt-about { grid-template-columns: 1fr !important; } }

#okpt-wrap .okpt-about-logo-col {
    background: linear-gradient(150deg, #fff7ed 0%, #ffedd5 50%, #fed7aa 100%) !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
    padding: 52px 36px !important; border-right: 1px solid #fed7aa !important;
    position: relative !important; overflow: hidden !important;
}
#okpt-wrap .okpt-about-logo-col::before {
    content: '' !important;
    position: absolute !important; top: -50px !important; right: -50px !important;
    width: 220px !important; height: 220px !important;
    border-radius: 50% !important; background: rgba(249,115,22,.08) !important;
    pointer-events: none !important;
}
#okpt-wrap .okpt-about-logo-col::after {
    content: '' !important;
    position: absolute !important; bottom: -40px !important; left: -30px !important;
    width: 160px !important; height: 160px !important;
    border-radius: 50% !important; background: rgba(249,115,22,.06) !important;
    pointer-events: none !important;
}
@media (max-width:700px) { #okpt-wrap .okpt-about-logo-col { border-right: none !important; border-bottom: 1px solid #fed7aa !important; padding: 36px 24px !important; } }

#okpt-wrap .okpt-logo {
    width: 180px !important; height: auto !important; display: block !important;
    position: relative !important; z-index: 1 !important;
    filter: drop-shadow(0 4px 16px rgba(249,115,22,.18)) !important;
}

#okpt-wrap .okpt-about-body { padding: 52px 56px !important; }
@media (max-width:700px) { #okpt-wrap .okpt-about-body { padding: 32px 24px !important; } }
#okpt-wrap .okpt-about-body h3 {
    font-size: 30px !important; margin-bottom: 14px !important; color: #111827 !important;
}
#okpt-wrap .okpt-about-body > p {
    font-size: 15px !important; line-height: 1.8 !important;
    margin-bottom: 36px !important; max-width: 620px !important; color: #4b5563 !important;
}

#okpt-wrap .okpt-about-stats {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 14px !important;
    margin-bottom: 36px !important;
}
@media (max-width: 860px) { #okpt-wrap .okpt-about-stats { grid-template-columns: repeat(2, 1fr) !important; } }

#okpt-wrap .okpt-astat {
    display: flex !important; flex-direction: column !important; align-items: flex-start !important;
    gap: 4px !important;
    background: #f9fafb !important;
    border: 1px solid #f3f4f6 !important;
    border-radius: 14px !important; padding: 20px 18px !important;
    transition: border-color .2s, transform .25s, box-shadow .25s !important;
}
#okpt-wrap .okpt-astat:hover {
    border-color: #fed7aa !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 6px 20px rgba(249,115,22,.1) !important;
}
#okpt-wrap .okpt-astat strong {
    font-family: 'Outfit', sans-serif !important;
    font-size: 30px !important; font-weight: 800 !important; color: #f97316 !important;
    line-height: 1 !important;
}
#okpt-wrap .okpt-astat span {
    font-family: 'Outfit', sans-serif !important;
    font-size: 11px !important; color: #9ca3af !important;
    text-transform: uppercase !important; letter-spacing: .12em !important;
    font-weight: 600 !important;
}

#okpt-wrap .okpt-about-cta {
    display: flex !important; gap: 12px !important; flex-wrap: wrap !important;
    padding-top: 4px !important;
}
#okpt-wrap .okpt-about-cta .okpt-btn-dark,
#okpt-wrap .okpt-about-cta .okpt-btn-wa {
    width: auto !important; height: auto !important;
    padding: 13px 24px !important; font-size: 14px !important;
}

/* ════ RELATED SLIDER ════ */
#okpt-wrap .okpt-related        { margin-bottom: 40px !important; }
#okpt-wrap .okpt-related .swiper { padding-bottom: 44px !important; overflow: hidden !important; }

#okpt-wrap .okpt-rel-card {
    display: block !important;
    background: #fff !important; border: 1px solid #f3f4f6 !important;
    border-radius: 14px !important; overflow: hidden !important;
    transition: border-color .25s, transform .25s !important;
    text-decoration: none !important;
}
#okpt-wrap .okpt-rel-card:hover { border-color: #fed7aa !important; transform: translateY(-3px) !important; }
#okpt-wrap .okpt-rel-img {
    width: 100% !important; aspect-ratio: 4/3 !important;
    background-size: cover !important; background-position: center !important;
    background-color: #f3f4f6 !important;
}
#okpt-wrap .okpt-rel-info { padding: 16px !important; display: flex !important; flex-direction: column !important; gap: 5px !important; }
#okpt-wrap .okpt-rel-sku  { font-size: 10px !important; color: #9ca3af !important; letter-spacing: .1em !important; text-transform: uppercase !important; font-family: 'Outfit', sans-serif !important; }
#okpt-wrap .okpt-rel-info h4 { font-family: 'Outfit', sans-serif !important; font-size: 14px !important; font-weight: 700 !important; color: #111827 !important; }
#okpt-wrap .okpt-rel-lead { font-size: 12px !important; color: #6b7280 !important; display: flex !important; align-items: center !important; gap: 5px !important; font-family: 'Outfit', sans-serif !important; }
#okpt-wrap .okpt-rel-lead svg { color: #f97316 !important; flex-shrink: 0 !important; }

/* Related swiper nav */
#okpt-wrap .okptRelSwiper .swiper-button-next,
#okpt-wrap .okptRelSwiper .swiper-button-prev {
    width: 36px !important; height: 36px !important;
    background: #fff !important; border-radius: 50% !important;
    box-shadow: 0 2px 12px rgba(0,0,0,.1) !important;
    color: #374151 !important;
    top: 35% !important;
}
#okpt-wrap .okptRelSwiper .swiper-button-next:after,
#okpt-wrap .okptRelSwiper .swiper-button-prev:after { font-size: 12px !important; font-weight: 900 !important; }
#okpt-wrap .okptRelSwiper .swiper-button-next:hover,
#okpt-wrap .okptRelSwiper .swiper-button-prev:hover { background: #f97316 !important; color: #fff !important; }
#okpt-wrap .okptRelSwiper .swiper-pagination-bullet-active { background: #f97316 !important; }

/* ════ REVIEWS CSS OVERRIDE (from OKR plugin) ════ */
#okpt-wrap .okr-reviews-wrap { max-width: 100% !important; }
#okpt-wrap .okr-summary-bar {
    display: flex !important; gap: 24px !important; align-items: center !important;
    background: #f9fafb !important; border: 1px solid #f3f4f6 !important;
    border-radius: 14px !important; padding: 24px !important; margin-bottom: 28px !important;
    flex-wrap: wrap !important;
}
#okpt-wrap .okr-summary-score { text-align: center !important; min-width: 90px !important; }
#okpt-wrap .okr-big-score { font-family: 'Outfit', sans-serif !important; font-size: 48px !important; font-weight: 800 !important; color: #f97316 !important; line-height: 1 !important; display: block !important; }
#okpt-wrap .okr-summary-stars { margin: 6px 0 4px !important; }
#okpt-wrap .okr-summary-count { font-size: 12px !important; color: #9ca3af !important; font-family: 'Outfit', sans-serif !important; }
#okpt-wrap .okr-rating-bars { flex: 1 !important; min-width: 180px !important; display: flex !important; flex-direction: column !important; gap: 6px !important; }
#okpt-wrap .okr-rating-bar-row { display: flex !important; align-items: center !important; gap: 8px !important; font-size: 12px !important; }
#okpt-wrap .okr-bar-label { width: 28px !important; color: #6b7280 !important; font-weight: 600 !important; font-family: 'Outfit', sans-serif !important; }
#okpt-wrap .okr-bar-track { flex: 1 !important; height: 7px !important; background: #e5e7eb !important; border-radius: 4px !important; overflow: hidden !important; }
#okpt-wrap .okr-bar-fill { height: 100% !important; background: #f97316 !important; border-radius: 4px !important; }
#okpt-wrap .okr-bar-count { width: 18px !important; text-align: right !important; color: #9ca3af !important; font-family: 'Outfit', sans-serif !important; }
#okpt-wrap .okr-reviews-list { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(280px,1fr)) !important; gap: 16px !important; }
#okpt-wrap .okr-review-card {
    background: #fff !important; border: 1px solid #f3f4f6 !important;
    border-radius: 12px !important; padding: 20px !important;
    transition: border-color .2s !important;
}
#okpt-wrap .okr-review-card:hover { border-color: #fed7aa !important; }
#okpt-wrap .okr-review-header { display: flex !important; gap: 12px !important; align-items: flex-start !important; margin-bottom: 12px !important; }
#okpt-wrap .okr-reviewer-avatar { width: 38px !important; height: 38px !important; background: #f97316 !important; color: #fff !important; border-radius: 50% !important; display: flex !important; align-items: center !important; justify-content: center !important; font-weight: 800 !important; font-size: 15px !important; flex-shrink: 0 !important; font-family: 'Outfit', sans-serif !important; }
#okpt-wrap .okr-reviewer-info { flex: 1 !important; }
#okpt-wrap .okr-reviewer-name { font-size: 14px !important; font-weight: 700 !important; color: #111827 !important; display: block !important; margin-bottom: 3px !important; font-family: 'Outfit', sans-serif !important; }
#okpt-wrap .okr-verified-badge { font-size: 11px !important; color: #059669 !important; font-weight: 600 !important; background: #d1fae5 !important; padding: 2px 8px !important; border-radius: 10px !important; font-family: 'Outfit', sans-serif !important; }
#okpt-wrap .okr-review-meta { margin-left: auto !important; text-align: right !important; }
#okpt-wrap .okr-review-date { font-size: 11px !important; color: #9ca3af !important; display: block !important; margin-top: 3px !important; font-family: 'Outfit', sans-serif !important; }
#okpt-wrap .okr-stars { letter-spacing: 2px !important; }
#okpt-wrap .okr-star.filled { color: #f97316 !important; }
#okpt-wrap .okr-star:not(.filled) { color: #d1d5db !important; }
#okpt-wrap .okr-review-body { font-size: 14px !important; color: #374151 !important; line-height: 1.7 !important; font-family: 'Outfit', sans-serif !important; }
#okpt-wrap .okr-review-image { margin-top: 12px !important; }
#okpt-wrap .okr-review-image img { max-width: 140px !important; border-radius: 8px !important; border: 1px solid #e5e7eb !important; }
#okpt-wrap .okr-no-reviews { padding: 32px !important; text-align: center !important; background: #f9fafb !important; border-radius: 12px !important; color: #9ca3af !important; font-family: 'Outfit', sans-serif !important; }

@media (max-width: 600px) {
    #okpt-wrap .okr-reviews-list { grid-template-columns: 1fr !important; }
    #okpt-wrap .okr-review-header { flex-wrap: wrap !important; }
    #okpt-wrap .okr-review-meta { margin-left: 0 !important; text-align: left !important; width: 100% !important; }
    #okpt-wrap .okpt-specs { grid-template-columns: 1fr !important; }
    #okpt-wrap .okpt-thumb { width: 60px !important; height: 60px !important; }
}
