/* ===== v15: species pages ===== */
/* title: "Dog" first, then "body language." arrives as one piece */
.sp-hero .reveal-title .ln{overflow:visible}
.sp-hero .reveal-title .ln>span{opacity:0;transform:translateY(.3em);transition:opacity .8s var(--ease),transform 1s var(--ease)}
.loaded .sp-hero .reveal-title .ln>span{opacity:1;transform:none}
.sp-hero .reveal-title .ln:nth-child(2)>span{transition-delay:.35s}

/* signal cards: example line */
.bp{display:flex;flex-direction:column}
.bp-ex{margin:14px 0 0;padding-top:12px;border-top:1px solid rgba(10,35,66,.1);font-size:.92rem;line-height:1.5;color:var(--char)}
.bp-ex span{display:block;font-family:var(--mono);font-size:.62rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--forest);margin-bottom:5px}

/* did-you-know and misreads: same height, content balanced */
.sp-card-aqua,.sp-card-pink{height:100%}
.sp-two:has(.sp-card-aqua){align-items:stretch}
.sp-card-aqua{display:flex;flex-direction:column;justify-content:center}
.sp-card-aqua h3{font-size:clamp(1.3rem,2vw,1.75rem);line-height:1.18}
.misreads{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.misreads li{margin:0;line-height:1.45}
.misreads strong{display:block;font-weight:600;color:var(--char)}
.misreads span{display:block;color:#466060;font-size:.95rem}

/* see it for yourself: copy sits level with the heading */
.bg-leaf .sp-two{align-items:center}
.bg-leaf .sp-two .lead{margin-top:0}
.sp-card-pink ul.misreads{padding-left:0;margin-left:0}
.sp-card-pink ul.misreads li{padding-left:0}
.sp-card-pink ul.misreads li:before{display:none}
.misreads span{font-size:1rem}