/* Read one approach at a time; secondary detail is available on demand. */
#compare .comparison-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
#compare .comparison-card{display:flex;flex-direction:column;min-width:0;padding:28px;border:1px solid #d5dfd6;border-radius:18px;background:#fff}
#compare .comparison-card h3{min-height:3em;margin:0 0 12px;font-size:22px;line-height:1.45;letter-spacing:-.025em;color:#1a2c22}
#compare .comparison-card dl{margin:0}
#compare .comparison-card dl>div{padding:16px 0;border-top:1px solid #e2e9e1}
#compare .comparison-main>div{min-height:104px}
#compare .comparison-card dt{margin-bottom:6px;color:#586b5e;font-size:12px;font-weight:600;line-height:1.5}
#compare .comparison-card dd{margin:0;color:#243b2d;font-size:16px;line-height:1.65;overflow-wrap:anywhere}
#compare .comparison-card dd b{font-weight:700}
#compare .comparison-extra{margin-top:auto;padding-top:16px}
#compare .comparison-extra summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;cursor:pointer;list-style:none;color:#28573b;font-size:13px;font-weight:600;line-height:1.5}
#compare .comparison-extra summary::-webkit-details-marker{display:none}
#compare .comparison-extra summary:after{content:'+';display:grid;place-items:center;flex:none;width:32px;height:32px;border:1.5px solid currentColor;border-radius:50%;font-size:20px;font-weight:400;line-height:1;transition:transform .25s cubic-bezier(.2,.8,.2,1),background-color .2s,color .2s}
@media(hover:hover){#compare .comparison-extra summary:hover:after{transform:rotate(90deg);background:#28573b;color:#fff}}
#compare .comparison-extra summary:focus-visible:after{background:#28573b;color:#fff}
#compare .comparison-extra[open] summary:after{content:'−';transform:none}
#compare .comparison-extra[open] dl{animation:compare-reveal .3s cubic-bezier(.2,.8,.2,1)}
/* Draw the eye to the expander: a few soft pulses each time the cards scroll into view, until someone opens one. */
#compare .comparison-card.compare-hint .comparison-extra:not([open]) summary:after{animation:compare-plus 1.6s cubic-bezier(.2,.8,.2,1) 3 both}
#compare .comparison-card.compare-hint:nth-child(2) .comparison-extra summary:after{animation-delay:.18s}
#compare .comparison-card.compare-hint:nth-child(3) .comparison-extra summary:after{animation-delay:.36s}
@keyframes compare-plus{0%{box-shadow:0 0 0 0 rgba(54,126,90,.7);transform:scale(1)}18%{transform:scale(1.14)}36%{transform:scale(1)}70%,100%{box-shadow:0 0 0 12px rgba(54,126,90,0)}}
@keyframes compare-reveal{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
#compare .comparison-extra summary:focus-visible{outline:2px solid #126d58;outline-offset:4px;border-radius:3px}
#compare .comparison-extra dl>div{padding:14px 0}
#compare .comparison-extra dd{font-size:14px}
#compare .comparison-card--wins{background:#10271b;border-color:#367e5a}
#compare .comparison-card--wins h3{color:#fff}
#compare .comparison-card--wins dt{color:#b4d1bd}
#compare .comparison-card--wins dd{color:#e2f0e5}
#compare .comparison-card--wins dd b{color:#8df0bf}
#compare .comparison-card--wins dl>div{border-color:#365840}
#compare .comparison-card--wins summary{color:#b8edcb}
#compare .comparison-card--wins summary:focus-visible{outline-color:#8df0bf}
@media(hover:hover){#compare .comparison-card--wins .comparison-extra summary:hover:after{background:#8df0bf;color:#10271b}}
#compare .comparison-card--wins .comparison-extra summary:focus-visible:after{background:#8df0bf;color:#10271b}
#compare .comparison-card--wins.compare-hint .comparison-extra:not([open]) summary:after{animation-name:compare-plus-dark}
@keyframes compare-plus-dark{0%{box-shadow:0 0 0 0 rgba(141,240,191,.5);transform:scale(1)}18%{transform:scale(1.14)}36%{transform:scale(1)}70%,100%{box-shadow:0 0 0 12px rgba(141,240,191,0)}}
@media(prefers-reduced-motion:reduce){
 #compare .comparison-extra summary:after,#compare .comparison-extra[open] dl{animation:none!important;transition:none}
}
@media(max-width:900px){
 #compare .comparison-cards{grid-template-columns:1fr;gap:16px}
 #compare .comparison-card{padding:24px}
 #compare .comparison-card h3{min-height:0;margin-bottom:18px;font-size:23px}
 #compare .comparison-main>div{min-height:0}
 #compare .comparison-card dl>div{display:grid;grid-template-columns:90px minmax(0,1fr);gap:16px;padding:14px 0}
 #compare .comparison-card dt{margin:3px 0 0}
 #compare .comparison-extra{padding-top:8px}
}
@media(max-width:420px){
 #compare .comparison-card{padding:22px}
 #compare .comparison-card dl>div{grid-template-columns:1fr;gap:4px}
 #compare .comparison-card dt{margin:0}
 #compare .comparison-card dd{font-size:15px}
}