/*
Theme Name: AutoSite Dark
Theme URI: https://example.com/
Author: ShopingBro
Description: Темна швидка тема для автосайта (новини/огляди/тести) з легким 3D-ефектом карток.
Version: 0.1.2
Text Domain: autosite-dark
*/

/* =========================================================
   1) ЗМІННІ ТЕМИ
========================================================= */
:root{
  --bg:#0b0f14;
  --panel:#101826;
  --panel2:#0f1623;
  --text:#e8eef7;
  --muted:#9fb0c7;
  --line:rgba(255,255,255,.08);
  --accent:#4aa3ff;
  --accent2:#7bd389;
  --shadow:0 10px 30px rgba(0,0,0,.35);
  --radius:14px;
  --max:1120px;

  --glow:rgba(74,163,255,.18);
  --glow2:rgba(123,211,137,.14);

  --cardTop:rgba(255,255,255,.08);
  --cardBot:rgba(255,255,255,.03);

  --focus:rgba(74,163,255,.38);

  --brandLogo:52px;
  --brandLogoMaxWidth:220px;
}

/* =========================================================
   2) БАЗОВЕ СКИДАННЯ / ГЛОБАЛЬНІ СТИЛІ
========================================================= */
*{box-sizing:border-box}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth}

body{
  background:
    radial-gradient(1200px 600px at 20% -10%, rgba(74,163,255,.18), transparent 60%),
    radial-gradient(900px 500px at 90% 0%, rgba(123,211,137,.12), transparent 55%),
    var(--bg);
  color:var(--text);
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,Arial,"Apple Color Emoji","Segoe UI Emoji";
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

::selection{background:rgba(74,163,255,.24)}

:focus-visible{
  outline:2px solid var(--focus);
  outline-offset:2px;
  border-radius:10px;
}

a{color:var(--text);text-decoration:none}
a:hover{color:var(--accent)}

img{max-width:100%;height:auto;display:block}

.container{max-width:var(--max);margin:0 auto;padding:0 16px}

/* =========================================================
   3) HEADER
========================================================= */
.site-header{
  position:sticky;
  top:0;
  z-index:20;
  background:rgba(11,15,20,.88);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
  overflow:visible;
}

.site-header .header-inner{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-areas:
    "brand actions"
    "nav nav";
  align-items:center;
  gap:12px 14px;
  padding:14px 0;
  min-width:0;
}

/* =========================================================
   3.1) BRAND
========================================================= */
.site-header .brand{
  grid-area:brand;
  min-width:0;
  max-width:100%;
  overflow:hidden;
}

.site-header .brand-link,
.site-header .custom-logo-link{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
  max-width:100%;
  overflow:hidden;
}

.site-header .brand-home{
  display:flex;
  flex-direction:column;
  justify-content:center;
  line-height:1.05;
  min-width:0;
  max-width:100%;
  filter:drop-shadow(0 0 10px rgba(74,163,255,.10));
}

.site-header .brand-badge{
  width:var(--brandLogo);
  height:var(--brandLogo);
  min-width:var(--brandLogo);
  flex:0 0 var(--brandLogo);
  border-radius:14px;
  background:linear-gradient(135deg, rgba(74,163,255,.9), rgba(123,211,137,.85));
  box-shadow:var(--shadow);
  overflow:hidden;
}

.site-header .brand img,
.site-header .brand img.custom-logo{
  display:block;
  width:auto !important;
  height:var(--brandLogo) !important;
  max-height:var(--brandLogo) !important;
  max-width:var(--brandLogoMaxWidth) !important;
  min-width:0 !important;
  object-fit:contain;
  border-radius:12px;
  flex:0 0 auto;
  filter:drop-shadow(0 10px 22px var(--glow));
}

.site-header .brand-title{
  font-weight:900;
  font-size:32px;
  line-height:1.05;
  margin:0;
  padding:0;
  display:block;
  max-width:none;
  white-space:nowrap;
  overflow:visible;
  text-overflow:clip;
  background:linear-gradient(180deg, #ffffff 0%, #d7e8ff 30%, #6fb2ff 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  text-shadow:
    0 1px 0 rgba(0,0,0,.70),
    0 2px 0 rgba(0,0,0,.55),
    0 8px 18px rgba(0,0,0,.70),
    0 0 10px rgba(74,163,255,.22);
}

.site-header .brand-tagline{
  font-weight:600;
  color:var(--muted);
  font-size:12px;
  line-height:1.2;
  margin-top:3px;
  opacity:.9;
  text-shadow:0 1px 0 rgba(0,0,0,.6);
  max-width:none;
  white-space:nowrap;
  overflow:visible;
  text-overflow:clip;
}

/* =========================================================
   3.2) NAV
========================================================= */
.site-header nav.nav{
  grid-area:nav;
  min-width:0;
  display:block;
  width:100%;
  overflow-x:auto;
  overflow-y:visible;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  padding-top:4px;
}

.site-header nav.nav::-webkit-scrollbar{
  display:none;
}

.site-header nav.nav > ul,
.site-header nav.nav > .menu{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:row;
  flex-wrap:nowrap;
  gap:10px;
  align-items:center;
  justify-content:flex-start;
  width:max-content;
  min-width:100%;
}

.site-header nav.nav > ul > li,
.site-header nav.nav > .menu > li{
  margin:0;
  padding:0;
  display:inline-flex;
  align-items:center;
  position:relative;
  flex:0 0 auto;
}

.site-header nav.nav > ul > li > a,
.site-header nav.nav > .menu > li > a{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 12px;
  border-radius:999px;
  line-height:1;
  white-space:nowrap;
  color:var(--text);
  text-decoration:none;
  border:1px solid rgba(255,255,255,.16);
  background:linear-gradient(180deg, rgba(255,255,255,.11), rgba(255,255,255,.04));
  box-shadow:
    0 14px 26px rgba(0,0,0,.55),
    0 3px 0 rgba(0,0,0,.55),
    inset 0 1px 0 rgba(255,255,255,.22),
    inset 0 -2px 0 rgba(0,0,0,.55);
  transform:translateY(-0.5px);
  transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease, filter .12s ease;
}

.site-header nav.nav > ul > li > a::before,
.site-header nav.nav > .menu > li > a::before{
  content:"";
  position:absolute;
  left:10px;
  right:10px;
  top:6px;
  height:40%;
  border-radius:999px;
  background:linear-gradient(180deg, rgba(255,255,255,.28), rgba(255,255,255,0));
  pointer-events:none;
  opacity:.9;
}

.site-header nav.nav > ul > li > a::after,
.site-header nav.nav > .menu > li > a::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:999px;
  background:radial-gradient(120% 120% at 50% 0%, rgba(255,255,255,.10), rgba(0,0,0,0) 60%);
  pointer-events:none;
  opacity:.9;
}

.site-header nav.nav > ul > li > a:hover,
.site-header nav.nav > .menu > li > a:hover{
  border-color:rgba(74,163,255,.55);
  transform:translateY(-2px);
  filter:brightness(1.05);
  box-shadow:
    0 18px 32px rgba(0,0,0,.60),
    0 4px 0 rgba(0,0,0,.60),
    0 0 0 4px rgba(74,163,255,.12),
    0 0 24px rgba(74,163,255,.22),
    inset 0 1px 0 rgba(255,255,255,.26),
    inset 0 -2px 0 rgba(0,0,0,.60);
}

.site-header nav.nav > ul > li > a:active,
.site-header nav.nav > .menu > li > a:active{
  transform:translateY(0);
  filter:brightness(0.98);
  box-shadow:
    0 10px 18px rgba(0,0,0,.55),
    0 1px 0 rgba(0,0,0,.55),
    inset 0 3px 10px rgba(0,0,0,.60);
}

.site-header nav.nav .current-menu-item > a,
.site-header nav.nav .current_page_item > a{
  border-color:rgba(123,211,137,.55);
  box-shadow:
    0 18px 32px rgba(0,0,0,.60),
    0 4px 0 rgba(0,0,0,.60),
    0 0 0 4px rgba(123,211,137,.12),
    0 0 24px rgba(123,211,137,.18),
    inset 0 1px 0 rgba(255,255,255,.26),
    inset 0 -2px 0 rgba(0,0,0,.60);
}

/* submenus */
.site-header nav.nav .sub-menu{
  list-style:none;
  margin:10px 0 0;
  padding:10px;
  position:absolute;
  top:100%;
  left:0;
  min-width:220px;
  display:none;
  flex-direction:column;
  gap:8px;
  background:rgba(11,15,20,.96);
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  box-shadow:0 18px 55px rgba(0,0,0,.60);
  z-index:50;
}

.site-header nav.nav li:hover > .sub-menu{
  display:flex;
}

.site-header nav.nav .sub-menu li{
  display:flex;
  margin:0;
  padding:0;
}

.site-header nav.nav .sub-menu a{
  display:flex;
  width:100%;
  justify-content:flex-start;
  white-space:nowrap;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  box-shadow:none;
  transform:none;
}

.site-header nav.nav .sub-menu a:hover{
  border-color:rgba(74,163,255,.45);
  background:rgba(255,255,255,.07);
  box-shadow:none;
}

/* =========================================================
   3.3) Header actions / Search
========================================================= */
.site-header .header-actions{
  grid-area:actions;
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:flex-end;
  min-width:0;
}

.searchform,
.search-form{
  display:flex;
  gap:8px;
  align-items:center;
}

.searchform input,
.search-form input[type="search"]{
  width:180px;
  max-width:180px;
  padding:10px 12px;
  border-radius:12px;
  background:rgba(255,255,255,.06);
  border:1px solid var(--line);
  color:var(--text);
  outline:none;
}

.searchform input:focus,
.search-form input[type="search"]:focus{
  border-color:rgba(74,163,255,.5);
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.06);
  color:var(--text);
}
.btn:hover{border-color:rgba(74,163,255,.45)}

