.btn-ghost{border:2px solid var(--line);color:var(--navy);background:#fff}
.btn-ghost:hover{border-color:var(--teal);color:var(--teal)}
.phero{position:relative;overflow:hidden;color:#fff;background:var(--navy) url("/media/sukupuoli_1800x620.jpg") center 40%/cover no-repeat;padding:92px 0 96px}
.phero p{font-size:19px;color:rgba(255,255,255,.9);max-width:660px}
.callout{background:var(--navy);color:#fff;border-radius:16px;padding:38px 40px;display:grid;grid-template-columns:1.4fr .8fr;gap:30px;align-items:center;border-left:6px solid var(--amber)}
.callout h3{color:#fff;font-size:22px;margin-bottom:8px}
.callout p{color:rgba(255,255,255,.85);font-size:15.5px}
.callout .btns{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-end}
.cta{background:var(--teal);color:#fff;padding:72px 0}
.cta .wrap{display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:center}
.cta h2{color:#fff;font-size:32px;margin-bottom:10px}
.cta p{color:rgba(255,255,255,.9);max-width:560px}
.cta .btns{display:flex;gap:14px;flex-wrap:wrap;justify-content:flex-end}
.concepts{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:44px}
.con{background:#fff;border:1px solid var(--line);border-radius:16px;padding:28px 28px 24px;display:flex;flex-direction:column}
.con .k{font-family:Poppins,Arial,sans-serif;font-size:12.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--teal);margin-bottom:8px}
.con h3{font-size:21px;font-weight:600;margin-bottom:10px}
.con p{color:#2a3744;margin-bottom:12px}
.con blockquote{margin:6px 0 12px;padding:14px 18px;border-left:4px solid var(--amber);background:var(--bg);border-radius:0 10px 10px 0;font-size:15px;color:#2a3744}
.con blockquote cite{display:block;margin-top:6px;font-style:normal;font-size:13px;color:var(--muted)}
.con .more{margin-top:auto;font-size:14px;color:var(--muted)}
.con .more a{border-bottom:1px dotted rgba(31,122,140,.5)}
.con.wide{grid-column:1/-1}
.bars{display:grid;gap:12px;margin:14px 0 6px}
.bar{display:grid;grid-template-columns:200px 1fr 60px;gap:12px;align-items:center;font-size:14px}
.bar .tr{height:14px;background:var(--bg);border-radius:7px;overflow:hidden}
.bar .tr i{display:block;height:100%;background:linear-gradient(90deg,var(--teal),var(--teal2));border-radius:7px}
.bar b{font-family:Poppins,Arial,sans-serif;font-weight:600;color:var(--navy);text-align:right}
.two{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:20px}
.pub{background:#fff;border:1px solid var(--line);border-radius:16px;padding:28px}
.pub h3{font-size:19px;font-weight:600;margin-bottom:10px}
.pub p{color:#2a3744}
@media (max-width:900px){.callout,.cta .wrap{grid-template-columns:1fr}.fgrid{grid-template-columns:1fr 1fr}.menu{display:none}.phero h1{font-size:40px}.sec h2{font-size:30px}.cta .btns,.callout .btns{justify-content:flex-start}.concepts,.two{grid-template-columns:1fr}.bar{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}