/* ==========================================================================
   OmegAmino replica — P8 CONTENT PAGES
   Every value below is MEASURED from the source harvest:
     • each page's own `mfn-dynamic-inline-css` block  (source-cdp/dom/*.html)
     • uploads/betheme/css/be_classes.css              (hero heights)
     • source-cdp/maps/*.json                          (section rects + colours)
     • _shots/{desktop-1440,tablet-820,mobile-390}/*   (reference tiles)
   Breakpoints match BeTheme's: 1440 / 959 / 767.
   Namespaced `.oma-pg*` so nothing here can collide with P1/P3/P4/P6/P7 CSS.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Shared section rhythm.
   Most content sections are section.mcb-section-h3a9kb2:
     150px 0  →  120px <=1440  →  100px <=959  →  80px <=767
   -------------------------------------------------------------------------- */
.oma-pg-sec { padding: 150px 0; background: #fff; }
@media (max-width:1440px) { .oma-pg-sec { padding: 120px 0; } }
@media (max-width:959px)  { .oma-pg-sec { padding: 100px 0; } }
@media (max-width:767px)  { .oma-pg-sec { padding:  80px 0; } }

/* --------------------------------------------------------------------------
   Research-chemical disclaimer band
   measured: bg #262626, padding 70px 0, copy rgba(255,255,255,.6) 18px (16 <=767)
   -------------------------------------------------------------------------- */
.oma-disclaimer-band { padding: 70px 0; background: var(--oma-262626, #262626); }
.oma-disclaimer-band__text {
  margin: 0;
  color: rgba(255,255,255,.6);
  font-family: var(--oma-font);
  font-size: 18px;
  line-height: 1.3;
  letter-spacing: var(--oma-ls-body, -.01em);
}
@media (max-width:767px) { .oma-disclaimer-band__text { font-size: 16px; } }

/* ==========================================================================
   PROSE — the legal docs + the crypto explainer.
   Scoped under `.oma-pg` (the body class this phase adds) so it never touches
   P1's generic .oma-prose in oma-chrome.css.
   measured: body #333333, links #1C6BBA, h5 headings, 16px <=767
   ========================================================================== */
.oma-pg .oma-prose { font-family: var(--oma-font); color: #333; font-size: 18px; line-height: 1.4; }
.oma-pg .oma-prose p { margin: 0 0 14px; }
.oma-pg .oma-prose a { color: var(--oma-blue, #1c6bba); text-decoration: none; }
.oma-pg .oma-prose a:hover { color: var(--oma-blue, #1c6bba); text-decoration: underline; }
.oma-pg .oma-prose h2,
.oma-pg .oma-prose h3,
.oma-pg .oma-prose h4,
.oma-pg .oma-prose h5 { margin: 26px 0 10px; color: #333; font-weight: 600; letter-spacing: var(--oma-ls-head, -.02em); }
.oma-pg .oma-prose h2 { font-size: 30px; line-height: 38px; }
.oma-pg .oma-prose h3 { font-size: 26px; line-height: 34px; }
.oma-pg .oma-prose h4 { font-size: 24px; line-height: 32px; }
.oma-pg .oma-prose h5 { font-size: 24px; line-height: 34px; font-weight: 500; }
.oma-pg .oma-prose ul,
.oma-pg .oma-prose ol { margin: 0 0 14px; padding-left: 22px; }
.oma-pg .oma-prose ul li { list-style: disc; }
.oma-pg .oma-prose ol li { list-style: decimal; }
.oma-pg .oma-prose li { margin: 0 0 6px; }
.oma-pg .oma-prose strong { font-weight: 600; }
.oma-pg .oma-prose img { max-width: 100%; height: auto; }
@media (max-width:767px) { .oma-pg .oma-prose { font-size: 16px; } }

/* ==========================================================================
   LEGAL DOCS  — /terms-and-conditions/ /privacy-policy/ /legal-compliance/
   measured: section.mcb-section-fxk07acz padding 120px 0 (100 <=959, 80 <=767)
             title 60/70/600 (50/60 <=1440 · 45/55 <=959 · 35/44 <=767)
             body starts 47px below the title (30 <=959)
   The header is the SOLID #1C6BBA in-flow variant on these pages, so the doc
   column has to clear it — handled by the P1 chrome, not here.
   ========================================================================== */
.oma-pg-sec--doc { padding: 120px 0; }
@media (max-width:959px) { .oma-pg-sec--doc { padding: 100px 0; } }
@media (max-width:767px) { .oma-pg-sec--doc { padding:  80px 0; } }

.oma-doc__title {
  margin: 0;
  color: #000;
  font-family: var(--oma-font);
  font-size: 60px;
  line-height: 70px;
  font-weight: 600;
  letter-spacing: var(--oma-ls-head, -.02em);
}
.oma-doc__body { margin-top: 47px; }
@media (max-width:1440px) { .oma-doc__title { font-size: 50px; line-height: 60px; } }
@media (max-width:959px)  { .oma-doc__title { font-size: 45px; line-height: 55px; } .oma-doc__body { margin-top: 30px; } }
@media (max-width:767px)  { .oma-doc__title { font-size: 35px; line-height: 44px; } }

/* When the page carries a photo hero (the net-new crypto explainer) the H1 is
   already painted there, so the column just starts at the top. */
.oma-pg-sec--doc-hero .oma-doc__body { margin-top: 0; }

/* ==========================================================================
   FAQ  — /faq/
   ========================================================================== */
.oma-faqpg {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0;
}
/* BeTheme column classes on the two wraps:
     left  `two-fifth  laptop-one-second`  -> 40%, 50% at <=1440 (laptop)
     right `two-fifth  laptop-two-fifth`   -> 40% at every desktop width
   Pixel-checked against _shots/desktop-1440/faq.png: the accordion box runs
   65 → 720 (655px) and the bordered cards 851 → 1374 (523px) inside the 1310px
   container = 50% / 40% with space-between. */
.oma-faqpg > .oma-faq-col   { width: 40%; }
.oma-faqpg > .oma-faq-cards { width: 40%; }
@media (max-width:1440px) { .oma-faqpg > .oma-faq-col { width: 50%; } }

@media (max-width:959px) {
  .oma-faqpg { display: block; }
  .oma-faqpg > .oma-faq-col,
  .oma-faqpg > .oma-faq-cards { width: 100%; }
  .oma-faqpg > .oma-faq-col { margin-bottom: 70px; }
}

/* heading — h4.heading, margin-bottom 40px */
.oma-faq__heading {
  margin: 0 0 40px;
  color: #000;
  font-family: var(--oma-font);
  font-size: var(--oma-h4, 40px);
  line-height: var(--oma-h4-lh, 50px);
  font-weight: 600;
  letter-spacing: var(--oma-ls-head, -.02em);
}
@media (max-width:767px) { .oma-faq__heading { font-size: 30px; line-height: 38px; margin-bottom: 26px; } }

/* accordion rows — .question bg #F9F9F9 radius 10px; .active bg #F0F8FF */
.oma-acc { margin: 0; }
.oma-acc__item {
  margin: 0 0 8px;
  border-radius: 10px;
  background: var(--oma-tint-f9f9f9, #f9f9f9);
  overflow: hidden;
  transition: background .2s;
}
.oma-acc__item.is-open { background: var(--oma-tint-f0f8ff, #f0f8ff); }
.oma-acc__q {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  width: 100%;
  margin: 0;
  padding: 18px 22px;
  border: 0;
  background: none;
  color: #000;
  font-family: var(--oma-font);
  font-size: 20px;
  line-height: 1.35;
  font-weight: 500;
  text-align: left;
  letter-spacing: var(--oma-ls-body, -.01em);
  cursor: pointer;
}
.oma-acc__q::after {
  content: "";
  flex: 0 0 auto;
  width: 14px; height: 14px;
  margin-left: auto;
  margin-top: 6px;
  background:
    linear-gradient(#000,#000) center/14px 1.6px no-repeat,
    linear-gradient(#000,#000) center/1.6px 14px no-repeat;
  transition: transform .2s, background-size .2s;
}
.oma-acc__item.is-open .oma-acc__q::after {
  background:
    linear-gradient(#000,#000) center/14px 1.6px no-repeat;
}
.oma-acc__a {
  display: none;
  padding: 0 22px 20px;
  color: rgba(0,0,0,.65);
  font-family: var(--oma-font);
  font-size: 18px;
  line-height: 1.45;
}
.oma-acc__item.is-open .oma-acc__a { display: block; }
@media (max-width:959px) {
  .oma-acc__q { font-size: 19px; }
  .oma-acc__a { font-size: 16px; }
}

/* right-hand cards — padding 50px, radius 25px, 1px rgba(0,0,0,.3) */
.oma-faq-card {
  padding: 50px;
  border: 1px solid rgba(0,0,0,.3);
  border-radius: 25px;
}
.oma-faq-card + .oma-faq-card { margin-top: 45px; }
.oma-faq-card__q {
  margin: 0 0 14px;
  color: #000;
  font-family: var(--oma-font);
  font-size: 24px;
  line-height: 30px;
  font-weight: 600;
  letter-spacing: var(--oma-ls-head, -.02em);
}
.oma-faq-card__a { margin: 0; color: rgba(0,0,0,.65); font-family: var(--oma-font); font-size: 18px; line-height: 1.45; }
.oma-faq-card__a p { margin: 0; }
@media (max-width:959px) { .oma-faq-card + .oma-faq-card { margin-top: 30px; } }
@media (max-width:767px) {
  .oma-faq-card { padding: 27px; }
  .oma-faq-card__q { font-size: 20px; line-height: 27px; }
  .oma-faq-card__a { font-size: 16px; }
}

/* ==========================================================================
   CONTACT  — /contact/
   ========================================================================== */
.oma-pg-sec--contact { background: #f8f8f8; }

.oma-contact {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
}
/* BeTheme column classes:
     left  `three-fifth laptop-one-second` -> 60%, 50% at <=1440
     right `two-fifth   laptop-one-second` -> 40%, 50% at <=1440
   plus a 75px (50px <=1440) margin-right on the LEFT card's inner box, folded
   into the width here so `space-between` reproduces the measured gap.
   Pixel-checked at 1440: form card 66 → 668 (602px), blue card 721 → 1375
   (654px) inside the 1310px container. */
.oma-contact__form-card {
  box-sizing: border-box;
  width: calc(60% - 75px);
  padding: 50px 65px 70px;
  border-radius: 25px;
  background: #f1f1f1;
}
.oma-contact__info-card {
  box-sizing: border-box;
  width: 40%;
  padding: 70px;
  border-radius: 25px;
  background-color: var(--oma-blue, #1c6bba);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 70%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;   /* measured: align-content:space-between */
  gap: 24px;
}
@media (max-width:1440px) {
  .oma-contact__form-card { width: calc(50% - 50px); padding: 30px 40px 50px; }
  .oma-contact__info-card { width: 50%; padding: 50px; }
}
@media (max-width:959px) {
  .oma-contact { display: block; }
  .oma-contact__form-card,
  .oma-contact__info-card { width: 100%; }
  .oma-contact__form-card { margin-bottom: 40px; }
  .oma-contact__info-card { background-size: 40%; gap: 30px; }
}
@media (max-width:767px) {
  .oma-contact__form-card { margin-bottom: 30px; padding: 25px 30px 40px; }
  .oma-contact__info-card { padding: 35px; background-size: 65%; }
}

.oma-contact__h {
  margin: 0 0 20px;
  color: #000;
  font-family: var(--oma-font);
  font-size: 50px;
  line-height: 60px;
  font-weight: 600;
  letter-spacing: var(--oma-ls-head, -.02em);
}
.oma-contact__sub { margin: 0; color: rgba(0,0,0,.6); font-family: var(--oma-font); font-size: 18px; line-height: 1.3; }
@media (max-width:767px) {
  .oma-contact__h { font-size: 37px; line-height: 47px; margin-bottom: 10px; }
  .oma-contact__sub { font-size: 16px; }
}

.oma-contact__notice {
  margin: 22px 0 0;
  padding: 12px 16px;
  border-radius: 9px;
  font-family: var(--oma-font);
  font-size: 16px;
  line-height: 1.4;
}
.oma-contact__notice--ok  { background: var(--oma-tint-f0f8ff, #f0f8ff); border: 1px solid var(--oma-blue, #1c6bba); color: #16324f; }
.oma-contact__notice--err { background: #fdeded; border: 1px solid #d33; color: #8a1f1f; }

.oma-contact__form { margin-top: 28px; }
.oma-contact__row { margin: 0 0 14px; }
.oma-contact__row--split { display: flex; gap: 14px; }
.oma-contact__row--split > input { flex: 1 1 0; min-width: 0; }

.oma-contact__form input[type="text"],
.oma-contact__form input[type="email"],
.oma-contact__form input[type="tel"],
.oma-contact__form textarea {
  box-sizing: border-box;
  width: 100%;
  padding: 13px 18px;
  border: 1px solid #fff;           /* measured */
  border-radius: 8px;               /* measured */
  background: #fff;
  color: #000;
  font-family: var(--oma-font);
  font-size: 16px;
  line-height: 1.3;
  box-shadow: none;
  outline: none;
}
.oma-contact__form textarea { min-height: 200px; resize: vertical; }
.oma-contact__form input::placeholder,
.oma-contact__form textarea::placeholder { color: rgba(0,0,0,.45); }
.oma-contact__form input:focus,
.oma-contact__form textarea:focus { border-color: var(--oma-blue, #1c6bba); }

@media (max-width:600px) { .oma-contact__row--split { flex-direction: column; } }

/* submit — cyan pill with the dark-blue chip (measured .btn-submit) */
.oma-contact__submit { position: relative; display: inline-block; margin-top: 28px; }
.oma-contact__submit input[type="submit"] {
  position: relative;
  z-index: 1;
  padding: 14px 58px 14px 22px;
  border: 0;
  border-radius: var(--oma-r-9, 9px);
  background: var(--oma-cyan, #84f2fe);
  color: #000;
  font-family: var(--oma-font);
  font-size: 18px;
  line-height: 1.2;
  cursor: pointer;
  transition: background .2s;
}
.oma-contact__submit:hover input[type="submit"] { background: var(--oma-cyan-hover, #76e4f3); }
.oma-contact__chip {
  position: absolute;
  z-index: 2;
  top: 50%;
  right: 6px;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 39px; height: 39px;
  border-radius: 7px;
  background: var(--oma-blue-deep, #254f79);
  pointer-events: none;
}
.oma-contact__chip svg { width: 15px; height: 15px; display: block; }
.oma-contact__chip svg path { stroke: #fff; }

/* honeypot — off-screen, never announced */
.oma-hp { position: absolute !important; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; }

/* icon rows in the blue card */
.oma-icobox {
  display: flex;
  align-items: flex-start;
  gap: 30px;
  text-decoration: none;
  color: #fff;
}
.oma-icobox__icon {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 73px; height: 73px;
  border: 1px solid rgba(255,255,255,.3);
  border-radius: 100px;
}
.oma-icobox__icon img { max-width: 30px; height: auto; display: block; }
.oma-icobox__body { display: block; }
.oma-icobox__title {
  display: block;
  color: #fff;
  font-family: var(--oma-font);
  font-size: 34px;
  line-height: 44px;
  font-weight: 500;
  letter-spacing: var(--oma-ls-head, -.02em);
}
.oma-icobox__desc { display: block; color: #fff; font-family: var(--oma-font); font-size: 18px; line-height: 1.3; }
@media (max-width:767px) {
  .oma-icobox { gap: 18px; }
  .oma-icobox__icon { width: 55px; height: 55px; }
  .oma-icobox__icon img { max-width: 23px; }
  .oma-icobox__title { font-size: 27px; line-height: 34px; }
  .oma-icobox__desc { font-size: 16px; }
}

/* ==========================================================================
   VIDEOS  — /videos/
   measured: two 1/2 columns, 17px inner gutter, radius 30px (20 <=1440)
   ========================================================================== */
.oma-videos { display: flex; align-items: stretch; justify-content: space-between; }
.oma-videos__item {
  width: calc(50% - 17px);          /* 17px inner gutter each side, measured */
  border-radius: 30px;
  overflow: hidden;
  background: #000;
  line-height: 0;
}
.oma-videos__item:only-child  { width: 100%; }
.oma-videos__player { display: block; width: 100%; height: auto; }
@media (max-width:1440px) { .oma-videos__item { border-radius: 20px; } }
@media (max-width:959px) {
  .oma-videos { display: block; }
  .oma-videos__item { width: 100%; margin: 0 0 30px; }
  .oma-videos__item:last-child { margin-bottom: 0; }
}
@media (max-width:767px) { .oma-videos__item { margin-bottom: 20px; } }

/* ==========================================================================
   RESEARCH SUPPLIES  — /research-supplies/
   measured: bg #FFFFFF, padding 130px 0 (105 <=1440), 4 columns,
             card title 26/500 (24 <=1440, 18 <=767)
   ========================================================================== */
.oma-pg-sec--supplies { padding: 130px 0; background: #fff; }
@media (max-width:1440px) { .oma-pg-sec--supplies { padding: 105px 0; } }
@media (max-width:959px)  { .oma-pg-sec--supplies { padding: 100px 0; } }
@media (max-width:767px)  { .oma-pg-sec--supplies { padding:  80px 0; } }

.oma-supplies-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 24px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.oma-supplies-grid > li { float: none; width: auto; margin: 0; }
@media (max-width:959px) { .oma-supplies-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width:479px) { .oma-supplies-grid { grid-template-columns: 1fr; } }

/* ==========================================================================
   SHIPMENT TRACKING  — /ts-shipment-tracking/
   measured: centred card ~800px, tab strip with a blue active underline,
             panel bg #F8F8F8, dark submit button
   ========================================================================== */
.oma-pg-sec--track { padding: 0 0 90px; }
.oma-track {
  max-width: 800px;
  margin: 0 auto;
  border: 1px solid rgba(0,0,0,.08);
  border-top: 0;
  font-family: var(--oma-font);
}
.oma-track__tabs { display: flex; background: #f8f8f8; }
.oma-track__tab {
  flex: 1 1 0;
  padding: 18px 10px;
  border-bottom: 2px solid transparent;
  color: rgba(0,0,0,.6);
  font-size: 18px;
  text-align: center;
}
.oma-track__tab.is-active { border-bottom-color: var(--oma-blue, #1c6bba); color: var(--oma-blue, #1c6bba); }
.oma-track__panel { padding: 22px; background: #f8f8f8; }
.oma-track__lead { margin: 0 0 10px; color: #000; font-size: 16px; line-height: 1.5; }
.oma-track__lead a { color: var(--oma-blue, #1c6bba); }
.oma-track__notice {
  margin: 0 0 16px;
  padding: 12px 16px;
  border: 1px solid #d33;
  border-radius: 9px;
  background: #fdeded;
  color: #8a1f1f;
  font-size: 16px;
}
.oma-track__field { margin: 0 0 14px; }
.oma-track__field label { display: block; margin: 0 0 6px; color: #000; font-size: 16px; font-weight: 500; }
.oma-track__field input {
  box-sizing: border-box;
  width: 100%;
  max-width: 380px;
  padding: 11px 14px;
  border: 1px solid rgba(0,0,0,.2);
  border-radius: var(--oma-r-9, 9px);
  background: #fff;
  font-family: var(--oma-font);
  font-size: 16px;
  outline: none;
}
.oma-track__field input:focus { border-color: var(--oma-blue, #1c6bba); }
.oma-track__actions { margin: 18px 0 0; }
.oma-track__btn {
  padding: 11px 20px;
  border: 0;
  border-radius: 6px;
  background: #4a5568;
  color: #fff;
  font-family: var(--oma-font);
  font-size: 17px;
  cursor: pointer;
}
.oma-track__btn:hover { background: #2d3748; }
@media (max-width:767px) { .oma-track { max-width: 100%; } }