/* =========================================================
   5) CARDS
========================================================= */
.card{
  position:relative;
  background:linear-gradient(180deg, var(--cardTop), var(--cardBot));
  border:1px solid rgba(255,255,255,.10);
  border-radius:var(--radius);
  box-shadow:
    0 22px 55px rgba(0,0,0,.55),
    0 6px 18px rgba(0,0,0,.35);
  overflow:hidden;
  transform:translateZ(0);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.card::before{
  content:"";
  position:absolute;
  inset:-2px;
  background:
    radial-gradient(900px 220px at 20% 0%, var(--glow), transparent 60%),
    radial-gradient(900px 220px at 80% 0%, var(--glow2), transparent 60%);
  opacity:.85;
  pointer-events:none;
  filter:blur(10px);
}

.card::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(255,255,255,.10), transparent 30%);
  opacity:.55;
  pointer-events:none;
}

.card:hover{
  transform:translateY(-4px);
  border-color:rgba(74,163,255,.25);
  box-shadow:
    0 28px 70px rgba(0,0,0,.62),
    0 10px 22px rgba(0,0,0,.38);
}

.card > *{position:relative;z-index:1}
.card-pad{padding:16px}

/* =========================================================
   6) TYPO HELPERS
========================================================= */
.kicker{color:var(--muted);font-size:13px}
.h1{font-size:34px;line-height:1.15;margin:8px 0 10px;font-weight:900}
.h2{font-size:22px;margin:0 0 10px;font-weight:850}
.meta{color:var(--muted);font-size:13px;display:flex;gap:10px;flex-wrap:wrap}

