/* The Words product page keeps its own live-card template; the family chrome wraps it and
   these rules bring its hero, bands, screens, facts, and closing in line with the nine other
   app pages. */
.words-product .hero{padding-top:30px}
.words-product .site-foot{margin-top:0}
.words-product .identity{display:flex;align-items:center;gap:12px;font-size:16px;font-weight:800;color:var(--ink);margin:0 0 22px;justify-content:center}
.words-product .identity img{width:44px;height:44px;border-radius:12px;box-shadow:var(--sh-1)}
.words-product h1{letter-spacing:-.03em}
.words-product .rule{display:none}
.words-product .hero .lede{margin-top:16px}
.words-product .sec-head .lede{margin-top:14px}
/* Library bands sit flat on the paper like every other section, with a hairline above. */
.words-product .band{border-radius:0;border-top:1px solid var(--hairline)}
.words-product .band-phrases{border-top:1px solid var(--hairline)}
/* Phones in "A look inside" wear the same bezel as every framed screen on the site. */
.words-product .phone{padding:5px;border-radius:30px;background:#1F2A33;box-shadow:0 1px 2px rgba(35,50,62,.12),0 14px 30px -12px rgba(35,50,62,.38)}
.words-product .phone img{border-radius:25px}
/* At a glance + For you: the family's fact slot, same shape as the nine app pages. */
.words-product .glance-band{padding:0 0 56px}
.words-product .glance-row{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:32px;align-items:stretch}
.words-product .glance-head{background:var(--card);border-radius:var(--r-card);padding:28px 30px 30px;box-shadow:var(--sh-2);text-align:left}
.words-product .glance-h{font-size:24px;line-height:1.1;margin:0 0 16px;letter-spacing:-.01em}
.words-product .glance{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 28px;margin:0}
.words-product .glance div{min-width:0}
.words-product .glance dt{font-size:10.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-ink);margin:0 0 3px}
.words-product .glance dd{margin:0;font-size:15px;font-weight:700;color:var(--ink);line-height:1.45;text-wrap:pretty}
.words-product .for-you{background:var(--blob-sky,#DCE9F3);border-radius:var(--r-card);padding:28px 30px;display:flex;flex-direction:column;justify-content:center;text-align:left}
.words-product .for-you .eyebrow{color:#2F5D80;margin-bottom:12px}
.words-product .for-you-p{font-family:var(--serif);font-weight:700;font-size:clamp(21px,2.4vw,26px);line-height:1.3;color:var(--ink);text-wrap:pretty;margin:0}
.words-product .dl-card{background:var(--blob-sky,#DCE9F3)}
@media (min-width:1100px){
  .words-product .hero{padding:26px 0 72px}
  .words-product .identity{justify-content:flex-start}
  .words-product .phone{padding:6px;border-radius:34px}
  .words-product .phone img{border-radius:28px}
  .words-product .phone-side{padding:5px;border-radius:30px}
  .words-product .phone-side img{border-radius:25px}
}
@media (max-width:820px){
  .words-product .glance-row{grid-template-columns:minmax(0,1fr);gap:16px}
  .words-product .glance-band{padding-bottom:44px}
}
@media (max-width:600px){
  .words-product .hero{padding-top:22px}
  .words-product .glance{grid-template-columns:minmax(0,1fr)}
  .words-product .glance-head,.words-product .for-you{padding:22px 20px}
}