/* Five shortcut cards share the full page width. */
.shortcut-band{
  padding:9px 0 6px;
  background:linear-gradient(180deg,#102a1df5,#0c241bf5);
  border-bottom:1px solid #d9e7bd0c;box-shadow:0 -1px 0 #cfe1bd0d;
}
.shortcuts{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.shortcuts .shortcut{
  --shortcut-tint:17 40 30;
  gap:13px;min-height:65px;height:65px;padding:8px;
  border:1px solid #d2e1bc2e;border-radius:11px;
  background:#193628;box-shadow:inset 0 1px 0 #e3efc70a;
}
.shortcuts .shortcut:before{opacity:.8;background-size:cover;background-position:80% center}
.shortcuts .shortcut:after{background:linear-gradient(90deg,rgb(var(--shortcut-tint)/.96),rgb(var(--shortcut-tint)/.8) 48%,rgb(var(--shortcut-tint)/.35))}
.shortcuts .shortcut-waste{--shortcut-tint:37 69 47;background:#25452f}
.shortcuts .shortcut-weather{--shortcut-tint:20 47 55;background:#15333a}
.shortcuts .shortcut-waste:before{background-image:url('/assets/nature-v38/assets/waste-garden.png');background-position:83% 66%}
.shortcuts .shortcut-history:before{background-image:url('/assets/nature-v38/assets/jablonowo-panorama.jpg');background-size:300% auto;background-position:28% 45%}
.shortcuts .shortcut-weather:before{background-image:url('/assets/nature-v38/assets/weather-sky.png');background-position:80% 61%}
.shortcuts .shortcut-events:before{background-image:url('/assets/nature-v38/assets/news-picnic-v1.webp');background-position:center 40%}
.shortcuts .shortcut-notices:before{background-image:url('/assets/nature-v38/assets/hero-golden-dawn-v1.webp');background-position:center 15%}
.shortcuts .tile-icon{
  width:45px;height:45px;border-radius:13px;
  border:1px solid #d4e4c42e;background:linear-gradient(125deg,#cbe5b00e,#eaf0c903);
}
.shortcuts .tile-icon svg{width:29px;height:29px;color:#f4f7e9;stroke-width:1.5}
.shortcuts .shortcut-waste .tile-icon svg{width:31px;height:31px}
.shortcuts .shortcut-weather .tile-icon svg{width:31px;height:31px}
.shortcuts .shortcut strong{font:400 16px/18px Georgia,'Times New Roman',serif;letter-spacing:-.35px;color:#f4f7e9;white-space:nowrap}
.shortcuts .shortcut small{font:400 10px/12px Manrope,Arial,sans-serif;color:#cbd6c6;margin-top:5px;white-space:nowrap}
.shortcuts .shortcut-arrow{
  display:block;width:28px;height:28px;flex:none;margin-left:auto;padding:4px;
  border:1px solid #d4e5be1f;border-radius:50%;background:#c4dfaa1a;
  color:#edf5df;stroke-width:1.5;
}
@media(min-width:1191px) and (max-width:1479px){
  .shortcuts .shortcut{gap:10px;padding:7px}
  .shortcuts .tile-icon{width:37px;height:42px;border-radius:11px}
  .shortcuts .tile-icon svg{width:25px;height:25px}
  .shortcuts .shortcut-waste .tile-icon svg{width:27px;height:29px}
  .shortcuts .shortcut-weather .tile-icon svg{width:28px;height:28px}
  .shortcuts .shortcut strong{font-size:14.5px;line-height:17px}
  .shortcuts .shortcut small{font-size:8.5px;line-height:11px;white-space:normal}
  .shortcuts .shortcut-arrow{width:24px;height:24px;padding:3px}
}
@media(min-width:1191px) and (max-width:1279px){
  .shortcuts .shortcut{gap:8px}
  .shortcuts .tile-icon{width:32px}
  .shortcuts .tile-icon svg{width:23px;height:25px}
  .shortcuts .shortcut-waste .tile-icon svg{width:25px;height:29px}
  .shortcuts .shortcut strong{font-size:14px}
  .shortcuts .shortcut-arrow{width:22px;height:22px}
}
@media(min-width:761px) and (max-width:1190px){
  .shortcuts{grid-template-columns:repeat(6,minmax(0,1fr))}
  .shortcuts>.shortcut{grid-column:span 2}
  .shortcuts>.shortcut:nth-last-child(-n+2){grid-column:span 3}
}
@media(max-width:760px){
  .shortcuts{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
  .shortcuts>.shortcut{grid-column:span 2}
  .shortcuts>.shortcut:nth-last-child(-n+2){grid-column:span 3}
  .shortcuts .shortcut{gap:9px;padding:8px}
  .shortcuts .tile-icon{width:34px;height:41px;border-radius:11px}
  .shortcuts .tile-icon svg{width:25px;height:25px}
  .shortcuts .shortcut-weather .tile-icon svg{width:28px;height:28px}
  .shortcuts .shortcut strong{font-size:15px;line-height:17px}
  .shortcuts .shortcut small{font-size:8px;line-height:11px;margin-top:4px}
  .shortcuts .shortcut-arrow{display:none}
}
@media(max-width:550px){
  .shortcuts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .shortcuts>.shortcut,.shortcuts>.shortcut:nth-last-child(-n+2){grid-column:auto}
  .shortcuts>.shortcut:last-child{grid-column:1 / -1}
  .shortcuts .shortcut{height:auto;min-height:76px}
  .shortcuts .tile-icon{width:32px;height:38px}
  .shortcuts .shortcut strong,.shortcuts .shortcut small{white-space:normal}
}
