.os-content-page { box-sizing: border-box; min-width: 0; padding: 0 16px 28px; color: #0f172a; font-size: 14px; line-height: 1.6; }
.os-content-page *, .os-content-page *::before, .os-content-page *::after { box-sizing: border-box; }
.os-content-page svg { width: 20px; height: 20px; flex-shrink: 0; }
.os-content-page a { text-decoration: none; }
.os-content-page a:focus-visible, .os-content-page button:focus-visible { outline: 2px solid #f97316; outline-offset: 3px; }
.os-content-page h1, .os-content-page h2, .os-content-page h3, .os-content-page p { margin: 0; }
.os-content-page h1 { font-size: 24px; font-weight: 800; line-height: 1.35; letter-spacing: -.5px; overflow-wrap: anywhere; }
.os-content-page h2 { font-size: 19px; font-weight: 800; line-height: 1.4; }
.os-content-page h3 { font-size: 15px; font-weight: 700; }
.os-content-page .breadcrumb { display: flex; align-items: center; gap: 8px; overflow-x: auto; list-style: none; margin: 0 0 8px; padding: 14px 0; font-size: 12px; color: #64748b; white-space: nowrap; }
.os-content-page .breadcrumb li { display: flex; align-items: center; gap: 8px; }
.os-content-page .breadcrumb li + li::before { content: '›'; color: #94a3b8; }
.os-content-page .breadcrumb a { display: inline-flex; align-items: center; color: inherit; }
.os-content-page .breadcrumb a:hover { color: #f97316; }
.os-content-page .breadcrumb [aria-current=page] { font-weight: 600; color: #334155; }
.os-content-page .section-heading__eyebrow { display: block; margin-bottom: 4px; font-size: 12px; font-weight: 600; color: #64748b; }
.os-content-page .information-card, .os-content-page .contact-form, .os-content-page .contact-detail-card, .os-content-page .contact-location-card { border: 1px solid #f1f5f9; border-radius: 8px; background: white; box-shadow: 0 2px 12px #0f172a0f; }
.os-content-page .information-card { padding: 20px; }
.os-content-page .information-card__heading, .os-content-page .contact-hero { display: flex; align-items: center; gap: 12px; }
.os-content-page .information-card__heading { padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid #f1f5f9; }
.os-content-page .information-card__icon, .os-content-page .contact-hero__icon { display: grid; place-items: center; width: 48px; height: 48px; flex-shrink: 0; border-radius: 12px; background: #ffedd5; color: #ea580c; }
.os-content-page .information-card__icon svg, .os-content-page .contact-hero__icon svg { width: 24px; height: 24px; }
.os-content-page .information-card__content { max-width: 78ch; color: #475569; font-size: 14px; line-height: 1.85; overflow-wrap: anywhere; overflow-x: auto; }
.os-content-page .information-card__content p { margin-bottom: 16px; }
.os-content-page .information-card__content h2, .os-content-page .information-card__content h3 { margin: 24px 0 12px; color: #0f172a; }
.os-content-page .information-card__content ul, .os-content-page .information-card__content ol { padding-left: 24px; margin: 12px 0 20px; }
.os-content-page .information-card__content ul { list-style: disc; }
.os-content-page .information-card__content ol { list-style: decimal; }
.os-content-page .information-card__content li { margin-bottom: 6px; }
.os-content-page .information-card__content a, .os-content-page .success-card__message a { color: #ea580c; text-decoration: underline; text-underline-offset: 3px; }
.os-content-page .information-card__content img, .os-content-page .information-card__content iframe { max-width: 100%; }
.os-content-page .information-card__content img { height: auto; border-radius: 8px; }
.os-content-page .information-card__content table { width: 100%; border-collapse: collapse; margin: 16px 0; }
.os-content-page .information-card__content td, .os-content-page .information-card__content th { padding: 12px; border: 1px solid #e2e8f0; text-align: left; }
.os-content-page .information-card__content blockquote { margin: 16px 0; padding: 12px 16px; border-left: 3px solid #f97316; background: #fff7ed; border-radius: 0 8px 8px 0; }
.os-content-page .contact-hero { margin: 8px 0 24px; }
.os-content-page .contact-hero p { margin-top: 6px; font-size: 13px; color: #64748b; }
.os-content-page .contact-layout { display: grid; align-items: start; gap: 20px; }
.os-content-page .contact-details { display: grid; gap: 12px; min-width: 0; }
.os-content-page .contact-store-image { overflow: hidden; border-radius: 8px; }
.os-content-page .contact-store-image img { display: block; width: 100%; max-height: 240px; object-fit: cover; }
.os-content-page .contact-detail-card { display: flex; align-items: flex-start; gap: 12px; padding: 16px; }
.os-content-page .contact-detail-card > svg { color: #f97316; margin-top: 3px; }
.os-content-page .contact-detail-card > div { min-width: 0; overflow-wrap: anywhere; }
.os-content-page .contact-detail-card small { display: block; margin-bottom: 4px; font-size: 11px; color: #64748b; }
.os-content-page .contact-detail-card strong { font-weight: 700; }
.os-content-page address { margin: 6px 0; font-size: 13px; font-style: normal; line-height: 1.8; color: #64748b; }
.os-content-page .contact-detail-card a, .os-content-page .contact-location-card a { display: inline-flex; align-items: center; gap: 6px; padding: 6px 0; color: #ea580c; font-weight: 600; font-size: 13px; }
.os-content-page .contact-detail-card p { font-size: 13px; color: #64748b; }
.os-content-page .contact-detail-card__note { margin-top: 8px; }
.os-content-page .contact-form { min-width: 0; padding: 20px; }
.os-content-page .contact-form__heading { margin-bottom: 20px; }
.os-content-page .contact-form__group { margin-bottom: 18px; }
.os-content-page .contact-form__group > label { display: block; margin-bottom: 8px; font-size: 13px; font-weight: 600; }
.os-content-page .contact-form__group.required > label::after { content: ' *'; color: #ef4444; }
.os-content-page .contact-form__control { display: flex; align-items: center; gap: 10px; border: 1px solid #e2e8f0; border-radius: 8px; padding: 0 12px; }
.os-content-page .contact-form__control svg { color: #94a3b8; width: 18px; height: 18px; }
.os-content-page .contact-form__control input { width: 100%; min-width: 0; min-height: 46px; border: 0; outline: 0; padding: 10px 0; background: transparent; color: #0f172a; font: inherit; }
.os-content-page .contact-form textarea, .os-content-page .contact-form .form-control { display: block; width: 100%; min-height: 44px; padding: 12px; border: 1px solid #e2e8f0; border-radius: 8px; background: white; color: #0f172a; font: inherit; resize: vertical; }
.os-content-page .contact-form__control:focus-within { border-color: #f97316; outline: 2px solid #fed7aa; }
.os-content-page .contact-form textarea:focus, .os-content-page .contact-form .form-control:focus { border-color: #f97316; outline: 2px solid #fed7aa; }
.os-content-page .contact-form__control:has([aria-invalid=true]), .os-content-page .contact-form textarea[aria-invalid=true] { border-color: #ef4444; }
.os-content-page .contact-form__error, .os-content-page .contact-form .text-danger { margin-top: 6px; font-size: 12px; color: #dc2626; }
.os-content-page .contact-form__submit, .os-content-page .os-content-button, .os-content-page .success-card__button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; padding: 12px 20px; border: 1px solid #f97316; border-radius: 8px; background: #f97316; color: white; font-size: 13px; font-weight: 700; line-height: 1.5; text-align: center; cursor: pointer; }
.os-content-page .contact-form__submit { width: 100%; margin-top: 12px; }
.os-content-page .contact-form__submit:hover, .os-content-page .os-content-button:hover, .os-content-page .success-card__button:hover { background: #ea580c; border-color: #ea580c; }
.os-content-page .contact-locations { margin-top: 28px; }
.os-content-page .contact-locations__heading { margin-bottom: 16px; }
.os-content-page .contact-locations__grid { display: grid; gap: 12px; }
.os-content-page .contact-location-card { min-width: 0; overflow: hidden; }
.os-content-page .contact-location-card > img { width: 100%; max-height: 200px; object-fit: cover; }
.os-content-page .contact-location-card__body { padding: 16px; overflow-wrap: anywhere; }
.os-content-page .contact-location-card__body p { display: flex; align-items: flex-start; gap: 6px; margin-top: 8px; font-size: 12px; color: #64748b; }
.os-content-page.os-status-page, .os-content-page.success-page { padding-top: 28px; }
.os-content-page .os-status-card, .os-content-page .success-card { max-width: 680px; margin: 0 auto; padding: 32px 24px; border: 1px solid #f1f5f9; border-radius: 12px; background: white; box-shadow: 0 2px 12px #0f172a0f; text-align: center; }
.os-content-page .os-status-card__icon, .os-content-page .success-card__icon { display: grid; place-items: center; width: 80px; height: 80px; margin: 0 auto 20px; border-radius: 50%; background: #fff7ed; color: #f97316; }
.os-content-page .os-status-card__icon svg, .os-content-page .success-card__icon svg { width: 36px; height: 36px; }
.os-content-page .success-card__icon { background: #f0fdf4; color: #16a34a; }
.os-content-page .os-status-card__eyebrow, .os-content-page .success-card__eyebrow { display: block; margin-bottom: 8px; font-size: 12px; font-weight: 600; color: #64748b; overflow-wrap: anywhere; }
.os-content-page .os-status-card__message, .os-content-page .success-card__message { margin-top: 14px; color: #64748b; font-size: 14px; line-height: 1.85; overflow-wrap: anywhere; }
.os-content-page .success-card__message p + p { margin-top: 10px; }
.os-content-page .os-status-card__actions, .os-content-page .success-card__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 24px; }
.os-content-page .success-card__button--secondary { background: #fff7ed; color: #ea580c; border-color: #fed7aa; }
.os-content-page .success-card__button--secondary:hover { background: #ffedd5; }
.os-content-page .success-card__button--plain { background: white; color: #475569; border-color: #e2e8f0; }
.os-content-page .success-card__button--plain:hover { background: #f8fafc; border-color: #cbd5e1; }
.os-content-page .success-bank-transfer { margin-top: 24px; padding: 16px; border: 1px solid #fed7aa; border-radius: 8px; background: #fff7ed; text-align: left; overflow-wrap: anywhere; }
.os-content-page .success-bank-transfer > span, .os-content-page .success-bank-transfer > strong { display: block; }
.os-content-page .success-bank-transfer > span { font-size: 11px; color: #9a3412; }
.os-content-page .success-bank-transfer > strong { margin: 4px 0 12px; font-size: 15px; }
.os-content-page .success-bank-transfer__account { padding: 14px; border: 1px solid #ffedd5; border-radius: 8px; background: white; }
.os-content-page .success-bank-transfer__account + .success-bank-transfer__account { margin-top: 10px; }
.os-content-page .success-bank-transfer__account > span, .os-content-page .success-bank-transfer__account > strong, .os-content-page .success-bank-transfer__account > small { display: block; }
.os-content-page .success-bank-transfer__account > strong { margin-top: 4px; font-size: 14px; }
.os-content-page .success-bank-transfer__account > small { margin-top: 6px; color: #64748b; font-size: 12px; }
.os-content-page .success-bank-transfer__instruction, .os-content-page .success-bank-transfer__account > p { margin: 10px 0; font-size: 13px; line-height: 1.8; }
.os-content-page .success-seller-qris__image { display: block; max-width: 100%; width: 260px; height: auto; margin: 0 auto 16px; }
.os-content-page .success-seller-qris .success-bank-transfer__account { text-align: center; }
.os-content-page .success-seller-qris .success-card__button { margin-top: 16px; }
.os-content-page .os-status-card__badge { display: inline-block; margin-top: 20px; padding: 6px 12px; border: 1px solid #fed7aa; border-radius: 999px; background: #fff7ed; color: #9a3412; font-size: 11px; font-weight: 600; }
.os-content-page .storefront-widgets { margin-top: 24px; }
.os-inactive-store { margin: 0; min-height: 100vh; display: grid; place-items: center; background: #f7f9fc; font-family: 'Plus Jakarta Sans', sans-serif; }
.os-inactive-store > main { width: 100%; padding-block: 32px; }
@media (min-width: 768px) {
  .os-content-page .contact-layout { grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); }
  .os-content-page .contact-locations__grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .os-content-page .information-card { padding: 28px; }
  .os-content-page .success-card, .os-content-page .os-status-card { padding: 40px 32px; }
}
@media (max-width: 480px) {
  .os-content-page .success-card__actions { flex-direction: column; }
  .os-content-page .os-status-card__actions > a { width: 100%; }
  .os-content-page .contact-form, .os-content-page .information-card { padding: 16px; }
  .os-content-page .success-card, .os-content-page .os-status-card { padding: 28px 18px; }
}
@media (max-width: 389px) {
  .os-content-page { padding-inline: 12px; }
  .os-content-page h1 { font-size: 21px; }
}
