@media(min-width:901px){
  .hero{height:680px;min-height:0;grid-template-columns:1.08fr .96fr .82fr;align-items:stretch}
  .ranking{justify-content:flex-start;padding:46px 38px 30px;position:relative;overflow:hidden;background:linear-gradient(150deg,#092f3b 0%,#092f3b 62%,#0c3d47 100%)}
  .ranking:after{content:'';position:absolute;width:240px;height:240px;border:1px solid rgba(56,198,163,.18);border-radius:50%;right:-105px;top:-90px;box-shadow:0 0 0 28px rgba(56,198,163,.04),0 0 0 58px rgba(217,164,65,.035)}
  .ranking h1{font-size:43px;max-width:340px;margin-bottom:16px}
  .ranking>p{font-size:16px;margin:0;max-width:390px}
  .ranking .cta{margin-top:20px}
  .hero-principles{margin-top:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;position:relative;z-index:2}
  .hero-principles span{min-height:94px;background:rgba(255,255,255,.075);border-top:3px solid var(--mint);padding:14px 11px 10px;color:#dce8e9;font-size:11px;line-height:1.35}
  .hero-principles b{display:block;color:#fff;font-size:13px;margin-bottom:6px}
  .hero-principles span:nth-child(2){border-color:var(--gold)}
  .lead,.lead .card,.lead .card a{height:100%}
  .lead .card a{position:relative;background:#071f27}
  .lead .card img{height:100%;min-height:100%;filter:saturate(.92)}
  .lead .card a:after{content:'';position:absolute;inset:38% 0 0;background:linear-gradient(transparent,rgba(4,22,28,.96))}
  .lead .card .tag{z-index:2}
  .lead .card h3{position:absolute;z-index:2;left:0;right:0;bottom:104px;color:white;font-size:27px;margin:0;padding:0 24px}
  .lead .card p{position:absolute;z-index:2;left:0;right:0;bottom:42px;color:#d9e4e5;margin:0;padding:0 24px;font-size:13px}
  .lead .card .read{position:absolute;z-index:2;left:24px;bottom:16px;color:var(--mint);margin:0}
  .quick,.quick .card,.quick .card a{height:100%;min-height:0}
  .quick .card img{height:100%;min-height:0}
}
@media(max-width:900px){
  .hero-principles{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:28px}
  .hero-principles span{background:rgba(255,255,255,.08);border-top:3px solid var(--mint);padding:13px;font-size:12px}
  .hero-principles b{display:block;color:white;margin-bottom:4px}
}
@media(max-width:600px){.hero-principles{grid-template-columns:1fr}.hero-principles span{min-height:0}.lead .card,.lead .card a{height:auto}}