/* Referenssit: suhdelohko. Referenssikortti (.mt-ref) on jaettu pohja template-parts/v2/reference-card.php; sen tyyli on tässä, koska vain tämä lohko käyttää sitä. */
.mt-reflist__head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--mt-space-sm) var(--mt-space-lg);margin-block-end:var(--mt-space-lg)}
.mt-reflist__head .mt-eyebrow+.mt-h2{margin-block-start:.75rem}
.mt-reflist__more{display:inline-flex;align-items:center;gap:.5rem;min-block-size:1.5rem;padding-block-end:.3125rem;border-block-end:.0625rem solid var(--mt-navy);font:500 var(--mt-fs-xs)/1.2 var(--mt-font-display);letter-spacing:var(--mt-tracking-caps);text-transform:uppercase;color:var(--mt-navy);text-decoration:none}
.mt-reflist__more:hover{color:var(--mt-coral-deep);border-color:var(--mt-coral-deep)}
.mt-reflist__filter ul{display:flex;flex-wrap:wrap;gap:.625rem;margin:0 0 var(--mt-space-lg);padding:0;list-style:none}
.mt-reflist__filter a{display:inline-flex;align-items:center;min-block-size:2.5rem;padding:.5rem 1rem;border:.0625rem solid var(--mt-line);border-radius:var(--mt-radius-pill);font:500 var(--mt-fs-md)/1.5 var(--mt-font-body);color:var(--mt-ink);text-decoration:none;transition:background-color var(--mt-transition),color var(--mt-transition)}
.mt-reflist__filter a:hover{background:var(--mt-mist)}
.mt-reflist__filter a[aria-current]{border-color:var(--mt-navy);background:var(--mt-navy);color:var(--mt-white)}
.mt-reflist__main{margin-block-end:var(--mt-space-lg)}
.mt-reflist__grid{display:grid;gap:var(--mt-space-lg) 1.5rem;margin:0;padding:0;list-style:none}
.mt-reflist__empty{margin:0;padding:1.5rem;border:.0625rem dashed var(--mt-field);border-radius:var(--mt-radius);color:var(--mt-muted)}
@container (min-width:32rem){.mt-reflist__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@container (min-width:48rem){.mt-reflist__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* Jaettu referenssikortti */
.mt-ref{position:relative;display:flex;flex-direction:column;gap:.875rem;block-size:100%}
.mt-ref:has(.mt-ref__link:focus-visible){outline:.1875rem solid var(--mt-coral);outline-offset:.25rem;border-radius:var(--mt-radius)}
.mt-ref__media{overflow:hidden;border-radius:var(--mt-radius);background:var(--mt-mist);aspect-ratio:27/16}
.mt-ref__media img{display:block;inline-size:100%;block-size:100%;object-fit:cover;transition:transform 400ms ease}
.mt-ref:hover .mt-ref__media img{transform:scale(1.03)}
.mt-ref__body{display:flex;flex-direction:column;gap:.375rem;align-items:flex-start}
.mt-ref__tag{margin:0;font:500 var(--mt-fs-2xs)/1.3 var(--mt-font-display);letter-spacing:var(--mt-tracking-caps);text-transform:uppercase;color:var(--mt-coral-strong)}
.mt-ref__title{margin:0;font:400 var(--mt-fs-h4)/1.15 var(--mt-font-display);letter-spacing:-.03125rem;color:var(--mt-ink);text-wrap:balance}
.mt-ref__link{display:inline-block;min-block-size:1.5rem;color:inherit;text-decoration:none}
.mt-ref__link::after{content:"";position:absolute;inset:0}
.mt-ref__link:focus-visible{outline:none}
.mt-ref__link:hover{text-decoration:underline;text-underline-offset:.2em}
.mt-ref__text{margin:0;font-size:var(--mt-fs-md);line-height:1.5;color:var(--mt-text)}
.mt-ref__cta{margin-block-start:.625rem}

/* Ilman kuvaa: tekstikortti */
.mt-ref--plain{gap:0;padding:var(--mt-space-lg);border-radius:var(--mt-radius);background:var(--mt-mist)}
.mt-ref--plain .mt-ref__body{gap:.5rem}
.mt-ref--plain.mt-ref--featured .mt-ref__body{padding:0}

/* Pääcase: iso kuva ja teksti vierekkäin leveällä sisällöllä */
.mt-ref--featured{gap:0;border-radius:var(--mt-radius);background:var(--mt-mist);overflow:hidden}
.mt-ref--featured .mt-ref__media{border-radius:0;aspect-ratio:16/10}
.mt-ref--featured .mt-ref__body{gap:.875rem;padding:var(--mt-space-lg) var(--mt-space-lg) var(--mt-space-xl)}
.mt-ref--featured .mt-ref__tag{font-size:var(--mt-fs-xs)}
.mt-ref--featured .mt-ref__title{font-size:var(--mt-fs-h2-lg);letter-spacing:-.03125rem}
.mt-ref--featured .mt-ref__text{font-size:var(--mt-fs-base);color:var(--mt-text)}
@container (min-width:48rem){
	.mt-ref--featured{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr)}
	.mt-ref--featured{min-block-size:28.75rem}
	.mt-ref--featured .mt-ref__media{position:relative;aspect-ratio:auto}
	.mt-ref--featured .mt-ref__media img{position:absolute;inset:0}
	.mt-ref--featured .mt-ref__body{justify-content:center;padding:var(--mt-space-xl)}
}
/* Pääcase vasemmalla, kaksi korttia pinossa oikealla (Pen: Etusivu / Referenssit) */
.mt-reflist__split{display:grid;gap:var(--mt-space-lg) 1.5rem;align-items:start}
.mt-reflist__side{display:grid;gap:1.5rem;margin:0;padding:0;list-style:none}
.mt-ref--lead{gap:1rem}
.mt-ref--lead .mt-ref__media{aspect-ratio:740/420}
.mt-ref--lead .mt-ref__body{gap:.5rem}
.mt-ref--lead .mt-ref__title{font-size:var(--mt-fs-h2)}
.mt-ref--lead .mt-ref__text{font-size:var(--mt-fs-base)}
.mt-ref__more{display:inline-flex;align-items:center;gap:.5rem;min-block-size:1.5rem;margin-block-start:.5rem;padding-block:.25rem .3125rem;border-block-end:.0625rem solid var(--mt-navy);font:500 var(--mt-fs-xs)/1.2 var(--mt-font-display);letter-spacing:var(--mt-tracking-caps);text-transform:uppercase;color:var(--mt-navy)}
.mt-ref:hover .mt-ref__more{color:var(--mt-coral-deep);border-color:var(--mt-coral-deep)}
@container (min-width:48rem){
	.mt-reflist__split{grid-template-columns:minmax(0,740fr) minmax(0,500fr)}
	.mt-reflist__side .mt-ref__media{aspect-ratio:500/190}
}
/* Tiivis lista: pieni kuva vasemmalla, teksti oikealla (Referenssit-sivu) */
.mt-reflist__rows{display:grid;margin:0;padding:0;list-style:none}
.mt-reflist__rows>li+li{border-block-start:.0625rem solid var(--mt-line)}
.mt-ref--row{padding-block:1.25rem;gap:.75rem}
.mt-ref--row .mt-ref__text{max-inline-size:40rem}
@container (min-width:40rem){
	.mt-ref--row{display:grid;grid-template-columns:16rem minmax(0,1fr);align-items:center;gap:1.5rem}
	.mt-ref--row.mt-ref--plain{display:flex}
}
@media (prefers-reduced-motion:reduce){.mt-ref__media img{transition:none}.mt-ref:hover .mt-ref__media img{transform:none}}
