/* Five pigment surfaces accumulate as the reader explores each learning purpose. */
.why-learn{--why-accent:#214f45;margin:0 0 52px;padding:30px 34px 24px;background:#e5ece5;border-block:1px solid #a4b9ac;color:#183c32;scroll-margin-top:112px}
.why-heading{display:flex;justify-content:space-between;align-items:center;gap:22px}
.why-heading h3{font-family:var(--font-display);font-size:clamp(25px,2.4vw,32px);font-weight:600;line-height:1.6;letter-spacing:-.045em}
.why-heading>p{font-size:.875rem;line-height:1.8;color:#486456}
.why-heading>p strong{color:#204c3c;font-weight:700}
.why-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));max-width:540px;margin-top:23px;border-bottom:1px solid #a4b9ac}
.why-tabs button{min-height:48px;padding:10px 12px;border:0;border-bottom:2px solid transparent;background:transparent;color:#3c594c;font-size:1rem;font-weight:500}
.why-tabs button[aria-selected="true"]{border-bottom-color:#214f45;background:#d3e1d6;color:#143e34;font-weight:750}
.why-tabs button:hover{background:#d9e5dc}
.why-topic{--why-accent:#214f45}
.why-topic[data-why-id="cinema"]{--why-accent:#375975}
.why-topic[data-why-id="davinci"]{--why-accent:#565472}
.why-topic[data-why-id="font"]{--why-accent:#665341}
.why-topic-name{font-size:1.125rem;line-height:1.7;margin-top:25px}
.why-learn.is-ready .why-topic-name{display:none}
.why-benefit{font-size:1.125rem;line-height:1.85;font-weight:550;max-width:52em;margin-top:23px;letter-spacing:-.025em}
.why-explorer{display:grid;grid-template-columns:270px minmax(0,1fr);gap:40px;align-items:center;margin-top:25px}
.why-plot{width:270px;max-width:100%;aspect-ratio:1}
.why-center{position:relative;isolation:isolate;display:grid;place-items:center;width:100%;height:100%;padding:0;border:0;border-radius:50%;background:transparent;color:#fffefa;cursor:pointer;transition:transform .2s}
.why-rings{position:absolute;inset:0;pointer-events:none}
.why-ring{--ring-pigment:#bc595d;position:absolute;inset:0;border:2px solid #e5ece5;border-radius:50%;background:#d4ddd2;transition:background-color .35s}
.why-ring:nth-child(2){--ring-pigment:#d8b84b;inset:5.5%;background:#e0e6da}
.why-ring:nth-child(3){--ring-pigment:#39866a;inset:11%}
.why-ring:nth-child(4){--ring-pigment:#397c9e;inset:16.5%;background:#e0e6da}
.why-ring:nth-child(5){--ring-pigment:#816393;inset:22%}
.why-ring.is-filled{background:var(--ring-pigment)}
.why-center-face{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:40%;height:40%;min-width:5.75rem;min-height:5.75rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border:2px solid #e5ece5;border-radius:50%;background:#163f36;transition:background-color .2s}
.why-center-word{font-family:var(--font-display);font-size:2rem;line-height:1.2;letter-spacing:-.05em}
.why-center-hint{font-size:.875rem;font-weight:650;line-height:1.6;white-space:nowrap}
.why-center:active{transform:scale(.97)}
@media(hover:hover) and (pointer:fine){.why-center:hover{transform:scale(1.025)}.why-center:hover .why-center-face{background:#256151}}
.why-reader{min-width:0}
.why-position{display:flex;align-items:baseline;gap:17px;color:#466256;font-size:.8125rem;line-height:1.8}
.why-count{font-variant-numeric:tabular-nums;letter-spacing:.08em}
.why-phase{font-size:.875rem;font-weight:650;color:var(--why-accent)}
.why-live{min-height:160px;margin-top:11px}
.why-question{font-size:clamp(20px,2vw,25px);line-height:1.6;font-weight:600;letter-spacing:-.045em;max-width:31em}
.why-answer{font-size:1rem;line-height:1.95;color:#3a574b;margin-top:13px;max-width:44em}
.why-controls{display:flex;justify-content:flex-start;flex-wrap:wrap;gap:8px;margin-top:20px}
.why-controls button{display:inline-flex;align-items:center;justify-content:center;gap:11px;min-height:50px;padding:11px 16px;border:1px solid #537263;border-radius:3px;background:#fffefa;color:#204c3c;font-size:.875rem;font-weight:700;line-height:1.6;transition:background-color .2s,border-color .2s}
.why-control-icon{width:22px;height:22px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.why-controls .why-next{background:#163f36;border-color:#163f36;color:#fffefa}
.why-controls button:disabled{border-color:#becdc0;background:#dce4d9;color:#6b7c70;cursor:default}
.why-controls .why-previous:not(:disabled):hover{background:#d3e1d6}
.why-controls .why-next:hover{background:#256151;border-color:#256151}
.why-footer{display:flex;align-items:baseline;flex-wrap:wrap;gap:10px 25px;margin-top:22px;padding-top:9px;border-top:1px solid #a4b9ac}
.why-reading{flex:1 1 230px;min-width:0}
.why-reading[open]{flex-basis:100%}
.why-reading>summary{display:flex;align-items:center;justify-content:flex-start;gap:15px;min-height:48px;padding:7px 0;font-size:.875rem;line-height:1.75;list-style:none;cursor:pointer;color:#3b5a4a}
.why-reading>summary::-webkit-details-marker{display:none}.why-reading>summary::marker{content:""}
.why-reading>summary .disclosure-mark{width:23px;height:23px}
.why-reading[open]>summary .disclosure-mark:after{transform:rotate(0)}
.why-sequence{padding:8px 0 12px;margin:0;list-style:none}
.why-sequence>li{display:grid;grid-template-columns:29px minmax(0,1fr);gap:20px;padding:19px 0;border-top:1px solid #bfcdc1}
.why-sequence-number{font-size:.8125rem;line-height:2;color:#527461;font-variant-numeric:tabular-nums}
.why-sequence h5{font-size:1rem;font-weight:650;line-height:1.8;margin:0}
.why-sequence p{font-size:1rem;line-height:1.9;color:#3a574b;margin-top:8px;max-width:60em}
.why-links{display:flex;flex-wrap:wrap;gap:10px 21px;align-items:baseline}
.why-links a{display:inline-flex;align-items:center;min-height:44px;font-size:.875rem;line-height:1.8;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px;text-decoration-color:#789887}
.why-course{font-weight:650;color:#204c3c}.why-source{font-weight:400;color:#486456}
.why-links a:hover{text-decoration-thickness:2px;text-decoration-color:currentColor}
.why-common{border-top:1px solid #a4b9ac;margin-top:18px;padding-top:18px;font-size:.875rem;color:#4b6657;line-height:1.9}
.why-common strong{font-weight:600;color:#204c3c;margin-left:12px}
.why-learn:not(.is-ready) .why-topic+.why-topic{border-top:1px solid #a4b9ac;margin-top:20px;padding-top:5px}
@media(max-width:900px){.why-learn{padding-inline:26px}.why-explorer{grid-template-columns:230px minmax(0,1fr);gap:26px}.why-plot{width:230px}.why-live{min-height:190px}.why-center-word{font-size:1.7rem}.why-heading>p br{display:none}.why-heading>p{max-width:240px}}
@media(max-width:600px){
 .why-learn{padding:23px 20px 21px;margin-bottom:35px}
 .why-heading{display:block}.why-heading h3{font-size:25px;line-height:1.55}.why-heading>p{margin-top:9px;font-size:.875rem;max-width:none}.why-heading>p br{display:none}
 .why-tabs{margin-top:17px;max-width:none}.why-tabs button{font-size:.875rem;min-height:46px;padding:9px 5px}
 .why-benefit{font-size:1rem;line-height:1.85;margin-top:19px}
 .why-explorer{grid-template-columns:minmax(0,1fr);gap:23px;margin-top:22px;align-items:start}
 .why-plot{width:clamp(220px,58vw,250px);justify-self:center}
 .why-center-word{font-size:1.7rem}.why-center-hint{font-size:.875rem}
 .why-position{gap:16px}.why-count{font-size:.875rem}.why-phase{font-size:.9375rem}
 .why-live{min-height:0;margin-top:9px}.why-question{font-size:21px;line-height:1.65}.why-answer{margin-top:12px;font-size:1rem;line-height:1.9}
 .why-controls{margin-top:19px;gap:8px}.why-controls button{padding:11px 13px;gap:9px}
 .why-footer{margin-top:20px;gap:0;padding-top:5px}.why-reading{flex-basis:100%}.why-links{gap:8px 20px}.why-links a{font-size:.875rem}
 .why-sequence>li{grid-template-columns:23px minmax(0,1fr);gap:10px;padding-block:16px}
 .why-common{margin-top:14px;padding-top:15px;font-size:.875rem}.why-common strong{display:block;margin-left:0;margin-top:3px}
}
@media(max-width:360px){.why-learn{padding-inline:17px}.why-heading h3{font-size:23px}.why-question{font-size:20px}}
@media(prefers-reduced-motion:reduce){.why-ring,.why-center,.why-center-face,.why-controls button{transition:none}.why-center:hover,.why-center:active{transform:none}}
@media(forced-colors:active){.why-learn{background:Canvas;color:CanvasText;border-color:CanvasText}.why-center-face{background:ButtonFace;color:ButtonText;border-color:ButtonText}.why-ring{background:Canvas!important;border-color:GrayText}.why-ring.is-filled{border-color:Highlight;border-width:4px}.why-tabs button[aria-selected="true"]{background:Highlight;color:HighlightText;border-color:Highlight}.why-answer,.why-benefit,.why-question,.why-heading>p,.why-heading>p strong,.why-phase,.why-common,.why-common strong,.why-sequence p{color:CanvasText}.why-links a{color:LinkText}.why-controls button,.why-controls .why-next{background:ButtonFace;color:ButtonText;border-color:ButtonText}.why-controls button:disabled{color:GrayText;border-color:GrayText}}
@media print{.why-learn{background:white;padding:20px;color:#102b35;break-inside:auto}.why-tabs,.why-explorer,.why-links,.why-common{display:none!important}.why-topic[hidden]{display:block!important}.why-learn.is-ready .why-topic-name{display:block}.why-topic{margin-top:20px;break-inside:avoid}.why-sequence{display:block!important}.why-reading{display:block}.why-reading>summary{font-weight:600}}