/* Watercolour bookmarks: the five teaching strengths, without descriptions. */
#why.ps-strengths{background:#faf7f0}
#why.ps-strengths .h2{color:#315345}
#why .ps-strength-folds{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;max-width:980px;margin:48px auto 10px;padding:10px 0 25px;perspective:1100px;isolation:isolate}
#why .ps-strength-leaf{position:relative;min-width:0;min-height:358px;margin:0;background:#fffefa;box-shadow:0 9px 18px -14px #514c3577,1px 0 0 #d7d1bd70;transform:translateY(var(--leaf-offset)) rotate(var(--leaf-angle));transform-origin:50% 10%;transition:transform .7s cubic-bezier(.22,.8,.25,1),box-shadow .7s;overflow:hidden}
#why .ps-strength-leaf:before{content:"";position:absolute;top:0;left:0;width:100%;height:4px;background:#9ca78b;opacity:.7}
#why .ps-strength-leaf:nth-child(even):before{background:#b4614a}
#why .ps-strength-leaf:after{content:"";position:absolute;top:0;bottom:0;right:0;width:8px;background:linear-gradient(90deg,transparent,#d6d0ba19);pointer-events:none}
#why .ps-strength-leaf img{display:block;width:calc(100% - 10px);max-width:160px;height:auto;aspect-ratio:1;object-fit:contain;margin:18px auto 0;mix-blend-mode:multiply}
#why .ps-strength-leaf h3{writing-mode:vertical-rl;margin:15px auto 26px;min-height:156px;font-family:'Noto Serif TC','Songti TC',serif;font-size:22px;font-weight:500;line-height:1.5;letter-spacing:.16em;color:#344e3c}
#why .ps-strength-leaf.is-unfolding{animation:ps-strength-unfold 1100ms cubic-bezier(.16,.8,.25,1) var(--leaf-delay) both}
@keyframes ps-strength-unfold{from{opacity:.2;transform:perspective(600px) translateX(-16px) rotateY(55deg) rotate(-5deg)}to{opacity:1;transform:translateY(var(--leaf-offset)) rotate(var(--leaf-angle))}}
[data-langroot="en"] #why .ps-strength-leaf h3{writing-mode:horizontal-tb;min-height:0;margin:20px 14px 30px;text-align:center;font-size:19px;line-height:1.5;letter-spacing:0;overflow-wrap:break-word}
@media(hover:hover) and (pointer:fine){
  #why .ps-strength-leaf:hover{transform:translateY(-11px) rotate(0deg);box-shadow:0 16px 24px -18px #514c3590}
}
@media(max-width:620px){
  #why .ps-strength-folds{grid-template-columns:repeat(6,minmax(0,1fr));gap:20px 12px;max-width:440px;margin-top:35px;padding-bottom:20px}
  #why .ps-strength-leaf{grid-column:span 2;min-height:236px}
  #why .ps-strength-leaf:nth-child(4){grid-column:2/span 2}
  #why .ps-strength-leaf:nth-child(5){grid-column:4/span 2}
  #why .ps-strength-leaf img{margin-top:12px}
  #why .ps-strength-leaf h3{font-size:18px;min-height:130px;margin-top:9px;margin-bottom:22px}
  [data-langroot="en"] #why .ps-strength-folds{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 14px}
  [data-langroot="en"] #why .ps-strength-leaf{grid-column:auto;min-height:236px}
  [data-langroot="en"] #why .ps-strength-leaf:last-child{grid-column:1/-1;width:calc((100% - 14px)/2);justify-self:center}
  [data-langroot="en"] #why .ps-strength-leaf h3{margin:14px 10px 24px;font-size:17px;line-height:1.45}
}
@media(prefers-reduced-motion:reduce){
  #why .ps-strength-leaf,#why .ps-strength-leaf.is-unfolding{animation:none;transition:none}
  #why .ps-strength-leaf:hover{transform:translateY(var(--leaf-offset)) rotate(var(--leaf-angle))}
}
