/* HSP / sensitivity: distinct sensory ripples rather than a grid of puzzle pieces. */
.guide-theme[data-guide-theme="sensitivity"]{
 --theme-ink:#3f6263;--theme-accent:#7babb0;--theme-glow:#e8f3f2;
 --theme-pale:#f2f8f7;--theme-border:#d7e7e5;--theme-warm:#d8c8a4;
}
.guide-theme[data-guide-theme="sensitivity"] .intro-hero{
 background:
 radial-gradient(ellipse 43% 72% at 88% 44%,#dcefebba,transparent 82%),
 radial-gradient(ellipse 44% 74% at 28% 104%,#f2efe6,transparent 85%),
 linear-gradient(135deg,#fffefa,#f0f7f6 73%,#f8f7f3);
}
.guide-theme[data-guide-theme="sensitivity"] .intro-hero h1{max-width:68%;color:#3c6063}
.guide-theme[data-guide-theme="sensitivity"] .intro-hero .intro-copy{max-width:65%;line-height:2.16}
.hsp-visual{position:absolute;z-index:1;top:50%;right:-3%;width:min(46%,460px);transform:translateY(-50%);pointer-events:none}
.hsp-visual img{display:block;width:100%;height:auto}
.hsp-hero-note{display:inline-flex;align-items:center;gap:9px;position:relative;z-index:3;border:1px solid #c8e0da;background:#fffefaaf;border-radius:30px;padding:7px 15px;margin-top:22px;font:500 11px/1.7 var(--font-body);color:#618f91}
.hsp-hero-note:before{content:"";width:7px;height:7px;border-radius:50%;background:#c8b48e}
.hsp-summary{background:linear-gradient(140deg,#eef7f4,#fff9ef);border:1px solid #dbe9e1;border-radius:18px;margin:30px 0;padding:28px clamp(20px,3vw,37px)}
.hsp-summary h2{font:600 clamp(22px,2.7vw,29px)/1.7 var(--font-heading);color:#456965;margin:0 0 12px}
.hsp-summary p{font-size:13px;line-height:2.14;color:#607a77;margin:0}
.hsp-jump{display:flex;gap:10px;flex-wrap:wrap;margin-top:21px}
.hsp-jump a{padding:8px 15px;border-radius:24px;background:#fffefa;border:1px solid #cfded7;color:#477c79;font-size:11px;text-decoration:none}
.hsp-jump a:hover{background:#edf7f3}
.hsp-traits{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:24px 0}
.hsp-trait{border:1px solid #dae8e5;border-radius:16px;background:#fffefa;padding:22px 18px;min-height:208px;display:flex;flex-direction:column}
.hsp-trait:nth-child(2){background:linear-gradient(147deg,#f9fcfb,#eaf3f2)}
.hsp-trait:nth-child(3){background:linear-gradient(147deg,#fffdfa,#f8f3e9)}
.hsp-trait:nth-child(4){background:linear-gradient(147deg,#fffdfb,#f4eff5)}
.hsp-trait .hsp-symbol{width:53px;height:53px;display:grid;place-items:center;margin:0 0 10px}
.hsp-symbol svg{width:51px;height:51px}
.hsp-trait strong{font:600 18px/1.6 var(--font-heading);color:#426a66}
.hsp-trait p{font-size:11px;color:#67817a;line-height:1.95;margin:8px 0 0}
.hsp-story-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin-top:25px}
.hsp-story{display:flex;flex-direction:column;min-height:240px;padding:23px 22px;border:1px solid #d7e5e2;border-radius:16px;background:linear-gradient(145deg,#fffefa,#f5faf7)}
.hsp-story:nth-child(2){background:linear-gradient(145deg,#fffefa,#f0f8f8)}
.hsp-story:nth-child(3){background:linear-gradient(145deg,#fffefa,#faf3f2)}
.hsp-story small{font:700 10px Georgia,serif;letter-spacing:.13em;color:#8eaca8}
.hsp-story h3{font:600 20px/1.7 var(--font-heading);color:#456c68;margin:13px 0 10px}
.hsp-story p{font-size:12px;color:#6c817b;line-height:1.95;margin:0 0 18px;flex:1}
.hsp-story .read-more{font-size:11px;color:#4d817d;font-weight:700}
.hsp-story:hover{border-color:#93bab5;box-shadow:0 12px 32px #456c5f12}
.hsp-section{padding:29px 0 11px;scroll-margin-top:28px}
.hsp-section+.hsp-section{border-top:1px solid #e3ebe6;margin-top:17px}
.hsp-section h2{font:600 clamp(23px,2.8vw,29px)/1.65 var(--font-heading);color:#3e6463;margin:0 0 16px}
.hsp-section h2::after{content:"";display:block;width:53px;height:3px;margin-top:14px;border-radius:5px;background:linear-gradient(90deg,#8bb8b1,#d7c2a0)}
.hsp-section p{font-size:13px;line-height:2.17;color:#576e68;margin:0 0 18px}
.hsp-tips{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:21px}
.hsp-tip{padding:24px 20px;border-radius:14px;border:1px solid #dbe8e3;background:#f5f9f7}
.hsp-tip:nth-child(2){background:#f7f7f2}.hsp-tip:nth-child(3){background:#f5f5f8}
.hsp-tip b{display:block;font:600 17px/1.7 var(--font-heading);color:#537873;margin-bottom:8px}
.hsp-tip p{font-size:12px;line-height:2;color:#71847c;margin:0}
.hsp-talk{display:grid;grid-template-columns:repeat(2,1fr);gap:15px;margin-top:26px}
.hsp-talk article{padding:24px;border-radius:15px;border:1px solid #dbe8e1;background:#f6faf5}
.hsp-talk article:nth-child(2){background:#f7f4ee;border-color:#e7ded0}
.hsp-talk h3{font:600 21px/1.65 var(--font-heading);color:#52766d;margin:0 0 11px}
.hsp-talk p{font-size:12px;color:#657d73;line-height:2;margin:0}
.hsp-related{display:flex;flex-wrap:wrap;gap:10px;margin:25px 0}
.hsp-related a{display:inline-flex;border:1px solid #d4e4dc;border-radius:27px;padding:9px 13px;color:#547c73;background:#fffefa;font-size:12px}
.hsp-related a:hover{background:#edf6f1}
.hsp-source{margin:22px 0;padding:18px 22px;background:#f3f7f4;border-left:3px solid #a8c6be;color:#698079;font-size:12px;line-height:2}
.hsp-source a{text-decoration:underline;text-underline-offset:4px}
.hsp-feature{display:grid;grid-template-columns:130px minmax(0,1fr);gap:23px;align-items:center;border:1px solid #d7e8e4;border-radius:17px;background:linear-gradient(130deg,#edf7f5,#fffaf2);padding:22px 27px}
.hsp-feature img{display:block;width:130px;height:auto}
.hsp-feature h3{font:600 21px/1.65 var(--font-heading);color:#466c68;margin:0 0 10px}
.hsp-feature p{font-size:12px;line-height:1.95;color:#6b817b;margin:0 0 10px}
.hsp-feature a{font-size:12px;font-weight:700;color:#4b817d;text-decoration:underline;text-underline-offset:4px}
.hsp-pullquote{padding:22px 28px;margin:24px 0;border-radius:12px;border:1px solid #d9e7e2;background:linear-gradient(130deg,#f0f8f5,#fffefa);color:#507671;font:600 17px/1.9 var(--font-heading)}
@media(max-width:1000px){.hsp-traits{grid-template-columns:repeat(2,1fr)}.hsp-visual{width:41%;opacity:.65}}
@media(max-width:760px){.hsp-story-grid{grid-template-columns:1fr}.hsp-story{min-height:150px}.hsp-tips{grid-template-columns:1fr}.hsp-visual{opacity:.35}}
@media(max-width:620px){.guide-theme[data-guide-theme="sensitivity"] .intro-hero h1,.guide-theme[data-guide-theme="sensitivity"] .intro-hero .intro-copy{max-width:100%}.hsp-visual{width:204px;right:-28px;top:73%;opacity:.15}.hsp-traits{gap:10px}.hsp-trait{padding:18px 14px;min-height:186px}.hsp-trait strong{font-size:16px}.hsp-trait .hsp-symbol{width:45px;height:45px}.hsp-symbol svg{width:43px;height:43px}.hsp-talk{grid-template-columns:1fr}.hsp-feature{grid-template-columns:85px 1fr;gap:13px;padding:18px}.hsp-feature img{width:85px}.hsp-feature h3{font-size:17px}.hsp-summary{padding:21px 18px}.hsp-jump a{font-size:10px;padding:7px 11px}.hsp-pullquote{font-size:15px;padding:18px 20px}}
@media(prefers-reduced-motion:reduce){.hsp-story{transition:none;transform:none!important}}
/* HSP subguide editorial rhythm. Headings use typography and fine lines;
   pastel boxes are reserved for examples and practical tips. */
.hsp-article-summary{margin-top:32px}
.hsp-article-hero .intro-copy{max-width:65%}
.hsp-article-prose{min-width:0}
.hsp-article-section{padding:0 0 8px;scroll-margin-top:24px}
.hsp-article-section + .hsp-article-section{margin-top:34px}
.guide-theme .hsp-article-prose .hsp-article-section > h2{
  position:relative;
  font:600 clamp(24px,2.45vw,30px)/1.7 var(--font-heading,"Shippori Mincho",serif);
  color:var(--theme-ink,#426966);
  background:none;
  border:0;
  border-bottom:1px solid var(--theme-border,#d7e7e5);
  padding:0 0 16px;
  margin:0 0 22px;
  letter-spacing:.02em;
}
.guide-theme .hsp-article-prose .hsp-article-section > h2:after{
  content:"";position:absolute;bottom:-2px;left:0;
  width:54px;height:3px;background:linear-gradient(90deg,#86b4ae,#dac8a6);border-radius:4px;
}
.hsp-article-tips{border-radius:14px;border:1px solid #dce9e5;background:linear-gradient(130deg,#f3f9f7,#fffefa);padding:19px 24px;margin:22px 0}
.hsp-article-tips b{font:600 15px/1.8 var(--font-heading);color:#4a7772}
.hsp-article-tips ul{margin:7px 0 0;padding-left:22px}
.hsp-article-tips li{font-size:12px;line-height:2;margin:5px 0;color:#5f7974}
.hsp-reading-layout{margin-top:38px}
.hsp-related-guides .hsp-story{min-height:170px}
@media(max-width:620px){
 .hsp-article-hero .intro-copy{max-width:100%}
 .hsp-article-summary{margin-top:22px}
 .hsp-article-section + .hsp-article-section{margin-top:28px}
 .guide-theme .hsp-article-prose .hsp-article-section > h2{font-size:23px}
 .hsp-article-tips{padding:16px 18px}
 .hsp-related-guides .hsp-story{min-height:140px}
}

/* Four HSP topics form a balanced 2-by-2 grid in the overview. */
@media(min-width:761px) {
  #hsp-articles .hsp-story-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #hsp-articles .hsp-story { min-height:204px; }
}