/* The Words We Know / Word Familiarity — Ascendle editorial page */
.words-hero{padding-bottom:38px}
.words-hero .hero-copy{max-width:920px}
.hero-question{display:block;margin-top:12px;color:var(--text-color);font-family:var(--font-head);font-size:clamp(20px,2.2vw,28px);font-weight:800;line-height:1.25}

.word-constellation{margin-top:34px;padding:22px;border:1px solid var(--tile-border);border-radius:22px;background:#fff;box-shadow:0 18px 42px rgba(34,45,60,.07)}
.constellation-label{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-bottom:16px;color:var(--muted);font-size:12px;font-weight:700}
.constellation-label strong{font-family:var(--font-head);font-size:12px;letter-spacing:.065em;color:var(--green)}
.word-chip-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.word-chip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}
.word-chip span{display:flex;align-items:center;justify-content:center;aspect-ratio:1/1;border-radius:8px;background:var(--grey);color:#fff;font-family:var(--font-head);font-size:clamp(11px,1.4vw,18px);font-weight:800}
.word-chip:nth-child(1) span,.word-chip:nth-child(4) span{background:var(--green)}
.word-chip:nth-child(2) span,.word-chip:nth-child(5) span{background:var(--blue)}
.word-chip:nth-child(3) span,.word-chip:nth-child(6) span{background:var(--yellow)}

.same-word-demo{justify-self:end;width:100%;max-width:500px;padding:24px;border:1px solid var(--tile-border);border-radius:22px;background:#fff;box-shadow:0 18px 42px rgba(34,45,60,.07)}
.demo-word{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;max-width:330px;margin:0 auto 22px}
.demo-word span{display:flex;align-items:center;justify-content:center;aspect-ratio:1/1;border-radius:10px;background:var(--green);color:#fff;font-family:var(--font-head);font-size:30px;font-weight:800}
.player-reactions{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.reaction-card{padding:16px;border:1px solid var(--tile-border);border-radius:16px;background:#F8F8F8;text-align:center}
.reaction-card span{display:block;margin-bottom:5px;color:var(--muted);font-family:var(--font-head);font-size:10px;font-weight:800;letter-spacing:.07em}
.reaction-card strong{font-family:var(--font-head);font-size:17px}
.reaction-note{margin:16px 0 0!important;max-width:none!important;text-align:center;font-size:13.5px!important;color:var(--muted)!important}

.dictionary-figure{max-width:500px;justify-self:end}
.dictionary-figure img{background:#fff}

.scale-visual{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:28px}
.scale-card{position:relative;overflow:hidden;padding:24px;border:1px solid var(--tile-border);border-radius:20px;background:#fff;box-shadow:0 14px 32px rgba(34,45,60,.055)}
.scale-card:before{content:"";position:absolute;left:0;top:0;right:0;height:4px;background:var(--green)}
.scale-card:nth-child(2):before{background:var(--blue)}
.scale-card:nth-child(3):before{background:var(--yellow)}
.scale-card span{display:block;margin-bottom:7px;color:var(--muted);font-family:var(--font-head);font-size:11px;font-weight:800;letter-spacing:.07em}
.scale-card strong{display:block;font-family:var(--font-head);font-size:clamp(34px,4vw,52px);line-height:1;color:var(--text-color)}
.scale-card p{margin:9px 0 0!important;font-size:14px!important;line-height:1.5!important;color:#515B66!important}

.rule-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;justify-self:end;width:100%;max-width:540px}
.rule-card{padding:18px;border:1px solid var(--tile-border);border-radius:17px;background:#fff;box-shadow:0 12px 28px rgba(34,45,60,.045)}
.rule-card span{display:block;margin-bottom:6px;color:var(--red);font-family:var(--font-head);font-size:10px;font-weight:800;letter-spacing:.065em}
.rule-card strong{font-family:var(--font-head);font-size:16px;line-height:1.3}
.rule-card:last-child{grid-column:1/-1;border-color:rgba(42,141,93,.38);background:rgba(42,141,93,.045)}
.rule-card:last-child span{color:var(--green)}

.real-example-section{padding-top:8px}
.real-example-card{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:30px;align-items:center;padding:24px;border:1px solid var(--tile-border);border-radius:24px;background:#fff;box-shadow:0 18px 42px rgba(34,45,60,.07)}
.real-example-figure{margin:0;padding:0;border-radius:18px;overflow:hidden;background:#E7E7E7}
.real-example-figure img{display:block;width:100%;height:auto}
.real-example-copy{padding:4px 6px 4px 0}
.example-eyebrow{margin:0 0 8px!important;color:var(--green)!important;font-family:var(--font-head);font-size:11px!important;font-weight:800!important;letter-spacing:.075em!important}
.real-example-copy h3{margin:0 0 14px;font-family:var(--font-head);font-size:clamp(23px,2.4vw,32px);line-height:1.12;letter-spacing:-.02em;color:var(--text-color)}
.real-example-copy p{margin:0 0 13px!important;max-width:none!important;font-size:15px!important;line-height:1.62!important;color:#434D58!important}
.real-example-copy p:last-child{margin-bottom:0!important}
.example-close{padding-top:3px;color:var(--text-color)!important}

.pipeline-figure{margin:28px 0 0;background:#0B1115;border:1px solid rgba(42,141,93,.20);border-radius:24px;padding:12px;box-shadow:0 18px 44px rgba(0,0,0,.12)}
.pipeline-figure img{display:block;width:100%;height:auto;border-radius:16px}
.pipeline-figure figcaption{margin:12px 6px 4px;color:#626D77;font-size:13.5px;line-height:1.5}

.factor-visual{justify-self:end;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;width:100%;max-width:520px}
.factor-card{padding:18px;border:1px solid var(--tile-border);border-radius:17px;background:#fff}
.factor-card span{display:block;margin-bottom:5px;font-family:var(--font-head);font-size:10px;font-weight:800;letter-spacing:.07em;color:var(--muted)}
.factor-card strong{font-family:var(--font-head);font-size:17px;line-height:1.25}
.factor-card:nth-child(1){border-top:4px solid var(--green)}
.factor-card:nth-child(2){border-top:4px solid var(--yellow)}
.factor-card:nth-child(3){border-top:4px solid var(--blue)}
.factor-card:nth-child(4){border-top:4px solid var(--grey)}
.factor-card:nth-child(5){border-top:4px solid var(--red)}
.factor-card:nth-child(6){border-top:4px solid var(--bronze)}

.principle-figure{margin:28px auto 0;max-width:930px;background:#0B1115;border:1px solid rgba(42,141,93,.20);border-radius:24px;padding:12px;box-shadow:0 18px 44px rgba(0,0,0,.12)}
.principle-figure img{display:block;width:100%;height:auto;border-radius:16px}
.principle-figure figcaption{margin:12px 6px 4px;color:#626D77;font-size:13.5px;line-height:1.5}

.principle-copy{max-width:880px}
.principle-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:26px}
.principle-card{padding:22px;border:1px solid var(--tile-border);border-radius:18px;background:#fff}
.principle-card span{display:block;margin-bottom:8px;font-family:var(--font-head);font-size:11px;font-weight:800;letter-spacing:.07em}
.principle-card strong{display:block;margin-bottom:8px;font-family:var(--font-head);font-size:21px}
.principle-card p{margin:0!important;font-size:14.5px!important;line-height:1.55!important;color:#4F5964!important}
.principle-card.fairness{border-top:4px solid var(--green)}
.principle-card.unpredictability{border-top:4px solid var(--blue)}
.principle-card.auditability{border-top:4px solid var(--yellow)}

.closing-statement{margin:30px 0 0;padding:24px 26px;border-left:5px solid var(--green);border-radius:0 18px 18px 0;background:#fff}
.closing-statement p{margin:0 0 12px!important;max-width:900px!important}
.closing-statement p:last-child{margin-bottom:0!important}
.closing-statement strong{font-family:var(--font-head)}

@media(max-width:980px){
  .word-chip-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .scale-visual,.principle-grid{grid-template-columns:1fr}
  .same-word-demo,.dictionary-figure,.rule-grid,.factor-visual{justify-self:start;max-width:620px}
  .real-example-card{grid-template-columns:1fr;gap:22px}
  .real-example-copy{padding:0 3px 3px}
}

@media(max-width:680px){
  .word-chip-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .constellation-label{align-items:flex-start;flex-direction:column;gap:4px}
  .player-reactions{grid-template-columns:1fr}
  .rule-grid,.factor-visual{grid-template-columns:1fr}
  .rule-card:last-child{grid-column:auto}
}
@media(max-width:460px){
  .word-constellation{padding:16px}
  .word-chip-grid{grid-template-columns:1fr 1fr;gap:8px}
  .same-word-demo{padding:17px}
  .demo-word span{font-size:24px}
}
