/* Palvelut: suhdelohko. Palvelukortti (.mt-svc) on jaettu pohja template-parts/v2/service-card.php; sen tyyli on tässä, koska vain tämä lohko käyttää sitä. */
.mt-services:has(.mt-h2){padding-block-start:var(--mt-space-section-lg)}
.mt-services__head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:.75rem 2rem}
.mt-services .mt-eyebrow+.mt-services__head{margin-block-start:.75rem}
.mt-services__more{display:inline-flex;align-items:center;gap:.5rem;min-block-size:1.5rem;padding-block:.25rem .3125rem;border-block-end:.0625rem solid currentColor;color:var(--mt-navy);font:500 var(--mt-fs-xs)/1.2 var(--mt-font-display);letter-spacing:var(--mt-tracking-caps);text-transform:uppercase;text-decoration:none}
.mt-services__more:hover{color:var(--mt-coral-deep)}
.mt-services__intro{margin:.5rem 0 0;max-inline-size:41rem;font-size:var(--mt-fs-lg);line-height:1.5;color:var(--mt-muted)}
.mt-services__head+.mt-services__list,.mt-services__intro+.mt-services__list{margin-block-start:1.75rem}
.mt-services__list{display:grid;gap:1.25rem;align-items:stretch;margin:0;padding:0;list-style:none}
.mt-services__item{display:flex;min-inline-size:0}
.mt-services__item>*{flex:1}
.mt-services__empty{margin:0;padding:1.5rem;border:.0625rem dashed var(--mt-field);border-radius:var(--mt-radius);color:var(--mt-muted)}

/* Kortin yhteiset osat */
.mt-svc{position:relative;display:flex;min-inline-size:0}
.mt-svc__body{display:flex;flex-direction:column;gap:.625rem;min-inline-size:0}
.mt-svc__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;overflow-wrap:break-word;hyphens:manual}
.mt-svc__link{display:inline-block;min-block-size:1.5rem;color:inherit;text-decoration:none}
.mt-svc__link::after{content:"";position:absolute;inset:0}
.mt-svc__link:focus-visible{outline:none}
.mt-svc:has(.mt-svc__link:focus-visible){outline:.1875rem solid var(--mt-coral);outline-offset:.1875rem;border-radius:var(--mt-radius)}
.mt-svc__text{margin:0;font-size:var(--mt-fs-base);line-height:1.5;color:var(--mt-text)}
.mt-svc__more{display:inline-flex;align-items:center;align-self:flex-start;gap:.5rem;min-block-size:1.5rem;margin-block-start:.25rem;padding-block:.25rem .3125rem;border-block-end:.0625rem solid currentColor;color:var(--mt-navy);font:500 var(--mt-fs-xs)/1.2 var(--mt-font-display);letter-spacing:var(--mt-tracking-caps);text-transform:uppercase}
.mt-svc:hover .mt-svc__more{color:var(--mt-coral-deep)}
.mt-svc__more .mt-icon{color:currentColor}

/* Kuvakortit: kuva vasemmalla, teksti ja tunnisteet oikealla */
.mt-svc--media{flex-direction:column;overflow:hidden;border:.0625rem solid var(--mt-line);border-radius:var(--mt-radius);background:var(--mt-white)}
.mt-svc--media .mt-svc__image{position:relative;flex:none;min-block-size:11rem;background:var(--mt-mist)}
.mt-svc--media .mt-svc__image img{position:absolute;inset:0;inline-size:100%;block-size:100%;object-fit:cover}
.mt-svc--media .mt-svc__body{flex:1;padding:1.75rem}
.mt-svc--media .mt-svc__title{font-size:var(--mt-fs-h3)}
.mt-svc__tags{display:flex;flex-wrap:wrap;gap:.375rem;margin:0;padding:0;list-style:none}
.mt-svc__tags li{padding:.3125rem .625rem;border-radius:.75rem;background:var(--mt-mist);font-size:var(--mt-fs-sm);line-height:1.5;color:var(--mt-ink)}

/* Kuvalaatat: kuva taustana, teksti alalaidassa */
.mt-svc--tiles{flex-direction:column;justify-content:flex-end;min-block-size:20rem;padding:1.5rem;overflow:hidden;border-radius:var(--mt-radius);background:var(--mt-navy);color:var(--mt-on-navy-soft)}
.mt-svc--tiles .mt-svc__image,.mt-svc--tiles .mt-svc__image img{position:absolute;inset:0;inline-size:100%;block-size:100%}
.mt-svc--tiles .mt-svc__image img{object-fit:cover}
.mt-svc--tiles::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,color-mix(in oklch,var(--mt-navy) 96%,transparent),color-mix(in oklch,var(--mt-navy) 33%,transparent) 65%,transparent)}
.mt-svc--tiles .mt-svc__body{position:relative;z-index:1;gap:.375rem}
/* Pitkä yhdyssana (Järjestelmäintegraatio) ei saa leikkautua: otsikko skaalautuu laatan leveyteen, ja viimeisenä keinona sana katkeaa. */
.mt-svc--tiles{container-type:inline-size}
.mt-svc--tiles .mt-svc__title{font-size:clamp(1rem,100cqi / 13.6,var(--mt-fs-h3));color:var(--mt-white);overflow-wrap:anywhere}
.mt-svc--tiles .mt-svc__text{font-size:var(--mt-fs-md);color:var(--mt-on-navy-soft)}
.mt-svc--tiles .mt-svc__link::after{z-index:2}

/* Linkkikortit: harmaa kortti, otsikko, teksti ja linkki */
.mt-svc--cards{padding:1.5rem;border-radius:var(--mt-radius);background:var(--mt-mist)}
.mt-svc--cards .mt-svc__body{flex:1}
.mt-svc--cards .mt-svc__text{font-size:var(--mt-fs-md)}
.mt-svc--cards .mt-icon{color:var(--mt-coral-strong)}
.mt-svc--cards .mt-svc__more{margin-block-start:auto}

/* Linkkirivi: pelkät nimet */
/* Linkkirivi (Pen: "Myös"): otsake samalla rivillä pillereiden kanssa, ei nuolta. */
.mt-section.mt-services--list{padding-block-start:var(--mt-space-md)}
.mt-services--list .mt-wrap{display:flex;flex-wrap:wrap;align-items:center;gap:.625rem}
.mt-services--list .mt-eyebrow{margin:0;color:var(--mt-muted)}
.mt-services--list .mt-services__list{display:flex;flex-wrap:wrap;gap:.625rem;margin:0}
.mt-services--list .mt-services__item>*{flex:none}
.mt-svc--list{display:inline-flex;align-items:center;min-block-size:2.5625rem;padding:.625rem 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),border-color var(--mt-transition)}
.mt-svc--list:hover{border-color:var(--mt-navy);background:var(--mt-mist)}
.mt-svc--list .mt-icon{display:none}

@container (min-width:42rem){
  .mt-services--media .mt-services__list{grid-template-columns:repeat(auto-fit,minmax(min(100%,26rem),1fr))}
  .mt-services--media .mt-svc--media{flex-direction:row;min-block-size:16.25rem}
  .mt-services--media .mt-svc--media .mt-svc__image{flex-basis:11.875rem}
  .mt-services--tiles .mt-services__list{grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr))}
  .mt-services--cards .mt-services__list{grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr));align-items:start}
}
@media (prefers-reduced-motion:reduce){.mt-services__more,.mt-svc--list{transition:none}}