/* =========================================================
   7) HERO / GRIDS
========================================================= */
.hero{padding:26px 0 10px}

.hero-grid{
  display:grid;
  grid-template-columns:1.25fr .75fr;
  gap:16px;
}

.grid{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  gap:16px;
  padding:10px 0 28px;
}

.col-8{grid-column:span 8}
.col-4{grid-column:span 4}

.section-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin:18px 0 10px;
}
.section-title h2{
  margin:0;
  font-size:18px;
  color:var(--text);
}
.pill{
  font-size:12px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--line);
  color:var(--muted);
  background:rgba(255,255,255,.04);
}

/* =========================================================
   8) POST LIST ITEMS
========================================================= */
.post-card{
  display:flex;
  gap:12px;
  padding:14px;
  border-top:1px solid var(--line);
  transition:transform .18s ease, background .18s ease;
}
.post-card:first-child{border-top:none}

.post-card:hover{
  transform:translateY(-2px);
  background:rgba(255,255,255,.03);
}

.thumb{
  width:120px;
  min-width:120px;
  height:78px;
  border-radius:12px;
  background:rgba(255,255,255,.06);
  border:1px solid var(--line);
  overflow:hidden;
  box-shadow:0 14px 30px rgba(0,0,0,.45);
}

.post-card h3{
  margin:0 0 6px;
  font-size:16px;
  line-height:1.25;
}
.post-card p{
  margin:0;
  color:var(--muted);
  font-size:13px;
}

