/* Illustrate the existing LP: color communicates the subject and the sequence. */
.wb-diagram{display:block;width:80px;height:80px;flex:none;overflow:visible;color:var(--diagram-ink,#268977)}
.editorial-value-grid article{position:relative;background:#f0f8f2;border:1px solid #d3e8d8;border-radius:20px;padding:24px!important;min-width:0;overflow:hidden}
.editorial-value-grid article:nth-child(2){background:#eef8fc;border-color:#d3e8f1;--diagram-ink:#3b8bae}
.editorial-value-grid article:nth-child(3){background:#fff5e5;border-color:#f5dfb7;--diagram-ink:#cc8a18}
.editorial-value-grid article>.wb-diagram{width:76px;height:76px;padding:10px;box-sizing:border-box;border-radius:50%;background:#fff;margin-bottom:18px}
.editorial-value-grid article>span{position:absolute;right:20px;top:20px;font-size:42px;line-height:1;color:#458c6c30}
.editorial-value-grid h4{font-size:20px;line-height:1.5;margin-top:0}
.editorial-value-grid p{font-size:15px;line-height:1.85}
.editorial-value-grid{gap:18px}
.editorial-value{padding:36px}
/* DNA = sky blue; current gut environment = fresh green. */
.compare-table thead th:nth-child(2){background:#3c90af}
.compare-table thead th:nth-child(3){background:#4a9c67}
.compare-table thead .wb-diagram{width:66px;height:66px;margin:0 auto 9px;color:#fff}
.compare-table thead th:not(:first-child){text-align:center;padding-block:22px;font-size:20px}
.compare-table tbody td:nth-child(2){background:#f0f9fd}
.compare-table tbody td:nth-child(3){background:#f1faee}
.compare-table tbody tr:nth-child(even) td:nth-child(2){background:#e5f3fb}
.compare-table tbody tr:nth-child(even) td:nth-child(3){background:#e8f4e3}
.banner-insights{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0;border:0;margin:14px 0}
.banner-insights p{position:relative;display:flex;flex-direction:column;align-items:flex-start;padding:12px 14px!important;margin:0!important;border:1px solid #bedde9;border-radius:14px;background:#eff9fff2;box-shadow:0 4px 10px #366f8808;min-width:0}
.banner-insights p+ p{background:#f0f9e9f2;border-color:#c5dfb9;--diagram-ink:#529647}
.banner-insights .wb-diagram{width:32px;height:32px;margin-bottom:6px;color:#378ba9}
.banner-insights p+ p .wb-diagram{color:#529647}
.banner-insights span{font-weight:800;color:#34758c;font-size:12px;margin-bottom:4px}
.banner-insights p+ p span{color:#4f8142}
.banner-insights strong{font-size:15px;line-height:1.45;color:#315d6a}
.banner-insights p+ p strong{color:#416b38}
/* A large, colored icon makes each step understandable before reading. */
#flow .steps{gap:22px}
#flow .step{position:relative;padding:24px 18px;background:linear-gradient(180deg,#eaf5fc 0 137px,#fff 137px);border:1px solid #cde3ef;border-radius:20px}
#flow .step:nth-child(2){background:linear-gradient(180deg,#fff3dc 0 137px,#fff 137px);border-color:#efdeb9;--diagram-ink:#d19a28}
#flow .step:nth-child(3){background:linear-gradient(180deg,#edf6e6 0 137px,#fff 137px);border-color:#d7e6c8;--diagram-ink:#6c9d44}
#flow .step:nth-child(4){background:linear-gradient(180deg,#e5f6f1 0 137px,#fff 137px);border-color:#c8e4da;--diagram-ink:#278b75}
#flow .step-count{display:block;text-align:center;font-size:11px;letter-spacing:.14em;margin-bottom:8px;background:none;padding:0}
#flow .step>.wb-diagram{width:80px;height:80px;margin:0 auto 30px;--diagram-ink:#398eac}
#flow .step:nth-child(2)>.wb-diagram{--diagram-ink:#d19a28}
#flow .step:nth-child(3)>.wb-diagram{--diagram-ink:#6c9d44}
#flow .step:nth-child(4)>.wb-diagram{--diagram-ink:#278b75}
#flow .step h3{text-align:center;font-size:20px;line-height:1.5}
#flow .step p{text-align:center;font-size:14px;line-height:1.8}
/* Same three reason rows, with subject colors and illustrations. */
.reasons-list{display:grid;gap:16px}
.reason-item{grid-template-columns:100px minmax(0,1fr);gap:24px;align-items:center;min-height:0;border:1px solid #d7e9cf!important;border-radius:20px;background:linear-gradient(105deg,#e8f4df 0 124px,#f8fcf4 124px);padding:25px!important}
.reason-item:nth-child(2){border-color:#cce5ef!important;background:linear-gradient(105deg,#e2f2fa 0 124px,#f4fbfe 124px)}
.reason-item:nth-child(3){border-color:#cbe6dd!important;background:linear-gradient(105deg,#ddf2e9 0 124px,#f2fbf7 124px)}
.reason-count{padding:0;color:#619c42!important}
.reason-item:nth-child(2) .reason-count{color:#3888a7!important}
.reason-item:nth-child(3) .reason-count{color:#23866b!important}
.reason-count strong{font-size:38px;line-height:1.2;font-weight:700}
.reason-count span{font-size:10px;letter-spacing:.12em}
.reason-count .wb-diagram{width:68px;height:68px;margin-top:7px;color:inherit}
.reason-item h4{font-size:20px;line-height:1.55}
.reason-item p{font-size:15px;line-height:1.8}
.reasons-aside{border-left:0;padding-left:0}
.reasons-aside h3{line-height:1.55}
/* Match plan colors to the comparison and the support sequence. */
#sets .product-card .popular{align-self:stretch;max-width:none;margin:0;padding:12px 20px;border-radius:0;background:#dff0d3;color:#3b7032;text-align:center;font-size:13px}
#sets #set-dna14 .popular{background:#dceff8;color:#347b98}
#sets #set-premium .popular{background:#2d8d72;color:#fff}
#sets .product-header{background:linear-gradient(180deg,#f1f9ea,#fff 70%)}
#sets #set-dna14 .product-header{background:linear-gradient(180deg,#eef8fd,#fff 70%)}
#sets #set-premium .product-header{background:linear-gradient(180deg,#eaf8f2,#fff 70%)}
#sets .product-card .kit-shot{background:radial-gradient(ellipse at center,#fff 32%,#eaf5e3);border:0;border-radius:16px}
#sets #set-dna14 .kit-shot{background:radial-gradient(ellipse at center,#fff 32%,#e4f2fa)}
#sets #set-premium .kit-shot{background:radial-gradient(ellipse at center,#fff 32%,#e3f4ee)}
#sets .plan-scene{height:180px}
#sets .plan-scene img{filter:saturate(1.02) brightness(1.025)}
#sets .trial-concept{border:1px solid #efcda1!important;background:linear-gradient(105deg,#fff,#fffaf1)!important}
#sets .trial-chip{display:inline-block;padding:5px 9px;background:#fff0d4;border-radius:6px;color:#a16514;font-weight:800}
#sets .trial-scene{border-radius:0 70px 70px 0}
@media(min-width:1001px){
 .family-banner-photo{width:min(600px,59%)}
 .family-banner-photo img{object-fit:cover;object-position:center 8%;-webkit-mask-image:linear-gradient(90deg,transparent,#000 22%);mask-image:linear-gradient(90deg,transparent,#000 22%)}
 .family-banner-photo:after{background:linear-gradient(90deg,var(--hero-surface),color-mix(in srgb,var(--hero-surface) 60%,transparent) 10%,transparent 37%),linear-gradient(0deg,var(--hero-surface),transparent 8%)}
 .slide-family .banner-copy{width:49%}
 .slide-analysis .banner-copy{width:49%}
 .banner-kit-display{border:1px solid #ffffffdd;border-radius:22px;background:#fffffff0;box-shadow:0 12px 32px #294b3320}
}
@media(min-width:701px) and (max-width:1000px){
 .banner-insights p{padding:9px!important}.banner-insights strong{font-size:13px}.banner-insights .wb-diagram{width:26px;height:26px}
 .reason-item{grid-template-columns:74px minmax(0,1fr);gap:18px;padding:20px!important;background:#f5faef}
 .reason-item:nth-child(2){background:#f0f9fd}.reason-item:nth-child(3){background:#eff9f4}
 .reason-count .wb-diagram{width:60px;height:60px}
}
@media(max-width:700px){
 .editorial-value{padding:28px 20px}
 .editorial-value-grid article{padding:20px!important}
 .editorial-value-grid article>.wb-diagram{width:64px;height:64px;margin-bottom:14px}
 .compare-table thead .wb-diagram{width:45px;height:45px;margin-bottom:5px}
 .compare-table thead th:not(:first-child){font-size:15px;padding:14px 8px}
 .banner-insights{gap:8px;margin:10px 0}
 .banner-insights p{padding:8px 10px!important}
 .banner-insights .wb-diagram{width:26px;height:26px;margin-bottom:3px}
 .banner-insights span{font-size:10px;margin-bottom:3px}
 .banner-insights strong{font-size:13px;line-height:1.45}
 #flow .step{padding:20px 18px;background:linear-gradient(180deg,#eaf5fc 0 128px,#fff 128px)}
 #flow .step>.wb-diagram{width:70px;height:70px;margin-bottom:28px}
 #flow .step h3{font-size:20px}
 .reason-item{grid-template-columns:64px minmax(0,1fr);gap:16px;padding:20px 16px!important;background:#f5faef}
 .reason-item:nth-child(2){background:#f0f9fd}.reason-item:nth-child(3){background:#eff9f4}
 .reason-count{align-self:start}
 .reason-count strong{font-size:32px}
 .reason-count .wb-diagram{width:54px;height:54px}
 .reason-item h4{font-size:18px}
 .reason-item p{font-size:14px;line-height:1.85}
 #sets .trial-scene{border-radius:0}
 #sets .plan-scene{height:180px}
 #sets .product-card .popular{margin:0;padding:10px 18px;font-size:12px}
}