/* Scoped product explainer: shared brand styles remain unchanged. */
.oil-title-phrase {white-space:nowrap}
.oil-guide {scroll-margin-top:110px;padding:88px 0 28px}
.oil-guide-heading h2 {font-size:clamp(30px,3.3vw,48px);line-height:1.4;margin:16px 0 20px;color:var(--ink)}
.oil-guide-heading p {font-size:16px;color:var(--muted);margin:0;max-width:960px}
.oil-guide-chart {display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);margin-top:38px;min-height:770px;align-items:stretch}
.oil-guide-visual {position:relative;min-width:0}
.oil-barrel-svg {display:block;position:absolute;width:100%;height:100%;inset:0;overflow:visible}
.oil-layer {transition:opacity .22s ease}
.oil-leader {fill:none;stroke:#a9b4b5;stroke-width:1;vector-effect:non-scaling-stroke;transition:stroke .22s ease}
.oil-leader-dot {fill:var(--oil-color)}
.oil-guide-chart[data-active] .oil-layer:not(.is-active) {opacity:.32}
.oil-layer.is-active .oil-leader {stroke:#a28045;stroke-width:1.8}
.oil-layer.is-active .oil-leader-dot {fill:#a28045}
.oil-product-list {display:grid;grid-template-rows:repeat(7,1fr)}
.oil-product {appearance:none;display:grid;grid-template-columns:80px minmax(0,1fr);gap:18px;align-items:center;position:relative;padding:16px 20px;border:0;border-radius:0;background:transparent;text-align:left;color:var(--ink);font:inherit;cursor:pointer;transition:background .22s ease}
.oil-product:hover,.oil-product.is-active {background:#a18a620b}
.oil-product:focus-visible {outline:2px solid #a28045;outline-offset:-2px}
.oil-percentage {font-family:'Cormorant Garamond',Georgia,serif;font-size:48px;font-weight:500;line-height:1;color:#997841;white-space:nowrap;align-self:center;font-variant-numeric:tabular-nums}
.oil-percentage>span {font-family:'Source Sans 3',sans-serif;font-size:20px;margin-left:2px}
.oil-product-copy {display:block}
.oil-product-name {display:block;font-family:'Noto Sans SC',sans-serif;font-size:20px;font-weight:600;line-height:1.4}
.oil-product-english {display:block;font-size:11px;line-height:1.5;color:#8c7857;letter-spacing:1.1px;margin-top:3px;text-transform:uppercase}
.oil-product-description {display:block;font-size:14px;line-height:1.7;color:var(--muted);margin-top:7px}
html[lang="en"] .oil-product-english {display:none}
html[lang="en"] .oil-product-name {font-family:'Source Sans 3',sans-serif}
.oil-guide-footnote {display:flex;justify-content:space-between;gap:20px;margin-top:24px;font-size:11px;line-height:1.7;color:var(--muted)}
.oil-guide-footnote p {margin:0;font-size:inherit}
.oil-guide-footnote a {color:#8c7857;flex-shrink:0;text-decoration:underline;text-underline-offset:4px}
.oil-guide-next {display:flex;justify-content:space-between;align-items:center;gap:24px;padding-top:35px;margin-top:30px}
.oil-guide-next p {font-size:19px;margin:0;color:var(--ink)}
.oil-guide-next a {font-size:13px;color:#8c7857;white-space:nowrap}
.oil-guide-next a>span:last-child {margin-left:16px}
@media(min-width:1600px){.oil-guide-chart{grid-template-columns:1fr 1.2fr;min-height:850px}.oil-product-name{font-size:24px}.oil-product-description{font-size:16px}.oil-product{grid-template-columns:90px 1fr;gap:22px}.oil-percentage{font-size:54px}}
@media(max-width:850px){.oil-guide-chart{grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr)}.oil-product{grid-template-columns:58px 1fr;gap:10px;padding:15px 10px}.oil-product-name{font-size:18px}.oil-percentage{font-size:38px}.oil-product-description{font-size:13px}}
@media(max-width:600px){.oil-guide{padding-top:50px}.oil-guide-heading h2{font-size:29px}.oil-guide-heading p{font-size:14px}.oil-guide-chart{display:block;margin-top:18px;min-height:0}.oil-guide-visual{height:380px;width:100%;max-width:350px;margin:0 auto 20px;overflow:hidden}.oil-barrel-svg{width:100%;transform:translateX(10%)}.oil-leader,.oil-leader-dot{display:none}.oil-product-list{display:block}.oil-product{width:100%;grid-template-columns:65px 1fr;gap:14px;padding:20px 10px 20px 18px;margin:2px 0}.oil-product::before{content:'';position:absolute;left:0;top:23px;bottom:23px;width:3px;background:var(--oil-color)}.oil-product-name{font-size:19px}.oil-product-description{font-size:14px}.oil-percentage{font-size:41px}.oil-guide-footnote,.oil-guide-next{display:block}.oil-guide-footnote a{display:inline-block;margin-top:10px}.oil-guide-next{padding-top:10px}.oil-guide-next p{font-size:17px;margin-bottom:14px}}
@media(prefers-reduced-motion:reduce){.oil-layer,.oil-leader,.oil-product{transition:none}}