/* =========================================================
   9) SINGLE
========================================================= */
.single-wrap{padding:18px 0 34px}

.single-hero{padding:18px}
.single-hero h1{
  margin:0 0 10px;
  font-size:34px;
  line-height:1.15;
}

.content{padding:0 18px 18px}

.content p{margin:0 0 14px}
.content h2{margin:22px 0 10px}
.content h3{margin:18px 0 8px}
.content ul{margin:0 0 14px;padding-left:18px}

.content blockquote{
  margin:16px 0;
  padding:14px 14px 14px 16px;
  border-left:3px solid rgba(74,163,255,.6);
  background:rgba(255,255,255,.04);
  border-radius:12px;
  color:var(--muted);
}

/* =========================================================
   10) WP CONTENT POLISH
========================================================= */
.content a{color:var(--accent)}
.content a:hover{color:var(--text)}

.content img{border-radius:12px}

.content pre{
  margin:0 0 14px;
  padding:14px;
  border-radius:12px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.04);
  overflow:auto;
}
.content code{
  padding:2px 6px;
  border-radius:10px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.04);
}

.content table{
  width:100%;
  border-collapse:collapse;
  margin:0 0 14px;
  overflow:hidden;
  border-radius:12px;
}
.content th,.content td{
  border:1px solid var(--line);
  padding:10px;
  text-align:left;
}
.content th{background:rgba(255,255,255,.04)}

/* =========================================================
   11) PAGINATION
========================================================= */
nav.pagination,
.pagination{
  width:100%;
  display:flex;
  justify-content:center;
  margin:18px 0 0;
}

nav.pagination .page-numbers,
.pagination .page-numbers{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
  justify-content:center;
}

nav.pagination .page-numbers li,
.pagination .page-numbers li{
  margin:0;
  padding:0;
  display:inline-flex;
  width:auto;
  float:none;
}

nav.pagination .page-numbers a,
nav.pagination .page-numbers span,
.pagination .page-numbers a,
.pagination .page-numbers span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:40px;
  min-width:40px;
  padding:0 14px;
  border-radius:999px;
  text-decoration:none;
  line-height:1;
  white-space:nowrap;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.10);
  color:var(--text);
}

nav.pagination .page-numbers a:hover,
.pagination .page-numbers a:hover{
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.18);
}

nav.pagination .page-numbers .current,
.pagination .page-numbers .current{
  background:rgba(255,255,255,.12);
  border-color:rgba(255,255,255,.25);
  font-weight:700;
}

nav.pagination .page-numbers .prev,
nav.pagination .page-numbers .next,
.pagination .page-numbers .prev,
.pagination .page-numbers .next{
  padding:0 16px;
}

/* =========================================================
   12) FOOTER
========================================================= */
.site-footer{
  border-top:1px solid var(--line);
  padding:18px 0;
  color:var(--muted);
}
.footer-inner{
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
}

/* =========================================================
   13) AUTH MODAL
========================================================= */
html.is-auth-open,
html.is-auth-open body{overflow:hidden}

.auth-modal{
  position:fixed;
  inset:0;
  z-index:9999;
  display:none;
}
.auth-modal.is-open{display:block}

.auth-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.60);
  backdrop-filter:blur(6px);
}

.auth-dialog{
  position:relative;
  width:min(520px, calc(100% - 28px));
  margin:10vh auto 0;
  background:linear-gradient(180deg, var(--cardTop), var(--cardBot));
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  box-shadow:0 30px 90px rgba(0,0,0,.65);
  overflow:hidden;
}

.auth-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 16px;
  border-bottom:1px solid var(--line);
}
.auth-title{font-weight:900;letter-spacing:.2px}

.auth-x{
  border:1px solid var(--line);
  background:rgba(255,255,255,.06);
  color:var(--text);
  border-radius:12px;
  padding:8px 10px;
  cursor:pointer;
}
.auth-x:hover{border-color:rgba(74,163,255,.45)}

.auth-tabs{
  display:flex;
  gap:8px;
  padding:12px 16px;
  border-bottom:1px solid var(--line);
}
.auth-tab{
  border:1px solid var(--line);
  background:rgba(255,255,255,.05);
  color:var(--muted);
  border-radius:999px;
  padding:8px 12px;
  cursor:pointer;
}
.auth-tab.is-active{
  color:var(--text);
  border-color:rgba(74,163,255,.35);
  background:rgba(74,163,255,.10);
}

