.phead h1 { font-size: clamp(50px, 7vw, 116px); }
.phead h1 .c { color: var(--blue); display: block; }
.studies { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 10px; }
.study { display: grid; grid-template-rows: auto 1fr; border-radius: 22px; overflow: hidden; text-decoration: none; border: 1px solid var(--line); background: var(--white); transition: border-color .25s, box-shadow .35s var(--ease); }
.study:hover { border-color: var(--blue); box-shadow: 0 24px 44px -30px rgba(8, 16, 58, .6); }
.study .art { aspect-ratio: 16 / 9; background: #FBFBF8; display: grid; place-items: center; border-bottom: 1px solid var(--line); overflow: hidden; }
.study.b .art { background: var(--navy); }
.study .art img { width: 100%; height: 100%; object-fit: cover; }
.study .t { padding: 20px; display: grid; gap: 8px; align-content: start; }
.study h2 { font: 800 30px/1 Archivo; font-stretch: 100%; letter-spacing: -.02em; }
.study p { color: var(--muted); }
.study .go { margin-top: 6px; font: 700 15px Archivo; color: var(--blue); }
.road { margin-top: 64px; }
.road h2 { font-size: clamp(34px, 4vw, 60px); margin-bottom: 18px; }
.road h2 .c { color: var(--blue); }
.road .g { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.road .g div { border: 1px dashed var(--line); border-radius: 16px; padding: 18px; color: var(--muted); }
.road .g b { display: block; color: var(--ink); font: 800 20px Archivo; margin: 6px 0; }
@media (max-width: 860px) { .studies, .road .g { grid-template-columns: 1fr; } }
