/* One look for the information pages: privacy, terms, disclaimer, refund, shipping, corporate, grievance, contact, careers.
   Loaded by the shop header after the page's own styles, so these rules are the final say.
   Only elements with these class names are touched; nothing else on the site is affected. */

/* ---- title band ---- */
.doc-header, .contact-header, .career-header, .corporate-header, .grievance-header {
  padding: 44px 0 30px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--primary, #E97C43) 9%, #fff), #fff);
  border-bottom: 1px solid #F1E7DF;
  text-align: left;
}
.doc-main-title, .contact-header h1, .career-header h1, .corporate-header h1, .grievance-header h1 {
  margin: 8px 0 8px; font-size: clamp(1.8rem, 3.4vw, 2.6rem); font-weight: 800; letter-spacing: -.5px; color: #111827; line-height: 1.15;
}
.doc-subtitle, .contact-header p, .career-header p, .corporate-header p, .grievance-header p { max-width: 680px; margin: 0 0 12px; color: #6B7280; font-size: 1.02rem; line-height: 1.6; }
.doc-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: .86rem; color: #6B7280; }
.doc-breadcrumb a { color: #6B7280; text-decoration: none; }
.doc-breadcrumb a:hover { color: var(--primary-dark, #C45A2A); }

/* ---- cards ---- */
.sidebar-card, .quick-contact-card, .doc-main-content, .contact-card, .info-card, .grievance-card, .corporate-card {
  background: #fff; border: 1px solid #EEF0F3; border-radius: 16px; box-shadow: none;
}
.doc-content-section { padding: 28px 0 56px; background: #FAFAFB; }
.doc-content-container { display: grid; grid-template-columns: 290px minmax(0, 1fr); gap: 24px; align-items: start; }
.doc-sidebar { position: sticky; top: 120px; display: grid; gap: 16px; max-height: calc(100vh - 140px); overflow-y: auto; }
.doc-main-content { padding: 30px 34px; }

/* ---- contents list ---- */
.sidebar-title { margin: 0 0 12px; font-size: .78rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #6B7280; }
.sidebar-nav { margin: 0; padding: 0; list-style: none; }
.sidebar-nav-link { display: block; padding: 7px 10px; border-left: 2px solid transparent; border-radius: 0 8px 8px 0; color: #4B5563; font-size: .88rem; line-height: 1.4; text-decoration: none; }
.sidebar-nav-link i { display: none; }
.sidebar-nav-link:hover { background: #F9FAFB; color: #111827; }
.sidebar-nav-link.active { border-left-color: var(--primary, #E97C43); background: color-mix(in srgb, var(--primary, #E97C43) 8%, #fff); color: var(--primary-dark, #C45A2A); font-weight: 700; }

/* ---- reading text ---- */
.doc-main-content { color: #374151; font-size: 1rem; line-height: 1.8; }
.doc-main-content h2 { margin: 2.2rem 0 .7rem; padding-top: 1.4rem; border-top: 1px solid #F1F2F4; font-size: 1.35rem; font-weight: 800; color: #111827; scroll-margin-top: 130px; }
.doc-main-content h2:first-of-type { margin-top: 1.4rem; }
.doc-main-content h3 { margin: 1.4rem 0 .5rem; font-size: 1.08rem; font-weight: 700; color: #111827; }
.doc-main-content p, .doc-main-content li { margin-bottom: .7rem; }
.doc-main-content a { color: var(--primary-dark, #C45A2A); }
.doc-main-content table { width: 100%; margin: 1rem 0; border-collapse: collapse; font-size: .92rem; }
.doc-main-content th { background: #F9FAFB; text-align: left; }
.doc-main-content th, .doc-main-content td { padding: 10px 12px; border: 1px solid #EEF0F3; vertical-align: top; }

@media (max-width: 991px) {
  .doc-content-container { grid-template-columns: 1fr; }
  .doc-sidebar { position: static; max-height: none; }
  .doc-main-content { padding: 22px 18px; }
  .doc-header, .contact-header, .career-header, .corporate-header, .grievance-header { padding: 28px 0 22px; }
}
