/* 301 BIOTEC — product page: layout glue ONLY.
   Every visual rule comes from the locked homepage via site.css. The rules below exist only where a
   homepage pattern is reused in a slightly different arrangement; each uses homepage values. */

/* text entry timing: a section's content shows only once it has contrast on the live background
   (the background itself is the unchanged homepage system; --fade is set by chrome.js) */
.pp [data-bg]>*{opacity:var(--fade,1)}

/* Section 07 photo grid with three photographs instead of three + video: one row, same tiles */
.op-media.n3{grid-template-rows:clamp(300px,32vw,540px)}
.op-media.n3 .m1{grid-row:1}
@media (max-width:900px){ .op-media.n3{grid-template-rows:auto} }

/* the current model on the hero capacity rule (homepage brass accent) */
.dim .tk.cur{background:var(--brass-hi)}
.dim .tk.cur b{color:var(--brass-hi);font-weight:600}


/* AA: index numbers and small labels take their tone from the band behind them.
   Dark and forest bands use the light brass; the warm band uses a 6%-darker step of --brass-lo
   (4.56:1). Nothing else changes — same type, size, position, spacing and numbering. */
.k i,.ind-list .no,.pg-list .no,.area .n,.in-lbl,.od-lbl,.fq-q .n,.st-op,.sy .n,.ls-el .n{color:var(--brass-hi)}
.ind .k i,.ind .no,.ind .n,.ind .in-lbl,.ind .od-lbl,.ind .fq-q .n,.ind .st-op,
section[data-bg="#F2EEE5"] .k i,section[data-bg="#F2EEE5"] .no,section[data-bg="#F2EEE5"] .n,
section[data-bg="#F2EEE5"] .in-lbl,section[data-bg="#F2EEE5"] .od-lbl,
section[data-bg="#F2EEE5"] .fq-q .n,section[data-bg="#F2EEE5"] .st-op{color:#846739}