.auth-pane{display:none;padding:14px 16px 16px}
.auth-pane.is-active{display:block}

.auth-form{display:flex;flex-direction:column;gap:10px}

.auth-label{
  display:flex;
  flex-direction:column;
  gap:6px;
  color:var(--muted);
  font-size:13px;
}

.auth-input{
  padding:10px 12px;
  border-radius:12px;
  background:rgba(255,255,255,.06);
  border:1px solid var(--line);
  color:var(--text);
  outline:none;
}
.auth-input:focus{border-color:rgba(74,163,255,.5)}

.auth-check{
  display:flex;
  gap:10px;
  align-items:center;
  color:var(--muted);
  font-size:13px;
  margin-top:2px;
}

.auth-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.06);
  color:var(--text);
  cursor:pointer;
}
.auth-btn:hover{border-color:rgba(74,163,255,.45)}

.auth-btn--primary{
  border-color:rgba(74,163,255,.40);
  background:rgba(74,163,255,.12);
}
.auth-btn--primary:hover{background:rgba(74,163,255,.16)}

.auth-btn--ghost{background:transparent}

.auth-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:6px;
}

.auth-note{
  margin:0 0 10px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.04);
  color:var(--muted);
  font-size:13px;
}
.auth-note--bad{
  border-color:rgba(255,92,92,.35);
  background:rgba(255,92,92,.10);
  color:rgba(255,255,255,.92);
}
.auth-note--ok{
  border-color:rgba(123,211,137,.35);
  background:rgba(123,211,137,.10);
  color:rgba(255,255,255,.92);
}

/* =========================================================
   14) RESPONSIVE
========================================================= */
@media (max-width: 920px){
  .hero-grid{grid-template-columns:1fr}
  .col-8,.col-4{grid-column:span 12}

  :root{
    --brandLogo:46px;
    --brandLogoMaxWidth:180px;
  }

  .site-header .header-inner{
    grid-template-columns:1fr auto;
    grid-template-areas:
      "brand actions"
      "nav nav";
    row-gap:10px;
  }

  .site-header .brand{
    max-width:none;
  }

  .site-header nav.nav{
    overflow-x:visible;
  }

  .site-header .brand-title{
    font-size:26px;
    max-width:none;
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
  }

  .site-header .brand-tagline{
    font-size:12px;
    max-width:none;
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
  }

  .searchform input,
  .search-form input[type="search"]{
    width:160px;
    max-width:160px;
  }

  .site-header nav.nav > ul,
  .site-header nav.nav > .menu{
    width:100%;
    min-width:0;
    flex-wrap:wrap;
  }
}

@media (max-width: 520px){
  :root{
    --brandLogo:40px;
    --brandLogoMaxWidth:140px;
  }

  .site-header .brand-title{
    font-size:21px;
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
    text-shadow:
      0 1px 0 rgba(0,0,0,.70),
      0 2px 0 rgba(0,0,0,.55),
      0 6px 14px rgba(0,0,0,.65),
      0 0 10px rgba(74,163,255,.28);
  }

  .site-header .brand-tagline{
    display:none;
  }

  .searchform input,
  .search-form input[type="search"]{
    width:132px;
    max-width:132px;
  }
}

/* =========================================================
   CONTENT IMAGES FULL WIDTH
========================================================= */
.content .wp-block-image,
.content figure.wp-block-image{margin:14px 0}

.content .wp-block-image img,
.content figure.wp-block-image img,
.content p > img{
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
  border-radius:12px;
}

.content figcaption{
  margin-top:8px;
  font-size:12px;
  color:var(--muted);
  opacity:.9;
}

/* =========================================================
   TOP USERS PODIUM
========================================================= */
.sb-top-podium{
  display:flex;
  flex-direction:row;
  justify-content:center;
  align-items:stretch;
  gap:16px;
  margin:24px 0 24px;
  flex-wrap:wrap;
}

.sb-top-podium .sb-podium-item{
  flex:1 1 180px;
  min-width:180px;
  max-width:240px;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  padding:16px 14px;
  text-align:center;
  box-shadow:
    0 18px 40px rgba(0,0,0,.55),
    0 6px 18px rgba(0,0,0,.35);
}

