.resource-hero { padding: clamp(3rem,6vw,6rem) 0 clamp(6rem,9vw,9rem); color: #fff; background: radial-gradient(circle at 8% 10%,rgba(72,214,166,.24),transparent 30rem),linear-gradient(135deg,var(--nc-green-950),#075e53); }
.resource-hero__grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(2rem,6vw,6rem); align-items: center; }
.resource-hero .eyebrow { color: #a9e8cf; }
.resource-hero h1 { max-width: 12ch; color: #fff; font-size: clamp(3rem,5.7vw,6rem); line-height: .96; letter-spacing: -.07em; }
.resource-hero p { max-width: 55ch; color: rgba(255,255,255,.72); font-size: 1.08rem; }
.resource-hero__tags { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: 1.5rem; }
.resource-hero__tags span { display: inline-flex; align-items: center; gap: .45rem; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; padding: .48rem .7rem; background: rgba(255,255,255,.06); font-size: .72rem; font-weight: 800; }
.resource-feature { position: relative; min-height: 490px; overflow: hidden; border: 1px solid rgba(255,255,255,.18); border-radius: var(--nc-radius-lg); color: #fff; box-shadow: 0 30px 70px rgba(0,31,27,.28); text-decoration: none; }
.resource-feature::after { position: absolute; inset: 0; content: ""; background: linear-gradient(180deg,transparent 25%,rgba(3,42,36,.94) 100%); }
.resource-feature img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.resource-feature:hover img { transform: scale(1.045); }
.resource-feature > div { position: absolute; z-index: 1; right: 0; bottom: 0; left: 0; padding: clamp(1.4rem,4vw,2.5rem); }
.resource-feature small { color: #a9e8cf; font-weight: 800; text-transform: uppercase; }
.resource-feature h2 { max-width: 18ch; margin: .5rem 0 1rem; color: #fff; font-size: clamp(1.8rem,3vw,3rem); }
.resource-feature span { font-size: .8rem; font-weight: 800; }
.resource-nav-wrap { position: relative; z-index: 2; margin-top: -3.3rem; }
.resource-nav { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); overflow: hidden; border: 1px solid var(--nc-line); border-radius: 20px; background: rgba(255,255,255,.96); box-shadow: var(--nc-shadow-lg); backdrop-filter: blur(16px); }
.resource-nav a { display: flex; min-height: 104px; align-items: center; gap: .7rem; padding: 1rem; color: var(--nc-ink); font-size: .78rem; font-weight: 800; text-decoration: none; transition: background-color .2s ease,color .2s ease; }
.resource-nav a { border-right: 1px solid var(--nc-line); border-bottom: 1px solid var(--nc-line); }
.resource-nav a:nth-child(3n) { border-right: 0; }
.resource-nav a:nth-last-child(-n+3) { border-bottom: 0; }
.resource-nav a:hover { color: var(--nc-green-900); background: var(--nc-mist); }
.resource-nav span { display: grid; width: 38px; height: 38px; flex: 0 0 38px; place-items: center; border-radius: 12px; color: var(--nc-green-700); background: var(--nc-mist); }
.resource-library { position: relative; z-index: 2; margin-top: -3.3rem; scroll-margin-top: 125px; padding-bottom: clamp(4rem,7vw,7rem); }
.resource-library__heading { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 1.3rem; border: 1px solid var(--nc-line); border-radius: 22px; padding: 1.5rem 1.7rem; background: rgba(255,255,255,.97); box-shadow: var(--nc-shadow-lg); backdrop-filter: blur(16px); }
.resource-library__heading h2 { max-width: 18ch; margin: .25rem 0 0; font-size: clamp(1.8rem,3vw,3rem); }
.knowledge-lanes { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; }
.knowledge-lane { overflow: hidden; border: 1px solid var(--nc-line); border-radius: 24px; padding: 1.2rem; background: #fff; box-shadow: 0 16px 42px rgba(6,63,54,.08); }
.knowledge-lane--articles { background: linear-gradient(150deg,#fff,#eef8f5); }
.knowledge-lane__title { display: grid; grid-template-columns: 54px 1fr; gap: .9rem; align-items: center; margin-bottom: .8rem; padding: .4rem; }
.knowledge-lane__title > span { display: grid; width: 54px; height: 54px; place-items: center; border-radius: 17px; color: #fff; background: linear-gradient(135deg,var(--nc-green-700),var(--nc-cyan)); font-size: 1.3rem; }
.knowledge-lane__title div { display: flex; flex-direction: column; }
.knowledge-lane__title small { color: var(--nc-green-700); font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.knowledge-lane__title h3 { margin: .15rem 0 0; font-size: 1.3rem; }
.knowledge-lane > a { display: grid; grid-template-columns: 1fr auto; gap: .15rem 1rem; align-items: center; border-top: 1px solid var(--nc-line); padding: .9rem .5rem; color: var(--nc-ink); text-decoration: none; transition: color .2s ease,padding-left .2s ease; }
.knowledge-lane > a span { font-size: .88rem; font-weight: 800; }
.knowledge-lane > a small { grid-row: 2; color: var(--nc-ink-soft); font-size: .72rem; }
.knowledge-lane > a i { grid-column: 2; grid-row: 1 / 3; color: var(--nc-green-700); }
.knowledge-lane > a:hover { padding-left: .75rem; color: var(--nc-green-800); }
.article-section { scroll-margin-top: 120px; background: #fff; }
.article-section--tint { background: linear-gradient(180deg,#eef8f5,#f8fcfb); }
.article-layout { display: grid; grid-template-columns: 190px 1fr; gap: clamp(2rem,6vw,6rem); }
.article-layout > aside { border-right: 1px solid var(--nc-line); }
.article-number { color: transparent; font-family: "Sora",sans-serif; font-size: 6rem; font-weight: 800; line-height: 1; -webkit-text-stroke: 1px rgba(7,136,103,.45); }
.article-layout > aside p { margin-top: .8rem; color: var(--nc-green-700); font-size: .72rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; writing-mode: vertical-rl; }
.article-layout article h2 { max-width: 18ch; margin-bottom: 1.2rem; font-size: clamp(2.2rem,4.4vw,4.6rem); }
.article-lead { max-width: 65ch; color: var(--nc-ink-soft); font-size: clamp(1.05rem,1.5vw,1.24rem); }
.process-grid,.dosage-balance { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; margin: 2.5rem 0; }
.process-grid > div,.dosage-balance > div { position: relative; min-height: 260px; border: 1px solid var(--nc-line); border-radius: var(--nc-radius-md); padding: 1.35rem; background: #fff; }
.process-grid > div > span { position: absolute; top: 1rem; right: 1rem; color: rgba(7,136,103,.42); font-size: .68rem; font-weight: 800; }
.process-grid i,.dosage-balance i { display: grid; width: 52px; height: 52px; place-items: center; border-radius: 16px; color: #fff; background: linear-gradient(135deg,var(--nc-green-700),var(--nc-cyan)); font-size: 1.25rem; }
.process-grid h3,.dosage-balance h3 { margin: 3.2rem 0 .7rem; font-size: 1.2rem; }
.process-grid p,.dosage-balance p { margin: 0; color: var(--nc-ink-soft); font-size: .86rem; }
.article-note { display: flex; gap: .8rem; align-items: flex-start; border-left: 3px solid var(--nc-cyan); border-radius: 0 15px 15px 0; padding: 1rem 1.2rem; background: rgba(21,168,201,.07); }
.article-note i { color: var(--nc-cyan); }
.article-note p { margin: 0; color: var(--nc-ink-soft); font-size: .82rem; }
.solution-map { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .75rem; margin: 2.2rem 0; }
.solution-map a { display: grid; grid-template-columns: 46px 1fr auto; gap: .85rem; align-items: center; min-height: 112px; border: 1px solid var(--nc-line); border-radius: 18px; padding: 1rem; color: var(--nc-ink); background: #fff; text-decoration: none; transition: transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.solution-map a:hover { transform: translateY(-3px); border-color: rgba(7,136,103,.28); box-shadow: var(--nc-shadow-sm); }
.solution-map a > i:first-child { display: grid; width: 46px; height: 46px; place-items: center; border-radius: 14px; color: #fff; background: linear-gradient(135deg,var(--nc-green-700),var(--nc-cyan)); font-size: 1.1rem; }
.solution-map a > i:last-child { color: var(--nc-green-700); }
.solution-map span { display: flex; min-width: 0; flex-direction: column; }
.solution-map small { color: var(--nc-green-700); font-size: .66rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.solution-map b { margin: .15rem 0; font-size: .96rem; }
.solution-map em { overflow: hidden; color: var(--nc-ink-soft); font-size: .74rem; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.decision-rule { display: grid; grid-template-columns: auto 1fr; gap: 1rem; align-items: center; border: 1px solid rgba(7,136,103,.16); border-radius: 17px; padding: 1rem 1.15rem; background: linear-gradient(135deg,var(--nc-mist),#fff); }
.decision-rule span { border-radius: 999px; padding: .45rem .65rem; color: #fff; background: var(--nc-green-700); font-size: .68rem; font-weight: 800; text-transform: uppercase; }
.decision-rule p { margin: 0; color: var(--nc-ink-soft); font-size: .84rem; }
.compound-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; margin-top: 2.3rem; }
.compound-grid > div { display: flex; min-height: 285px; flex-direction: column; border: 1px solid var(--nc-line); border-radius: 20px; padding: 1.25rem; background: linear-gradient(160deg,#fff 60%,#eef8f5); }
.compound-icon { display: grid; width: 50px; height: 50px; place-items: center; border: 1px solid rgba(7,136,103,.18); border-radius: 15px; color: var(--nc-green-900); background: var(--nc-mist); font-family: "Sora",sans-serif; font-size: .8rem; font-weight: 800; }
.compound-grid h3 { margin: 1.45rem 0 .55rem; font-size: 1.08rem; }
.compound-grid p { flex: 1; color: var(--nc-ink-soft); font-size: .8rem; }
.compound-grid a { display: inline-flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--nc-line); padding: .52rem 0; color: var(--nc-green-800); font-size: .74rem; font-weight: 800; text-decoration: none; }
.compound-grid a::after { content: "\2197"; }
.dosage-balance > div { min-height: 250px; }
.dosage-balance .is-balanced { transform: translateY(-12px); border-color: rgba(7,136,103,.28); box-shadow: var(--nc-shadow-sm); }
.dosage-balance .is-balanced i { background: var(--nc-green-700); }
.routine-list { display: grid; gap: .75rem; margin: 2rem 0 0; padding: 0; list-style: none; }
.routine-list li { display: grid; grid-template-columns: 64px 1fr; gap: 1rem; border-top: 1px solid var(--nc-line); padding: 1.2rem 0; }
.routine-list > li > span { color: var(--nc-green-700); font-family: "Sora",sans-serif; font-size: 1.25rem; font-weight: 800; }
.routine-list h3 { margin: 0 0 .3rem; font-size: 1.12rem; }
.routine-list p { margin: 0; color: var(--nc-ink-soft); }
.editorial-section { scroll-margin-top: 120px; background: linear-gradient(180deg,#f3faf7,#fff); }
.editorial-heading { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 2rem; }
.editorial-heading h2 { max-width: 17ch; margin: .35rem 0 0; font-size: clamp(2.3rem,4.5vw,4.7rem); }
.editorial-heading > p { max-width: 48ch; margin: 0; color: var(--nc-ink-soft); }
.editorial-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; }
.editorial-grid article { scroll-margin-top: 130px; display: flex; min-height: 520px; flex-direction: column; border: 1px solid var(--nc-line); border-radius: 24px; padding: clamp(1.35rem,3vw,2rem); background: #fff; box-shadow: 0 18px 45px rgba(6,63,54,.07); }
.editorial-grid article:nth-child(2),.editorial-grid article:nth-child(3) { background: linear-gradient(150deg,#fff,#eef8f5); }
.editorial-icon { display: grid; width: 58px; height: 58px; place-items: center; margin-bottom: 1.5rem; border-radius: 18px; color: #fff; background: linear-gradient(135deg,var(--nc-green-700),var(--nc-cyan)); font-size: 1.3rem; }
.editorial-grid article > small { color: var(--nc-green-700); font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.editorial-grid h3 { max-width: 19ch; margin: .55rem 0 .85rem; font-size: clamp(1.5rem,2.5vw,2.25rem); }
.editorial-grid article > p { color: var(--nc-ink-soft); }
.editorial-grid ol { display: grid; gap: .6rem; margin: .5rem 0 1.5rem; padding-left: 1.25rem; color: var(--nc-ink-soft); font-size: .85rem; }
.editorial-grid article > div { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: auto; border-top: 1px solid var(--nc-line); padding-top: 1rem; }
.editorial-grid article > div a { border: 1px solid rgba(7,136,103,.18); border-radius: 999px; padding: .48rem .7rem; color: var(--nc-green-800); background: var(--nc-mist); font-size: .72rem; font-weight: 800; text-decoration: none; }
.safety-section { scroll-margin-top: 120px; color: #fff; background: radial-gradient(circle at 8% 0,rgba(243,180,82,.16),transparent 30rem),linear-gradient(135deg,#113b35,#052e29); }
.safety-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(2rem,7vw,7rem); align-items: start; }
.safety-lead .eyebrow { color: #ffd190; }
.safety-lead h2 { max-width: 13ch; margin: .6rem 0 1rem; color: #fff; font-size: clamp(2.5rem,5vw,5.2rem); }
.safety-lead > p { max-width: 55ch; color: rgba(255,255,255,.68); }
.safety-alert { display: flex; gap: .9rem; align-items: flex-start; margin-top: 2rem; border: 1px solid rgba(255,202,124,.28); border-radius: 18px; padding: 1.1rem; color: #ffe4bd; background: rgba(255,177,59,.08); }
.safety-alert i { flex: 0 0 auto; font-size: 1.35rem; }
.safety-alert span { display: flex; flex-direction: column; color: rgba(255,255,255,.72); font-size: .82rem; }
.safety-alert b { margin-bottom: .15rem; color: #fff; }
.safety-checklist { border: 1px solid rgba(255,255,255,.14); border-radius: 26px; padding: clamp(1.35rem,4vw,2.5rem); background: rgba(255,255,255,.07); backdrop-filter: blur(14px); }
.safety-checklist h3 { margin-bottom: 1.2rem; color: #fff; }
.safety-checklist ol { display: grid; gap: .55rem; margin: 0; padding: 0; list-style: none; }
.safety-checklist li { display: grid; grid-template-columns: 42px 1fr; gap: .75rem; align-items: center; border-bottom: 1px solid rgba(255,255,255,.1); padding: .75rem 0; }
.safety-checklist li > i { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 13px; color: #a9e8cf; background: rgba(169,232,207,.1); }
.safety-checklist li span { display: flex; flex-direction: column; }
.safety-checklist li b { color: #fff; font-size: .83rem; }
.safety-checklist li small { margin-top: .15rem; color: rgba(255,255,255,.58); }
.resource-sources { display: grid; gap: .4rem; margin-top: 1.25rem; }
.resource-sources > span { margin-bottom: .2rem; color: #ffd190; font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.resource-sources a { display: flex; align-items: center; justify-content: space-between; color: rgba(255,255,255,.76); font-size: .74rem; font-weight: 700; text-decoration: none; }
.resource-sources a:hover { color: #fff; }
.calculator-section { scroll-margin-top: 120px; color: #fff; background: radial-gradient(circle at 90% 0,rgba(21,168,201,.18),transparent 30rem),var(--nc-green-950); }
.calculator-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(2rem,7vw,7rem); align-items: center; }
.calculator-grid .eyebrow { color: #a9e8cf; }
.calculator-grid .section-title { color: #fff; }
.calculator-grid .section-intro { color: rgba(255,255,255,.65); }
.calculator-warning { display: flex; gap: .7rem; align-items: flex-start; margin-top: 1.5rem; border: 1px solid rgba(255,255,255,.13); border-radius: 15px; padding: 1rem; color: rgba(255,255,255,.72); background: rgba(255,255,255,.05); font-size: .8rem; }
.dilution-calculator { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem 1rem; border: 1px solid rgba(255,255,255,.16); border-radius: var(--nc-radius-lg); padding: clamp(1.5rem,4vw,3rem); background: rgba(255,255,255,.08); backdrop-filter: blur(16px); }
.dilution-calculator label { font-size: .72rem; font-weight: 800; }
.calculator-input { display: flex; height: 58px; align-items: center; border-radius: 15px; background: #fff; }
.calculator-input input { width: 100%; border: 0; outline: 0; padding: .8rem 1rem; background: transparent; font-size: 1.05rem; font-weight: 800; }
.calculator-input span { min-width: 70px; color: var(--nc-ink-soft); font-size: .72rem; font-weight: 800; }
.calculator-result { grid-column: 1 / -1; display: flex; min-height: 180px; flex-direction: column; justify-content: center; margin-top: .8rem; border-radius: 20px; padding: 1.5rem; color: var(--nc-ink); background: linear-gradient(135deg,#fff,#dff5ed); text-align: center; }
.calculator-result small { color: var(--nc-green-700); font-weight: 800; text-transform: uppercase; }
.calculator-result strong { margin: .35rem 0; font-family: "Sora",sans-serif; font-size: clamp(2.6rem,6vw,5rem); letter-spacing: -.07em; }
.calculator-result span { color: var(--nc-ink-soft); font-size: .8rem; }
.resource-cta { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: clamp(2rem,5vw,4.5rem); }
.resource-cta .eyebrow { color: #bcebd8; }
.resource-cta h2 { max-width: 20ch; color: #fff; font-size: clamp(2rem,4vw,3.5rem); }
@media (max-width: 991.98px) {
    .resource-hero__grid,.calculator-grid,.safety-grid { grid-template-columns: 1fr; }
    .knowledge-lanes { grid-template-columns: 1fr; }
    .resource-nav { grid-template-columns: repeat(2,1fr); }
    .resource-nav a { border-right: 1px solid var(--nc-line); border-bottom: 1px solid var(--nc-line); }
    .resource-nav a:nth-child(2n) { border-right: 0; }
    .resource-nav a:nth-last-child(-n+2) { border-bottom: 0; }
    .article-layout { grid-template-columns: 120px 1fr; }
    .process-grid,.dosage-balance { grid-template-columns: 1fr; }
    .compound-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .dosage-balance .is-balanced { transform: none; }
}
@media (max-width: 767.98px) {
    .resource-feature { min-height: 410px; }
    .resource-library__heading,.editorial-heading { align-items: flex-start; flex-direction: column; }
    .resource-nav { grid-template-columns: 1fr; }
    .resource-nav a { min-height: 78px; border-right: 0 !important; border-bottom: 1px solid var(--nc-line); }
    .resource-nav a:last-child { border-bottom: 0; }
    .article-layout { grid-template-columns: 1fr; }
    .article-layout > aside { display: flex; gap: 1rem; align-items: center; border-right: 0; border-bottom: 1px solid var(--nc-line); padding-bottom: 1rem; }
    .article-number { font-size: 3.5rem; }
    .article-layout > aside p { margin: 0; writing-mode: horizontal-tb; }
    .solution-map,.compound-grid { grid-template-columns: 1fr; }
    .editorial-grid { grid-template-columns: 1fr; }
    .editorial-grid article { min-height: auto; }
    .decision-rule { grid-template-columns: 1fr; }
    .dilution-calculator { grid-template-columns: 1fr; }
    .calculator-result { grid-column: auto; }
    .resource-cta { flex-direction: column; align-items: flex-start; }
}
