/* Syntony Research: an editorial home for evidence, methods, and field notes. */
.rh-page { color: var(--sr-ink); font-family: var(--sr-sans); }
.rh-page main { padding-top: 82px; }
.rh-wrap { width: min(1360px, 88vw); margin-inline: auto; }
.rh-hero { padding-top: 50px; padding-bottom: 70px; }
.rh-hero .research-breadcrumb { margin-bottom: 52px; }
.rh-overline { color: var(--sr-muted); font: 400 11px/1.5 var(--sr-mono); letter-spacing: .06em; text-transform: uppercase; }
.rh-hero-grid { display: grid; grid-template-columns: 1.5fr .65fr; gap: 8vw; align-items: end; }
.rh-hero h1 { font: 500 clamp(58px, 7vw, 104px)/.98 var(--sr-sans); letter-spacing: -.065em; margin: 25px 0 0; }
.rh-hero h1 em { font-family: var(--sr-serif); font-weight: 400; letter-spacing: -.055em; color: var(--sr-blue); }
.rh-dek { color: var(--sr-muted); font-size: 19px; line-height: 1.65; margin-bottom: 6px; max-width: 380px; }
.rh-collection { padding-bottom: 80px; }
.rh-section-line { border-top: 1px solid var(--sr-line); padding-top: 16px; display: flex; align-items: center; justify-content: space-between; gap: 25px; font-size: 12px; color: var(--sr-muted); }
.rh-editorial-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 52px; margin-top: 34px; }
.rh-route { color: var(--sr-ink); display: block; }
.rh-route-art { position: relative; height: 225px; overflow: hidden; display: flex; align-items: center; justify-content: center; background: #e8ebe8; }
.rh-route:hover .rh-route-art > div { transform: translateY(-5px); }
.rh-route-art > div { transition: transform .25s ease; }
.rh-notebook { position: relative; display: flex; flex-direction: column; width: 195px; height: 154px; background: #f7f6f2; padding: 28px 26px; box-shadow: 7px 7px 0 #bcc7c530; border: 1px solid #c9ceca; transform: rotate(-4deg); }
.rh-notebook span { color: #637269; font: 400 8px/1.4 var(--sr-mono); letter-spacing: .08em; }
.rh-notebook b { font: 400 32px/1.1 var(--sr-serif); padding-top: 10px; }
.rh-notebook i { width: 85%; height: 1px; background: #ccd2cd; margin-top: 9px; }
.rh-notebook i:last-child { width: 56%; }
.rh-art-benchmark { background: #dfe5f6; }
.rh-spectrum { display: flex; align-items: center; gap: 12px; height: 150px; transform: rotate(-9deg); }
.rh-spectrum span { height: var(--bar); width: 33px; background: #264ded; border-radius: 2px; box-shadow: 6px 5px 0 #264ded16; }
.rh-spectrum span:last-child { background: transparent; border: 1px dashed #264ded; box-shadow: none; }
.rh-route-meta { display: flex; justify-content: space-between; gap: 25px; font: 400 10px/1.5 var(--sr-mono); letter-spacing: .03em; color: var(--sr-muted); margin: 25px 0 12px; }
.rh-route h2 { display: flex; align-items: center; justify-content: space-between; margin: 0 0 12px; font: 500 42px/1.1 var(--sr-sans); letter-spacing: -.045em; }
.rh-route h2 > span { font: 400 28px var(--sr-sans); color: var(--sr-blue); }
.rh-route p { color: var(--sr-muted); font-size: 17px; line-height: 1.65; max-width: 510px; }
.rh-feature { background: #111c2b; color: #f7f6f2; padding: 28px 42px 40px; margin-bottom: 80px; position: relative; overflow: hidden; }
.rh-feature-top { display: flex; align-items: center; justify-content: space-between; gap: 25px; color: #c4cede; font: 400 10px/1.5 var(--sr-mono); letter-spacing: .05em; border-bottom: 1px solid #ffffff29; padding-bottom: 24px; }
.rh-pilot { display: flex; gap: 8px; align-items: center; }
.rh-pilot::before { content: ''; height: 6px; width: 6px; border-radius: 50%; background: #d5e8a5; }
.rh-feature-body { display: grid; grid-template-columns: 1.05fr .95fr; gap: 70px; align-items: center; padding: 45px 0 20px; }
.rh-feature h2 { font: 400 clamp(52px, 6vw, 82px)/1 var(--sr-sans); letter-spacing: -.06em; margin: 0 0 22px; }
.rh-feature h2 em { font-family: var(--sr-serif); letter-spacing: -.03em; color: #d5e8a5; }
.rh-feature p { color: #bdc8d7; font-size: 17px; line-height: 1.65; max-width: 500px; }
.rh-feature .sr-button { margin-top: 27px; color: #111c2b; background: #d5e8a5; border-color: #d5e8a5; }
.rh-feature .sr-button:hover { background: #e3efc5; border-color: #e3efc5; }
.rh-signal { margin: 0; position: relative; }
.rh-signal-head { display: flex; align-items: center; gap: 10px; font: 500 28px/1 var(--sr-sans); letter-spacing: -.04em; margin-bottom: 40px; }
.rh-signal-head svg { width: 29px; height: 29px; stroke: #d5e8a5; stroke-width: 2; fill: none; }
.rh-trace { display: grid; grid-template-columns: repeat(5,1fr); gap: 0; position: relative; }
.rh-trace::before { content: ''; position: absolute; height: 1px; left: 10%; right: 10%; top: 12px; background: linear-gradient(90deg,#d5e8a5 0%,#d5e8a5 50%,#6e819d 100%); }
.rh-trace div { text-align: center; position: relative; }
.rh-trace i { width: 25px; height: 25px; display: block; border-radius: 50%; border: 1px solid #d5e8a5; background: #111c2b; margin: 0 auto 14px; }
.rh-trace div:first-child i { background: #d5e8a5; box-shadow: inset 0 0 0 5px #111c2b; }
.rh-trace div:nth-child(4) i, .rh-trace div:nth-child(5) i { border-style: dashed; border-color: #a7b5c7; }
.rh-trace span { color: #c7d1df; font: 400 9px/1.5 var(--sr-mono); }
.rh-signal figcaption { margin-top: 30px; font: 400 11px/1.6 var(--sr-sans); color: #aab9cd; }
.rh-footnote { padding: 28px 0 70px; display: grid; grid-template-columns: 1fr 1.1fr; gap: 80px; border-top: 1px solid var(--sr-line); }
.rh-footnote h2 { font: 500 34px/1.1 var(--sr-sans); letter-spacing: -.045em; margin: 0; }
.rh-footnote p { color: var(--sr-muted); font-size: 17px; line-height: 1.7; margin-bottom: 20px; }
.rh-benchmarks .rh-feature { margin-top: 35px; }
.rh-benchmarks .rh-feature-body { padding-top: 48px; padding-bottom: 10px; }
.rh-benchmarks .rh-feature h2 { font-size: clamp(62px, 8vw, 108px); }
.rh-feature-subtitle { color: #d5e8a5; font: 400 25px/1.3 var(--sr-serif); letter-spacing: -.02em; margin-bottom: 18px; }
.rh-principles { display: grid; grid-template-columns: repeat(3,1fr); gap: 45px; padding-bottom: 80px; }
.rh-principles article { border-top: 1px solid var(--sr-line); padding-top: 21px; }
.rh-principles span { color: var(--sr-blue); font: 400 11px var(--sr-mono); }
.rh-principles h3 { font: 500 26px/1.2 var(--sr-sans); letter-spacing: -.035em; margin: 18px 0 12px; }
.rh-principles p { color: var(--sr-muted); font-size: 15px; line-height: 1.7; }
@media (max-width: 1000px) {
  .rh-hero-grid { grid-template-columns: 1.3fr .8fr; gap: 40px; }
  .rh-dek { font-size: 16px; }
  .rh-feature { padding-inline: 28px; }
  .rh-feature-body { gap: 32px; }
  .rh-trace span { font-size: 8px; }
}
@media (max-width: 700px) {
  .rh-page main { padding-top: 72px; }
  .rh-hero { padding-top: 27px; padding-bottom: 40px; }
  .rh-hero .research-breadcrumb { margin-bottom: 32px; }
  .rh-hero-grid { grid-template-columns: 1fr; gap: 25px; }
  .rh-hero h1 { font-size: clamp(53px, 11vw, 77px); margin-top: 18px; }
  .rh-dek { font-size: 17px; max-width: 490px; }
  .rh-editorial-grid { grid-template-columns: 1fr; gap: 38px; }
  .rh-route-art { height: 200px; }
  .rh-route-meta { margin-top: 19px; }
  .rh-route h2 { font-size: 35px; }
  .rh-route p { font-size: 16px; }
  .rh-collection { padding-bottom: 43px; }
  .rh-feature { padding: 23px 24px 30px; margin-bottom: 45px; }
  .rh-feature-top { align-items: flex-start; gap: 14px; font-size: 8px; }
  .rh-feature-body { grid-template-columns: 1fr; gap: 36px; padding-top: 30px; }
  .rh-feature h2 { font-size: 52px; }
  .rh-feature p { font-size: 16px; }
  .rh-feature .sr-button { margin-top: 20px; padding-inline: 17px; font-size: 14px; }
  .rh-signal { padding-top: 28px; border-top: 1px solid #ffffff29; }
  .rh-signal-head { font-size: 24px; margin-bottom: 30px; }
  .rh-trace span { font-size: 7px; }
  .rh-trace i { width: 21px; height: 21px; }
  .rh-trace::before { top: 10px; }
  .rh-signal figcaption { margin-top: 25px; }
  .rh-footnote { grid-template-columns: 1fr; gap: 22px; padding-bottom: 40px; }
  .rh-footnote h2 { font-size: 32px; }
  .rh-footnote p { font-size: 16px; }
  .rh-section-line { font-size: 11px; gap: 15px; }
  .rh-principles { grid-template-columns: 1fr; gap: 28px; padding-bottom: 40px; }
  .rh-principles h3 { margin-top: 10px; }
}
@media (prefers-reduced-motion: reduce) { .rh-route-art > div { transition: none; } }