/* Atro Vuolle – etusivun uudet osiot: Kuka olemme, Luvut, Palvelualue, Laatu, UKK, Yhteydenotto.
   Ladataan style.css:n jälkeen. Täydennettävät tiedot on merkitty luokalla .taydenna. */

/* TÄYDENNETTÄVÄ TIETO – poista luokka, kun oikea tieto on lisätty */
.taydenna{background:#fff3c4;color:#6b4e00;padding:0 .25em;border-radius:.25rem;box-shadow:inset 0 0 0 1px #e8cf7a}
.nums .taydenna{background:rgb(228 192 125 / .22);color:#f1d69c;box-shadow:inset 0 0 0 1px rgb(228 192 125 / .5)}

.esec{padding-block:clamp(3.5rem,7vw,5.5rem)}
.esec h2{margin-top:.9rem;font-size:clamp(1.9rem,1.4rem + 1.4vw,2.6rem)}
.esec--surface{background:var(--surface)}
.eyebrow--dark{color:#8a6420}
.elead{max-width:42rem;margin-top:.9rem;font-size:1.0625rem;color:var(--muted)}

/* 3 · Kuka olemme */
.who{display:grid;gap:3rem;align-items:center}
@media (min-width:56em){.who{grid-template-columns:6fr 5fr}}
.who__media{position:relative;margin:0}
.who__media img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:1rem}
.who__badge{position:absolute;right:1rem;bottom:-1.25rem;padding:1.1rem 1.3rem;border-radius:.9rem;background:var(--navy);color:#fff;box-shadow:0 1.5rem 3rem -1.5rem rgb(13 27 42 / .6)}
@media (min-width:56em){.who__badge{right:-1rem}}
.who__badge strong{display:block;font:500 2.2rem/1 var(--serif);color:var(--gold-2)}
.who__badge span{font-size:.8rem;color:#b9c4cf}
.who__body{margin-top:1.25rem;line-height:1.7}
.who__body+.who__body{margin-top:1rem}
.who__sign{display:flex;align-items:center;gap:.9rem;margin-top:1.75rem}
.who__sign i{display:grid;place-items:center;width:3rem;height:3rem;border-radius:999px;background:var(--surface);font-style:normal;font-weight:700;color:var(--navy)}
.who__sign strong{display:block;color:var(--navy)}
.who__sign span{font-size:.85rem;color:var(--muted)}

/* 4 · Luvut */
.nums{background:var(--navy);color:#fff}
.nums ul{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem 0;padding-block:2.75rem;list-style:none}
@media (min-width:56em){.nums ul{grid-template-columns:repeat(4,1fr)}}
.nums li{padding:.25rem 1.25rem;border-left:1px solid rgb(255 255 255 / .14)}
.nums li:nth-child(odd){border-left:0;padding-left:0}
@media (min-width:56em){.nums li:nth-child(3){border-left:1px solid rgb(255 255 255 / .14);padding-left:1.25rem}}
.nums strong{display:block;font:500 clamp(2rem,1.5rem + 2vw,3.2rem)/1.05 var(--serif);color:var(--gold-2)}
.nums span{display:block;margin-top:.5rem;font-size:.9rem;color:#b9c4cf}

/* 6 · Palvelualue */
.area{display:grid;gap:3rem;align-items:center}
@media (min-width:56em){.area{grid-template-columns:5fr 6fr}}
.area h3{margin-top:1.75rem;font:600 .8rem/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.chipset{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem;padding:0;list-style:none}
.chipset li{padding:.45rem .85rem;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:.85rem;font-weight:500;color:var(--navy)}
.chipset--home li{border-color:var(--gold);background:rgb(214 171 90 / .12)}
.area .btn{margin-top:1.75rem}
.area__map{margin:0;overflow:hidden;border:1px solid var(--line);border-radius:1rem;background:#d9e5ee}
.area__map img{display:block;width:100%;aspect-ratio:620/820;max-height:34rem;object-fit:cover;object-position:50% 62%}

/* 7 · Laatu ja turvallisuus */
.qual{display:grid;gap:1rem;margin-top:2.25rem;padding:0;list-style:none}
@media (min-width:40em){.qual{grid-template-columns:1fr 1fr}}
@media (min-width:60em){.qual{grid-template-columns:repeat(4,1fr)}}
.qual li{padding:1.5rem;border:1px solid var(--line);border-radius:var(--r);background:#fff}
.qual__ico{display:grid;place-items:center;width:2.75rem;height:2.75rem;border-radius:.7rem;background:var(--navy);color:var(--gold-2)}
.qual h3{margin-top:1rem;font-size:1.2rem;color:var(--navy)}
.qual p{margin-top:.4rem;font-size:.9rem;color:var(--muted)}

/* 8 · UKK (käyttää style.css:n .faq-tyylejä) */
.faq--home{padding-top:clamp(3.5rem,7vw,5.5rem)}
.faq--home details p a{color:var(--navy);font-weight:600}

/* 9 · Yhteydenotto */
.ctaband{background:var(--navy);color:#fff;padding-block:3.5rem}
.ctaband .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1.5rem 2rem}
.ctaband h2{font-size:clamp(1.8rem,1.4rem + 1vw,2.4rem)}
.ctaband p{margin-top:.4rem;color:#b9c4cf}
.ctaband__cta{display:flex;flex-wrap:wrap;gap:.75rem}