/* Drug Testing Protocols & Options page — scoped under .dtp */
.dtp{--c-blue:var(--bs-primary-hex,#0072bc);--c-blue-dark:#005b96;--c-blue-light:#1a86cf;--c-navy:var(--bs-heading-color-hex,#1e2d3b);--c-ink:#212124;--c-muted:#495356;--c-light:var(--bs-light-hex,#f2f8fc);--c-light-2:#e6f1f9;--c-border:var(--bs-secondary-border-hex,#e7e7e7);--c-border-2:#cfd8de;--c-yellow:var(--bs-warning-hex,#ffd240);--c-yellow-pale:#fff5d6;--c-sky:#80b7e3;--c-sky-pale:#cfe4f5;--r:var(--bs-border-radius,10px);--f-head:'Catamaran',sans-serif;--f-body:'Nunito Sans',system-ui,sans-serif;--ease:cubic-bezier(.2,.7,.3,1);
  font-family:var(--f-body);color:var(--c-ink);background:#fff;max-width:100%;overflow-x:clip;-webkit-font-smoothing:antialiased}
.dtp *,.dtp *::before,.dtp *::after{box-sizing:border-box}
.dtp p a:not([class]){color:var(--c-navy)}.dtp p a:not([class]):hover{color:var(--c-blue)}
.dtp img{display:block;max-width:100%}
.dtp h1,.dtp h2,.dtp h3{font-family:var(--f-head);margin:0;color:inherit}
.dtp ul,.dtp ol{margin:0;padding:0;list-style:none}.dtp dl,.dtp dd,.dtp p{margin:0}
.dtp button{font:inherit;cursor:pointer}
.dtp-wrap{max-width:1180px;margin:0 auto;padding-left:24px;padding-right:24px}
.dtp-section{background:#fff;border-bottom:1px solid var(--c-border)}.dtp-section--light{background:var(--c-light)}
.dtp-section>.dtp-wrap{padding-top:68px;padding-bottom:68px}
.dtp-eyebrow{font-family:var(--f-head);font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--c-blue);margin:0 0 10px}
.dtp-eyebrow-sm{font-family:var(--f-head);font-weight:700;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--c-blue);margin:0 0 8px}
.dtp-eyebrow--sky{color:var(--c-sky)}.dtp-eyebrow--yellow{color:var(--c-yellow)}.dtp-eyebrow--navy{color:var(--c-navy)}
.dtp-h2{font-weight:800;font-size:clamp(28px,3.6vw,40px);line-height:1.1;letter-spacing:-.015em;color:var(--c-navy);margin:0 0 14px}
.dtp-lead{font-size:18px;line-height:1.55;color:var(--c-muted);margin:0 0 14px;max-width:52ch}
.dtp-btn{display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:17px;padding:15px 26px;border-radius:var(--r);text-decoration:none;border:2px solid transparent;white-space:nowrap;transition:background .2s,border-color .2s,color .2s}
.dtp .dtp-btn-primary{background:var(--c-blue);color:#fff;border-color:var(--c-blue)}.dtp .dtp-btn-primary:hover{background:var(--c-blue-dark);border-color:var(--c-blue-dark);color:#fff}
.dtp .dtp-btn-yellow{background:var(--c-yellow);color:var(--c-navy);border-color:var(--c-yellow);box-shadow:0 6px 18px rgba(0,0,0,.18)}.dtp .dtp-btn-yellow:hover{background:#ffdc66;border-color:#ffdc66;color:var(--c-navy)}
.dtp .dtp-btn-outline-light{color:#fff;border-color:rgba(255,255,255,.55)}.dtp .dtp-btn-outline-light:hover{border-color:#fff;background:rgba(255,255,255,.08);color:#fff}
.dtp .dtp-btn-outline{color:var(--c-blue);border-color:var(--c-blue)}.dtp .dtp-btn-outline:hover{background:var(--c-blue);color:#fff}
.dtp-pill{display:flex;align-items:center;justify-content:center;font-weight:600;font-size:17px;padding:13px 22px;border-radius:999px;border:2px solid var(--c-blue);text-decoration:none;transition:background .2s,color .2s}
.dtp .dtp-pill-solid{background:var(--c-blue);color:#fff}.dtp .dtp-pill-solid:hover{background:var(--c-blue-dark);border-color:var(--c-blue-dark);color:#fff}
.dtp .dtp-pill-outline{color:var(--c-blue)}.dtp .dtp-pill-outline:hover{background:var(--c-blue);color:#fff}
.dtp-tag{display:inline-block;font-size:13px;font-weight:700;padding:5px 10px;border-radius:999px;background:var(--c-light);color:var(--c-navy)}
.dtp-tag--yellow{background:var(--c-yellow-pale)}.dtp-tag--blue{background:var(--c-blue);color:#fff}.dtp-tag--navy{background:var(--c-navy);color:#fff}
@keyframes dtpHeroIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes dtpDrift{0%,100%{transform:translate3d(0,0,0) rotate(-4deg)}50%{transform:translate3d(-2%,3%,0) rotate(2deg)}}
@keyframes dtpFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes dtpPulse{0%{box-shadow:0 0 0 0 rgba(255,210,64,.55)}70%{box-shadow:0 0 0 18px rgba(255,210,64,0)}100%{box-shadow:0 0 0 0 rgba(255,210,64,0)}}

/* 1. Hero */
.dtp-hero{position:relative;overflow:hidden;color:#fff;background:linear-gradient(115deg,var(--c-blue-dark) 0%,var(--c-blue) 60%,var(--c-blue-light) 100%)}
.dtp-hero__mark{position:absolute;right:-6%;top:-14%;width:clamp(360px,46vw,680px);height:auto;opacity:.10;animation:dtpDrift 14s ease-in-out infinite;pointer-events:none}
.dtp-hero__grid{position:relative;padding-top:60px;padding-bottom:64px;display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:40px 56px;align-items:center}
.dtp-crumb{display:flex;flex-wrap:wrap;gap:8px;font-family:var(--f-head);font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--c-yellow);margin-bottom:14px;animation:dtpHeroIn .6s var(--ease) both}
.dtp .dtp-crumb a{color:var(--c-yellow);text-decoration:none}.dtp .dtp-crumb a:hover{text-decoration:underline}.dtp-crumb span:last-child{color:var(--c-sky-pale)}
.dtp-hero h1{font-weight:800;font-size:clamp(34px,5vw,58px);line-height:1.04;letter-spacing:-.02em;margin:0 0 18px;max-width:16ch;text-wrap:balance;animation:dtpHeroIn .7s var(--ease) .08s both}
.dtp-hero__lede{font-size:clamp(17px,2vw,20px);line-height:1.5;color:var(--c-light-2);max-width:50ch;margin:0 0 28px;animation:dtpHeroIn .7s var(--ease) .16s both}
.dtp-hero__actions{display:flex;flex-wrap:wrap;gap:12px;animation:dtpHeroIn .7s var(--ease) .24s both}
.dtp .dtp-play{display:inline-flex;align-items:center;gap:14px;margin-top:30px;text-decoration:none;color:#fff;animation:dtpHeroIn .7s var(--ease) .34s both}.dtp .dtp-play:hover{color:var(--c-yellow)}
.dtp-play__btn{flex:none;width:56px;height:56px;border-radius:50%;background:var(--c-yellow);display:inline-flex;align-items:center;justify-content:center;animation:dtpPulse 2.4s ease-out infinite}
.dtp-play__btn span{width:0;height:0;border-style:solid;border-width:10px 0 10px 17px;border-color:transparent transparent transparent var(--c-navy);margin-left:4px}
.dtp-play strong{display:block;font-family:var(--f-head);font-weight:800;font-size:17px;line-height:1.2}.dtp-play small{display:block;font-size:14px;color:var(--c-sky-pale);margin-top:2px}
.dtp-example{background:#fff;color:var(--c-ink);border:1px solid var(--c-border);border-radius:12px;padding:24px 26px;box-shadow:0 28px 60px rgba(0,0,0,.28);animation:dtpHeroIn .7s var(--ease) .2s both,dtpFloat 6s ease-in-out 1s infinite}
.dtp-example__head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:6px;font-size:13px;color:var(--c-muted)}.dtp-example__head .dtp-eyebrow-sm{margin:0}
.dtp-example h2{font-weight:800;font-size:20px;line-height:1.2;color:var(--c-navy);margin-bottom:14px}
.dtp-example dl{border-top:1px solid var(--c-border)}
.dtp-example dl>div{display:grid;grid-template-columns:minmax(120px,.9fr) minmax(0,1fr);gap:6px 16px;padding:12px 0;border-bottom:1px solid var(--c-border);align-items:center}.dtp-example dl>div:last-child{border-bottom:0}
.dtp-example dt{font-weight:700;font-size:15px}.dtp-example dd{display:flex;flex-wrap:wrap;gap:6px}

/* 2. Testing options */
.dtp-panels__grid{display:grid;grid-template-columns:minmax(260px,.8fr) minmax(0,1.6fr);gap:40px 56px;align-items:start}
@media (max-width:820px){.dtp-panels__grid{grid-template-columns:1fr}}
.dtp-switch{display:inline-flex;align-items:center;gap:12px;background:var(--c-light);border:1px solid var(--c-border-2);border-radius:999px;padding:8px 14px 8px 8px;font-weight:700;font-size:15px;color:var(--c-navy)}
.dtp-switch__track{display:inline-flex;align-items:center;width:44px;height:26px;border-radius:999px;padding:3px;background:var(--c-border-2);transition:background .2s}
.dtp-switch[aria-pressed="true"] .dtp-switch__track{background:var(--c-blue)}
.dtp-switch__knob{width:20px;height:20px;border-radius:50%;background:#fff;transition:transform .2s}
.dtp-switch[aria-pressed="true"] .dtp-switch__knob{transform:translateX(18px)}
.dtp-note{margin-top:22px;background:var(--c-yellow-pale);border:1px solid var(--c-yellow);border-radius:var(--r);padding:16px 18px;font-size:15px;line-height:1.5}
.dtp-matrix{background:#fff;border:1px solid var(--c-border);border-radius:12px;overflow:hidden;box-shadow:0 12px 34px rgba(30,45,59,.08)}
.dtp-matrix__head,.dtp-matrix__row{display:grid;grid-template-columns:minmax(150px,1.3fr) repeat(4,minmax(0,1fr))}
.dtp-matrix__head{background:var(--c-light);border-bottom:1px solid var(--c-border)}
.dtp-matrix__corner{padding:16px 20px;font-family:var(--f-head);font-weight:700;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--c-muted);align-self:end}
.dtp-matrix__col{border:0;border-left:1px solid var(--c-border);padding:16px 10px;text-align:center;background:var(--c-light);color:var(--c-navy);transition:background .2s,color .2s}
.dtp-matrix__col strong{display:block;font-family:var(--f-head);font-weight:800;font-size:22px;line-height:1}.dtp-matrix__col small{display:block;font-size:12px;margin-top:4px;opacity:.85}
.dtp-matrix__col[aria-pressed="true"]{background:var(--c-blue);color:#fff}
.dtp-matrix__row{border-bottom:1px solid var(--c-border);align-items:center}
.dtp-matrix__row[data-code="THC"]{background:#fffbea}
.dtp-matrix.thc-off .dtp-matrix__row[data-code="THC"]{opacity:.45;background:#fafafa}
.dtp-matrix__sub{padding:12px 20px}.dtp-matrix__sub strong{display:block;font-weight:700;font-size:15px;line-height:1.3}.dtp-matrix__sub small{font-size:12px;color:var(--c-muted);letter-spacing:.06em}
.dtp-matrix__cell{display:flex;align-items:center;justify-content:center;padding:12px 10px;border-left:1px solid var(--c-border);min-height:48px}
.dtp-matrix__cell.is-selected{background:var(--c-light-2)}
.dtp-dot{width:14px;height:14px;border-radius:50%;background:var(--c-sky)}.dtp-matrix__cell.is-selected .dtp-dot{background:var(--c-blue)}
.dtp-dash{width:8px;height:2px;background:var(--c-border-2)}
.dtp-matrix.thc-off .dtp-matrix__row[data-code="THC"] .dtp-dot{width:8px;height:2px;border-radius:0;background:var(--c-border-2)}
.dtp-matrix__foot{padding:14px 20px;border-top:1px solid var(--c-border);background:var(--c-navy);font-size:14px;line-height:1.5;color:#dbe7f0}

/* 3. Builder */
.dtp-builder__grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,.9fr);gap:40px 48px;align-items:start}
@media (max-width:820px){.dtp-builder__grid{grid-template-columns:1fr}}
.dtp-builder__rows{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.dtp-builder__row{background:#fff;border:1px solid var(--c-border);border-radius:var(--r);padding:16px 18px;display:grid;grid-template-columns:minmax(150px,.8fr) minmax(0,1.6fr);gap:10px 18px;align-items:center}
@media (max-width:560px){.dtp-builder__row{grid-template-columns:1fr}}
.dtp-builder__row h3{font-weight:800;font-size:17px;line-height:1.2;color:var(--c-navy)}
.dtp-builder__chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.dtp-builder__sep{width:1px;height:22px;background:var(--c-border);margin:0 4px}
.dtp-chip{font-weight:700;font-size:14px;padding:7px 12px;border-radius:999px;border:1.5px solid var(--c-border-2);background:#fff;color:var(--c-navy);transition:background .15s,color .15s,border-color .15s}
.dtp-chip[aria-pressed="true"]{background:var(--c-blue);color:#fff;border-color:var(--c-blue)}
.dtp-chip--alc[aria-pressed="true"]{background:var(--c-navy);border-color:var(--c-navy)}
.dtp-summary{position:sticky;top:20px;background:var(--c-navy);color:#fff;border-radius:12px;padding:24px 26px;box-shadow:0 18px 50px rgba(30,45,59,.25)}
.dtp-summary .dtp-eyebrow{margin-bottom:8px}
.dtp-summary h3{font-weight:800;font-size:22px;line-height:1.2;margin-bottom:14px}
.dtp-summary dl{border-top:1px solid rgba(255,255,255,.18)}
.dtp-summary dl>div{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.18);font-size:15px}
.dtp-summary dt{color:var(--c-sky-pale)}.dtp-summary dd{font-weight:700;text-align:right}
.dtp-summary>p{font-size:14px;line-height:1.5;color:var(--c-sky-pale);margin:14px 0 18px}
.dtp-summary .dtp-btn{display:flex;padding:13px 20px;font-size:16px}

/* 4. Clinic CTA */
.dtp-cta{background:#fff;border-bottom:1px solid var(--c-border)}
.dtp-cta__wrap{padding-top:64px;padding-bottom:64px;display:flex;flex-wrap:wrap;gap:28px 40px;align-items:center;justify-content:space-between}
.dtp-cta__copy{flex:1 1 380px;min-width:0}.dtp-cta .dtp-h2{max-width:22ch;margin-bottom:12px}.dtp-cta .dtp-lead{max-width:56ch;margin-bottom:18px}
.dtp-cta__clinics{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px 24px;max-width:56ch}
.dtp-cta__clinics li{font-size:15px;line-height:1.4}.dtp-cta__clinics strong{font-family:var(--f-head);font-weight:800;font-size:16px;display:block}
.dtp .dtp-cta__clinics a{color:var(--c-blue);font-weight:700;text-decoration:none}.dtp .dtp-cta__clinics a:hover{text-decoration:underline}
.dtp-cta__actions{flex:0 1 300px;min-width:240px;display:flex;flex-direction:column;gap:8px}.dtp-cta__actions .dtp-btn{display:flex;padding:14px 22px}

/* 5. Reasons: pinned scroll */
.dtp-reasons{position:relative;height:500vh;background:var(--c-navy)}
.dtp-reasons__stage{position:sticky;top:0;height:100vh;overflow:hidden;color:#fff}
.dtp-reasons__bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transform:scale(1.06);transition:opacity .8s var(--ease),transform 1.4s var(--ease)}
.dtp-reasons__shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(30,45,59,.72) 0%,rgba(30,45,59,.25) 40%,rgba(30,45,59,.65) 100%)}
.dtp-reasons__head{position:absolute;left:0;right:0;top:0;padding-top:40px}
.dtp-reasons__head h2{font-weight:800;font-size:clamp(24px,3vw,34px);line-height:1.1;letter-spacing:-.015em;max-width:22ch}
.dtp-reasons__card{position:absolute;top:50%;width:min(520px,calc(100% - 48px));background:#fff;color:var(--c-ink);border-radius:12px;padding:28px 30px;box-shadow:0 28px 60px rgba(0,0,0,.3);opacity:0;pointer-events:none;transform:translateY(-30%);transition:opacity .6s var(--ease),transform .7s var(--ease)}
.dtp-reasons__card.is-left{left:max(24px,calc(50% - 590px))}.dtp-reasons__card.is-right{right:max(24px,calc(50% - 590px))}
.dtp-reasons__card.is-past{transform:translateY(-70%)}
.dtp-reasons__card h3{font-weight:800;font-size:clamp(26px,3vw,36px);line-height:1.1;letter-spacing:-.015em;color:var(--c-navy);margin-bottom:12px}
.dtp-reasons__card>p:not(.dtp-eyebrow-sm){font-size:17px;line-height:1.55;color:var(--c-muted);margin-bottom:18px}
.dtp-reasons__typical{display:flex;flex-wrap:wrap;align-items:center;gap:10px;border-top:1px solid var(--c-border);padding-top:14px}
.dtp-reasons__typical>span:first-child{font-family:var(--f-head);font-weight:700;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--c-muted)}
.dtp-reasons__typical .dtp-tag{font-size:14px;padding:6px 12px}
.dtp-reasons__dots{position:absolute;left:0;right:0;bottom:28px;display:flex;justify-content:center;align-items:center;gap:8px}
.dtp-reasons__dots span{display:block;height:6px;width:10px;border-radius:999px;background:rgba(255,255,255,.45);transition:width .3s,background .3s}
.dtp-reasons__dots em{margin-left:12px;font-size:13px;font-style:normal;color:var(--c-sky-pale)}
.dtp-reasons[data-active="0"] .dtp-reasons__bg[data-step="0"]{opacity:1;transform:scale(1)}
.dtp-reasons[data-active="0"] .dtp-reasons__card[data-step="0"]{opacity:1;pointer-events:auto;transform:translateY(-50%)}
.dtp-reasons[data-active="0"] .dtp-reasons__dots span[data-step="0"]{width:28px;background:var(--c-yellow)}
.dtp-reasons[data-active="1"] .dtp-reasons__bg[data-step="1"]{opacity:1;transform:scale(1)}
.dtp-reasons[data-active="1"] .dtp-reasons__card[data-step="1"]{opacity:1;pointer-events:auto;transform:translateY(-50%)}
.dtp-reasons[data-active="1"] .dtp-reasons__dots span[data-step="1"]{width:28px;background:var(--c-yellow)}
.dtp-reasons[data-active="2"] .dtp-reasons__bg[data-step="2"]{opacity:1;transform:scale(1)}
.dtp-reasons[data-active="2"] .dtp-reasons__card[data-step="2"]{opacity:1;pointer-events:auto;transform:translateY(-50%)}
.dtp-reasons[data-active="2"] .dtp-reasons__dots span[data-step="2"]{width:28px;background:var(--c-yellow)}
.dtp-reasons[data-active="3"] .dtp-reasons__bg[data-step="3"]{opacity:1;transform:scale(1)}
.dtp-reasons[data-active="3"] .dtp-reasons__card[data-step="3"]{opacity:1;pointer-events:auto;transform:translateY(-50%)}
.dtp-reasons[data-active="3"] .dtp-reasons__dots span[data-step="3"]{width:28px;background:var(--c-yellow)}
.dtp-reasons[data-active="4"] .dtp-reasons__bg[data-step="4"]{opacity:1;transform:scale(1)}
.dtp-reasons[data-active="4"] .dtp-reasons__card[data-step="4"]{opacity:1;pointer-events:auto;transform:translateY(-50%)}
.dtp-reasons[data-active="4"] .dtp-reasons__dots span[data-step="4"]{width:28px;background:var(--c-yellow)}

/* 6. THC */
.dtp-thc{background:var(--c-navy);color:#fff}
.dtp-thc>.dtp-wrap{padding-top:68px;padding-bottom:68px}
.dtp-thc .dtp-h2{color:#fff;max-width:18ch}.dtp-thc .dtp-lead{color:#dbe7f0}
.dtp-thc__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:40px 56px;align-items:start;margin-bottom:40px}
.dtp-bars{display:flex;flex-direction:column;gap:14px;margin-top:14px}
.dtp-bars__label{display:flex;justify-content:space-between;gap:12px;font-size:15px;margin-bottom:6px}.dtp-bars__label span{color:var(--c-sky-pale)}
.dtp-bars__track{height:10px;border-radius:999px;background:rgba(255,255,255,.12);overflow:hidden}
.dtp-bars__fill{height:100%;border-radius:999px;transform-origin:left;transform:scaleX(0);transition:transform 1.3s var(--ease)}
.dtp-bars__fill--sky{background:var(--c-sky)}.dtp-bars__fill--yellow{background:var(--c-yellow)}
.dtp-bars>div:nth-child(2) .dtp-bars__fill{transition-delay:.25s}.dtp-bars>div:nth-child(3) .dtp-bars__fill{transition-delay:.5s}
.dtp-thc.is-seen .dtp-bars__fill{transform:scaleX(1)}
.dtp-thc__fine{font-size:14px;line-height:1.5;color:var(--c-sky-pale);margin-top:14px}
.dtp-thc__options{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}
.dtp-thc__opt{border:1px solid rgba(255,255,255,.18);border-radius:var(--r);padding:22px 24px;background:rgba(255,255,255,.04);display:flex;flex-direction:column;gap:8px}
.dtp-thc__opt h3{font-weight:800;font-size:20px;color:var(--c-sky)}.dtp-thc__opt p{font-size:16px;line-height:1.5;color:var(--c-light);flex:1}
.dtp-thc__opt small{font-size:14px;color:var(--c-sky-pale);border-top:1px solid rgba(255,255,255,.18);padding-top:10px}

/* 7. Results */
.dtp-results__head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px 32px;margin-bottom:30px}
.dtp-results__head>div{max-width:60ch}.dtp-results__head .dtp-h2{margin:0}.dtp-results__head>p{font-size:16px;line-height:1.5;color:var(--c-muted);max-width:40ch}
.dtp-results__flow{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.dtp-results__flow>div{background:#fff;border:1px solid var(--c-border);border-radius:var(--r);padding:20px 22px;display:flex;flex-direction:column;gap:8px}
.dtp-results__flow>div.is-light{background:var(--c-light);border-color:transparent}
.dtp-results__flow small{font-family:var(--f-head);font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--c-muted)}.dtp-results__flow .is-light small{color:var(--c-blue)}
.dtp-results__flow h3{font-weight:800;font-size:20px;line-height:1.2;color:var(--c-navy)}.dtp-results__flow p{font-size:15px;line-height:1.5;color:var(--c-muted)}
.dtp-results__states{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px 24px;margin-top:26px;border-top:1px solid var(--c-border);padding-top:22px}
.dtp-results__states dt{font-family:var(--f-head);font-weight:800;font-size:16px;color:var(--c-navy)}.dtp-results__states dd{font-size:15px;line-height:1.5;color:var(--c-muted)}

/* 8. DOT */
.dtp-regulated{position:relative;color:#fff;overflow:hidden;background:linear-gradient(115deg,var(--c-blue-dark) 0%,var(--c-blue) 60%,var(--c-blue-light) 100%)}
.dtp-regulated__mark{position:absolute;left:-8%;bottom:-28%;width:clamp(340px,44vw,640px);height:auto;opacity:.10;animation:dtpDrift 16s ease-in-out infinite;pointer-events:none}
.dtp-regulated>.dtp-wrap{position:relative;padding-top:68px;padding-bottom:68px}
.dtp-regulated__head{max-width:60ch;margin-bottom:30px}.dtp-regulated .dtp-h2{color:#fff;margin-bottom:12px}.dtp-regulated__head>p{font-size:17px;line-height:1.55;color:var(--c-light-2)}
.dtp-compare{background:#fff;color:var(--c-ink);border-radius:12px;overflow:hidden;box-shadow:0 28px 60px rgba(0,0,0,.25)}
.dtp-compare__head,.dtp-compare__row{display:grid;grid-template-columns:minmax(120px,.8fr) repeat(2,minmax(0,1fr));border-bottom:1px solid var(--c-border)}
.dtp-compare__head{background:var(--c-light)}.dtp-compare__head>div{padding:14px 20px;font-family:var(--f-head);font-weight:800;font-size:17px;color:var(--c-navy)}
.dtp-compare__head>.is-dot{color:var(--c-blue);background:var(--c-light-2)}
.dtp-compare__row>div{padding:14px 20px;font-size:15px;line-height:1.5;color:var(--c-muted)}.dtp-compare__row>div:first-child{font-weight:700;color:var(--c-navy)}
.dtp-compare__row>.is-dot{color:var(--c-navy);background:#f7fbfe}
.dtp-regulated__link{margin-top:18px;font-size:15px}
.dtp .dtp-regulated__link a{color:#fff;font-weight:700;text-decoration:none;border-bottom:2px solid var(--c-yellow);padding-bottom:2px}.dtp .dtp-regulated__link a:hover{color:var(--c-yellow)}

/* 9. Employer band */
.dtp-employer{background:var(--c-yellow);overflow:hidden}
.dtp-employer__wrap{max-width:1320px;margin:0 auto;padding:48px 24px;display:flex;flex-wrap:wrap;gap:28px 36px;align-items:center}
.dtp-employer__copy{flex:1 1 380px;min-width:0}.dtp-employer .dtp-eyebrow{margin-bottom:8px}
.dtp-employer h2{font-weight:600;font-size:clamp(24px,2.6vw,32px);line-height:1.2;color:var(--c-blue);margin:0 0 10px;max-width:26ch}
.dtp-employer__copy>p:last-child{font-style:oblique;font-size:16px;line-height:1.5;color:var(--c-blue);max-width:62ch}
.dtp-employer__actions{flex:0 1 300px;min-width:240px;display:flex;flex-direction:column;gap:8px}

/* 10. FAQ */
.dtp-faq__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:40px;align-items:start}
.dtp-faq__intro{position:sticky;top:20px}.dtp-faq__intro .dtp-h2{max-width:16ch;margin-bottom:12px}.dtp-faq__intro .dtp-lead{font-size:17px;max-width:40ch;margin-bottom:24px}
.dtp-faq__intro img{width:100%;max-width:480px;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r)}
.dtp-faq__list{border-top:1px solid var(--c-border)}.dtp-faq__list details{border-bottom:1px solid var(--c-border)}
.dtp-faq__list summary{list-style:none;cursor:pointer;padding:18px 0;display:flex;justify-content:space-between;align-items:center;gap:16px;color:var(--c-navy);font-family:var(--f-head);font-weight:800;font-size:19px;line-height:1.25}
.dtp-faq__list summary::-webkit-details-marker{display:none}.dtp-faq__list summary:hover{color:var(--c-blue)}
.dtp-faq__icon{flex:none;width:28px;height:28px;border-radius:50%;border:1.5px solid var(--c-border-2);position:relative;transition:transform .2s}
.dtp-faq__icon::before,.dtp-faq__icon::after{content:"";position:absolute;background:currentColor;left:50%;top:50%;transform:translate(-50%,-50%)}
.dtp-faq__icon::before{width:12px;height:1.5px}.dtp-faq__icon::after{width:1.5px;height:12px}
.dtp-faq__list details[open] .dtp-faq__icon{transform:rotate(45deg)}
.dtp-faq__a{padding:0 40px 20px 0}.dtp-faq__a p{font-size:16px;line-height:1.6;color:var(--c-muted)}

@media (prefers-reduced-motion:reduce){.dtp *{animation:none!important;transition:none!important}.dtp-reasons{height:auto}.dtp-reasons__stage{position:static;height:auto;padding:48px 0}.dtp-reasons__bg{display:none}.dtp-reasons__card{position:static;opacity:1;transform:none;margin:16px auto;pointer-events:auto}.dtp-reasons__head{position:static}.dtp-reasons__dots{display:none}.dtp-thc .dtp-bars__fill{transform:scaleX(1)}}
@media print{.dtp-faq__intro,.dtp-summary{position:static}}


/* ======================================================================
   ICA build additions — appended, never merged (append-only CSS rule).
   ====================================================================== */
.dtp [data-sal], .dtp [data-reveal] { opacity: 1 !important; transform: none !important; }
/* theme collision: ICA theme sets h1/h2/h3 colour directly; restate inverted contexts */
.dtp-hero h1, .dtp-hero .dtp-hero__lede, .dtp-hero .dtp-crumb, .dtp-hero .dtp-crumb a, .dtp-hero .dtp-play { color: #fff; }
.dtp-thc .dtp-h2, .dtp-thc .dtp-lead, .dtp-thc h3, .dtp-thc p { color: #fff; }
.dtp-regulated .dtp-h2, .dtp-regulated .dtp-regulated__head p { color: #fff; }
.dtp-reasons h2, .dtp-reasons__card h3, .dtp-reasons__card p { color: inherit; }
.dtp-summary h3, .dtp-summary p, .dtp-summary dt, .dtp-summary dd { color: #fff; }
.dtp-freetext p { margin: 0 0 12px; } .dtp-freetext p:last-child { margin-bottom: 0; }
/* 2026-09-17 audit fixes: example-card note tag renders unconditionally (flat row tpl); hide it when empty */
.dtp-example .dtp-tag:empty { display: none; }

/* 2026-09-17 — hero video lightbox size.
   The site-wide GLightbox init in index.esm.js sizes the player 1920x1080, which
   fills the viewport on every page. That init is shared with the homepage, so the
   cap lives here instead: this stylesheet is loaded only by the Service Drug
   Protocols template, so the rule cannot reach another page's lightbox.
   80% of the viewport from tablet up; phones keep the default, where 80% leaves
   the player about 300px wide. !important is required — GLightbox writes inline
   width/max-width onto .gslide-media. */
@media (min-width: 768px) {
  .glightbox-container .gslide-media { width: 80vw !important; max-width: 80vw !important; max-height: 80vh !important; }
  .glightbox-container .gslide-media .gvideo-wrapper { width: 100% !important; max-width: 100% !important; }
}

/* 2026-09-17 — hero video lightbox, ICA brand styling.
   GLightbox ships a generic black-on-black player chrome. These rules restate it
   in the page's own tokens. Scoping note as above: .glightbox-container is a body
   child, outside .dtp, so the page's --c-* tokens do not reach it; the few needed
   are redeclared here from the same theme variables .dtp reads, with the same
   fallbacks, so the modal tracks the theme rather than a frozen hex.
   Arrows are hidden: the lightbox holds one video, so prev/next are dead controls. */
.glightbox-container {
  --dtp-navy: var(--bs-heading-color-hex, #1e2d3b);
  --dtp-blue: var(--bs-primary-hex, #0072bc);
  --dtp-yellow: var(--bs-warning-hex, #ffd240);
  --dtp-radius: var(--bs-border-radius, 10px);
}
.glightbox-container .goverlay {
  background: rgba(30, 45, 59, .94) !important;
  background: color-mix(in srgb, var(--dtp-navy) 94%, transparent) !important;
  backdrop-filter: blur(4px);
}
.glightbox-container .gslide-media {
  border-radius: var(--dtp-radius) !important;
  overflow: hidden !important;
  background: #000 !important;
  box-shadow: 0 40px 90px rgba(0, 0, 0, .55), 0 0 0 1px rgba(255, 255, 255, .10) !important;
}
.glightbox-container .gprev,
.glightbox-container .gnext { display: none !important; }
.glightbox-container .gclose {
  top: 22px !important; right: 22px !important;
  width: 44px !important; height: 44px !important;
  background: var(--dtp-yellow) !important;
  border-radius: 999px !important;
  opacity: 1 !important;
  transition: transform .2s cubic-bezier(.2, .7, .3, 1), box-shadow .2s;
}
.glightbox-container .gclose:hover { transform: scale(1.08); box-shadow: 0 8px 22px rgba(0, 0, 0, .4); }
.glightbox-container .gclose:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.glightbox-container .gclose svg { width: 18px !important; height: 18px !important; }
.glightbox-container .gclose svg path { fill: var(--dtp-navy) !important; }
.glightbox-container .gloader { border-color: var(--dtp-blue) transparent transparent !important; }
@media (prefers-reduced-motion: reduce) {
  .glightbox-container .gclose { transition: none; }
  .glightbox-container .gclose:hover { transform: none; }
}

/* --------------------------------------------------------------------------
   Responsive audit 2026-10-04, item M1 — panel matrix under 1280px.
   Measured: the first column floors at 150px, narrower than the longest substance name
   (136.8px at 15px + 40px padding), and the 22px panel headers hyphen-wrap once a column
   drops under ~100px — at 1024 (613px matrix) and in the two-column band from 821px, where
   the matrix is only 455–530px wide. Under 576px the live theme (index.styles.css, @layer
   zoe) already restyles this component with !important: 125px first column, 16px headers,
   9px sub-labels, 12px names, full-bleed.
   1. One set of tracks for the whole matrix: the matrix becomes the grid and every row
      subgrids its columns, so the first column is as wide as the longest name in ANY row
      (a longer MIGX name widens it instead of overflowing) and all rows stay aligned. The
      header row and the foot span all tracks; the foot is inline-size contained so its
      text does not take part in track sizing. Headers never break at
      a hyphen; header side padding drops to 5px so "Adds methadone" fits one line at 1024.
   2. The text + matrix layout stays one column up to 1023px (the design's 820px step gave
      the matrix 455–530px); 576–659px matrices use 18px headers and 11px sub-labels.
   3. Under 576px five columns cannot fit a phone legibly, so the matrix scrolls sideways
      with the substance column and the status foot pinned. The substance column is 131px
      (the theme's 12px names), so the panel area is the viewport minus 133px; the panel
      columns are sized per viewport band so the column cut by the right edge always shows
      at least 10px and hides at least 10px, never a sliver. From 469px all four fit.
   The two values the theme sets with !important on the rows (column template, 9px
   sub-labels) are overridden in @layer dtp-matrix: protocols.css is linked before
   index.styles.css, so this is the first declared layer and its !important outranks the
   theme's. Everything else is an ordinary rule. 1280px and up is untouched. Browsers
   without subgrid drop that declaration and keep today's per-row columns.
   -------------------------------------------------------------------------- */
@media (max-width:1279px){
  .dtp-matrix{display:grid;grid-template-columns:minmax(max-content,1.3fr) repeat(4,minmax(0,1fr))}
  .dtp-matrix__head,.dtp-matrix__row{grid-template-columns:subgrid;grid-column:1/-1}
  .dtp-matrix__foot{grid-column:1/-1;contain:inline-size} /* spans every track; containment keeps its one-line text out of track sizing */
  .dtp-matrix__col{padding:12px 5px}
  .dtp-matrix__col strong{white-space:nowrap}
}
@media (min-width:821px) and (max-width:1023px){.dtp-panels__grid{grid-template-columns:1fr}}
@media (min-width:576px) and (max-width:659px){.dtp-matrix__col strong{font-size:18px}.dtp-matrix__col small{font-size:11px}}
@media (max-width:575px){
  .dtp-matrix{overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;container-type:inline-size;grid-template-columns:max-content repeat(4,88px)}
  .dtp-matrix__corner,.dtp-matrix__sub{position:sticky;left:0;z-index:1;background:#fff;box-shadow:1px 0 0 var(--c-border)}
  /* The corner is bottom-aligned by its base rule; stretch it so the sticky cell covers the whole header row and scrolled headers cannot show above the label. */
  .dtp-matrix__corner{background:var(--c-light);align-self:stretch;display:flex;align-items:flex-end}
  .dtp-matrix__row[data-code="THC"] .dtp-matrix__sub{background:#fffbea}
  .dtp-matrix.thc-off .dtp-matrix__row[data-code="THC"] .dtp-matrix__sub{background:#fafafa}
  .dtp-matrix__foot{position:sticky;left:0;justify-self:start;width:100cqi} /* the matrix's own inline size: the visible width whatever the scrollbars */
}
@media (min-width:385px) and (max-width:404px){.dtp-matrix{grid-template-columns:max-content repeat(4,80px)}}
@media (min-width:405px) and (max-width:440px){.dtp-matrix{grid-template-columns:max-content repeat(4,84px)}}
@media (min-width:441px) and (max-width:468px){.dtp-matrix{grid-template-columns:max-content repeat(4,90px)}}
@media (min-width:469px) and (max-width:575px){.dtp-matrix{grid-template-columns:max-content repeat(4,minmax(84px,1fr))}}
@layer dtp-matrix{
  @media (max-width:575px){
    .dtp-matrix__head,.dtp-matrix__row{grid-template-columns:subgrid!important}
    .dtp-matrix__col small{font-size:10.5px!important}
  }
}