.sb-top-podium .sb-podium-1,
.sb-top-podium .sb-podium-2,
.sb-top-podium .sb-podium-3{
  transform:none;
  margin-bottom:0;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
}

.sb-top-podium .sb-place{
  font-size:28px;
  line-height:1;
  margin:0 0 8px;
}

.sb-top-podium .sb-name{
  font-weight:800;
  margin:0 0 6px;
}

.sb-top-podium .sb-score{
  font-size:13px;
  opacity:.85;
  margin:0;
}

@media (max-width:700px){
  .sb-top-podium{
    flex-direction:column;
    align-items:center;
  }
  .sb-top-podium .sb-podium-item{
    width:100%;
    max-width:320px;
    min-width:0;
  }
}
/* =========================================================
   FIX: блок "Ціни сьогодні" після футера на сторінках
   ========================================================= */

.mhc-digest-auto-footer{
	display:block !important;
	width:100% !important;
	max-width:100% !important;
	clear:both !important;
	margin:24px 0 0 0 !important;
	padding:0 16px 24px !important;
	position:relative !important;
	left:auto !important;
	right:auto !important;
	bottom:auto !important;
	float:none !important;
	box-sizing:border-box !important;
}

.mhc-digest-footer-widget{
	display:block !important;
	width:100% !important;
	max-width:1200px !important;
	margin:0 auto !important;
	padding:16px 18px !important;
	background:#111 !important;
	border:1px solid rgba(255,255,255,.10) !important;
	border-radius:16px !important;
	box-sizing:border-box !important;
	float:none !important;
	position:relative !important;
	left:auto !important;
	right:auto !important;
	bottom:auto !important;
	overflow:hidden !important;
}

.mhc-digest-footer-title{
	display:block !important;
	margin:0 0 14px 0 !important;
	font-size:20px !important;
	line-height:1.2 !important;
	font-weight:800 !important;
}

.mhc-digest-prices.is-compact{
	display:grid !important;
	grid-template-columns:repeat(auto-fit, minmax(160px, 1fr)) !important;
	gap:12px !important;
	width:100% !important;
	margin:0 0 16px 0 !important;
	padding:0 !important;
}

.mhc-digest-price-item{
	display:flex !important;
	flex-direction:column !important;
	justify-content:center !important;
	align-items:flex-start !important;
	min-height:72px !important;
	padding:12px 14px !important;
	border-radius:12px !important;
	background:rgba(255,255,255,.04) !important;
	border:1px solid rgba(255,255,255,.08) !important;
	box-sizing:border-box !important;
	text-align:left !important;
	float:none !important;
	position:relative !important;
	left:auto !important;
	right:auto !important;
	bottom:auto !important;
}

.mhc-digest-price-item span{
	display:block !important;
	margin:0 0 6px 0 !important;
	font-size:13px !important;
	line-height:1.35 !important;
	opacity:.85 !important;
}

.mhc-digest-price-item strong{
	display:block !important;
	margin:0 !important;
	font-size:22px !important;
	line-height:1.2 !important;
	font-weight:800 !important;
}

.mhc-digest-btn{
	display:inline-flex !important;
	align-items:center !important;
	justify-content:center !important;
	margin:0 !important;
	padding:10px 16px !important;
	border-radius:12px !important;
	text-decoration:none !important;
	position:static !important;
	left:auto !important;
	right:auto !important;
	bottom:auto !important;
	float:none !important;
	visibility:visible !important;
	opacity:1 !important;
	white-space:nowrap !important;
}

/* окремо для сторінок */
body.page .mhc-digest-auto-footer{
	display:block !important;
	clear:both !important;
}

body.page .mhc-digest-footer-widget{
	width:100% !important;
	margin:0 auto !important;
}

body.page .mhc-digest-prices.is-compact{
	display:grid !important;
	grid-template-columns:repeat(auto-fit, minmax(160px, 1fr)) !important;
}

/* мобілка */
@media (max-width: 767px){
	.mhc-digest-auto-footer{
		padding:0 12px 20px !important;
	}

	.mhc-digest-footer-widget{
		padding:14px !important;
	}

	.mhc-digest-prices.is-compact{
		grid-template-columns:1fr 1fr !important;
		gap:10px !important;
	}

	.mhc-digest-price-item strong{
		font-size:20px !important;
	}
}

@media (max-width: 480px){
	.mhc-digest-prices.is-compact{
		grid-template-columns:1fr !important;
	}
}