﻿.type-tab > div { display:flex;  justify-content:center;  padding:0 20px; }
.type-tab a { font: 700 14px/1 'NT',sans-serif; letter-spacing: -.3px; color: #364A54; cursor: pointer; padding: 20px 15px 15px 15px; position: relative; transition: color 0.3s; }
.type-tab > div .m-tab--active { color: #111;  font: 700 15px/1 'NT',sans-serif; }
.type-tab > div .m-tab--active::after { content: "";  position: absolute;  bottom: 0;  left: 0; width: 100%;  height: 3px; background: #3A49A0; border-radius: 2px 2px 0 0; }
.header-inner {  display:block; background-color: #fff; padding-left: 40px; padding-right: 40px; height: 74px; margin: 0 auto;  display:flex; justify-content:space-between;  z-index:10; opacity: 1; }
.header-search { display:flex; justify-content:flex-end; width: 32px; height: 64px; margin:0 0 0 5px; }
.burger { z-index: 10; width: 28px; height: 74px; padding:0 10px 0 0; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-end; }
.logo { display:flex; align-items:center; justify-content:center; width:32px; height:74px; padding:0 10px; text-decoration:none; }
.nav-wrapper { flex:1; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; -ms-overflow-style:none; position:relative; z-index:0; height:74px; }
.nav-wrapper::-webkit-scrollbar { display:none; }
.nav-fade { position:relative; width:10px; height:74px; z-index:2; pointer-events:none; }
.nav-fade-left { left:10px; background:linear-gradient(to right, rgba(255,255,255,1), rgba(255,255,255,0)); }
.nav-fade-right { left:-10px; background:linear-gradient(to left, rgba(255,255,255,1), rgba(255,255,255,0)); }
.nav-header { height:74px; display:flex; align-items:center; width:auto; }
.main-menu { display:flex; list-style:none; padding:0; margin:0; }
.menu-group { display:flex; align-items:center; padding:0 10px; position:relative; top:-1px; }
.menu-group:not(:first-child)::before { content:""; position:absolute; left:0; top:50%; transform:translateY(-50%); width:1px; height:30px; background:#DFE6EA; }
.menu-group a { padding: 0 10px; text-decoration: none; color: #111; font: 800 15px 'NT', sans-serif; letter-spacing: -0.1px; white-space: nowrap; height: 74px; display: flex; align-items: center; transition: color 0s; }
.footer-gag { height:20px; width:100%; background-color:#fff; position:relative; z-index:8;  border-bottom:1px solid  #DFE6EA;  margin: 0 auto 0 auto; min-width:280px; max-width: 1110px; }
footer { display:flex; background-color:#fff; justify-content:center; position: relative; z-index: 1; width:100%; margin: 0 auto 0 auto; min-width:280px; max-width: 1110px; padding:30px 0 50px 0; box-shadow: 0 0 15px rgba(0, 0, 0,0.5);  }
.footer-left-menu { display: flex; flex-wrap: wrap; gap:30px; position:relative; align-items:flex-start; }
.footer-left-menu div { display: flex; flex-wrap: wrap; width: calc(50% - 15px); align-items:flex-start; }
.footer-left-menu div section { display: flex; width:100%; flex-wrap: wrap; align-items:flex-start; }
.footer-left-menu div section a.footer-menu-title { display: flex; width:100%; font:800 16px/1 'NT',sans-serif; letter-spacing:-.2px;  color:#111; margin-left:0 !important; margin-right:0 !important; padding:5px 0 6px 0; position:relative; top:-1px; }
.footer-left-menu div section a { display: flex; width: calc(50% - 10px); font:500 15px/1 'NT',sans-serif; letter-spacing:-.2px; color:#2E3F47; padding:6px 0; }
.footer-left-menu div section a:nth-child(odd) { margin-left: 10px; }
.footer-left-menu div section a:nth-child(even) { margin-right: 10px;  }
.footer-left-menu div section a:hover { color:#3A49A0; text-decoration:underline; }
.footer-left-menu div span { display:flex; width:100%; height:27px; }
.subscribe-form { display:flex; width:100%; gap:15px; align-items:center; font:15px/1.4 'NT',sans-serif; color:#54707F; }
.subscribe-form input { width:calc(74% - 10px); padding-left:10px; height:30px; border:1px solid #DFE6EA; border-radius:6px; background:#E7ECEF; color:#54707F; font:500 14px/1 'NT',sans-serif; letter-spacing:-.2px; transition:.2s; outline:none; }
.subscribe-form input::placeholder { color:#9CAAB4; font-weight:400; }
.subscribe-form input:focus { background:#fff; color:#111; font-size:15px; }
.subscribe-form button { width:26%; height:34px; background:#3A49A0; color:#fff; border:1px solid #323F89; font:700 14px/1 'NT',sans-serif; letter-spacing:-.2px; border-radius:6px; cursor:pointer; transition:.2s; }
.subscribe-form button:hover { background:#45BC45; border:1px solid #3FAD3F; }
.subscribe-about { color:#52707F; font:500 14px/20px 'NT',sans-serif; letter-spacing:-.2px; padding:15px 10% 0 0; }
.subscribe-soc { display:flex; gap:20px; width:100%; padding:25px 0 30px 0; border-bottom:1px solid #DFE6EA; }
.subscribe-soc a { display:flex; width:32px; height:32px; background-color:#262626; border-radius:50%; justify-content: center; align-items: center; }
.footer-site { display:flex; justify-content:space-between; padding:30px 0 0 0; }
.footer-site a:nth-of-type(1) { width:108px; height:30px; margin:3px 0 0 0; }
.footer-site a:nth-of-type(1) img { width: 100%; height: 100%; object-fit: contain; }
.footer-site a:nth-of-type(2) { width:50%; max-width:120px; height:32px; border:1px solid #E0E7EB;  border:1px solid #E0E7EB; background-color:#fff; color:#445966; font:400 13px/1 'NT',sans-serif; border-radius:6px; letter-spacing:-.2px; display:flex;justify-content: center; align-items: center; }
.footer-site a:nth-of-type(2):hover { color:#33434D; border:1px solid #C6D3DB; background-color:#CDD8DE; }
.footer-about { color:#52707F; font:500 13px/20px 'NT',sans-serif; letter-spacing:-.2px; padding:21px 0 0 0; }
.whoa-wall { transition:opacity .5s ease; opacity:1; position:fixed; top:0; bottom:0; left:0; right:0; z-index:0; }
.whoa-wall::after { content: ""; position: absolute; top: 0; left: 50%; transform: translateX(-50%); pointer-events: none; background: transparent; }
.whoa-teaser { display:flex; gap:30px; margin: 25px 0 27px 0; }
.whoa-teaser a { display:flex; position:relative; z-index:2;  justify-content:space-between; align-items:center; width:100%; height:83px; padding:0 20px 1px 20px; border:1px solid #E1E9EC; border-radius:7px; box-shadow: 0 2px 10px rgba(142, 156, 164, 0.15); background-repeat: no-repeat; background-position: center right;  background-size: 188px 84px; }
.whoa-teaser a i:nth-of-type(1) { width:31%;  }
.whoa-teaser a i:nth-of-type(1) img { display:block; width:84px; }
.whoa-teaser a b:nth-of-type(1) { width:35%; text-align:right; padding:0 12px 0 8px; font: 700 15px/1 'NT', sans-serif;  letter-spacing: -.4px;  color:#3F5A6B;  }
.whoa-teaser a u:nth-of-type(1) { width:34%; max-width:96px; white-space: nowrap; text-align:center; position:relative; z-index:4;  text-decoration: none; height: 30px; background-color: #3A49A0; border-radius: 5px; text-align: center; border: 1px solid #34428F; box-shadow: 0 2px 2px rgba(142, 156, 164, 0.3); transition: all 0.2s ease;}
.whoa-teaser a u:nth-of-type(1) i { font-style: normal; font: 700 15px/31px 'NT', sans-serif;  letter-spacing: -.4px; text-shadow: 0 0 2px rgba(17, 17, 17, 0.1); color: #fff;}
.whoa-teaser a u:nth-of-type(1) i:nth-of-type(1) { padding:0 5px 0 10px; }
.whoa-teaser a u:nth-of-type(1) i:nth-of-type(2) { padding:0 10px 0 0; }
.whoa-teaser a:hover { box-shadow: 0 2px 10px rgba(142, 156, 164, 0.25); }
.whoa-teaser a:hover u:nth-of-type(1) { background-color: #293472; box-shadow: 1px 2px 3px rgba(142, 156, 164, 0.3), -1px 2px 3px rgba(142, 156, 164, 0.3); }
.whoa-teaser a:active u:nth-of-type(1)  { position: relative; top: 1px; box-shadow: none; }
.whoa-teaser-two { display:flex; gap:30px; }
.whoa-teaser-two a { width:50%;  }
.whoa-teaser-bg1 {  background-image:url(/i/v17/i/ic_tiz_1.png);}
.whoa-teaser-bg2 {  background-image:url(/i/v17/i/ic_tiz_2.png);}
.whoa-teaser-bg3 {  background-image:url(/i/v17/i/ic_tiz_3.png);}
.whoa-teaser-bg4 {  background-image:url(/i/v17/i/ic_tiz_4.png);}
.whoa-teaser-bg5 {  background-image:url(/i/v17/i/ic_tiz_5.png);}
.whoa-teaser-bg6 {  background-image:url(/i/v17/i/ic_tiz_6.png);}
.whoa-teaser-bg7 {  background-image:url(/i/v17/i/ic_tiz_7.png);}
.whoa_card_fonbet u:nth-child(1) i, .whoa_card_fonbet u:nth-child(4)  { background-color:#D4282B;  }

.pro-gift { opacity: 0; transform: translateY(-150%); will-change: transform, opacity; transition: transform 0.4s, opacity 0.28s; width:90px; height:90px; position:relative; top:-8px; display:flex; align-items:center; justify-content:center; border-radius:50%;  position:relative; z-index:2;  }
.pro-gift.is-hidden { display: none !important; }
.pro-gift a { display:block; border-radius:50%;  width:90px; height:90px; }
.pro-gift.frame-4 { border-radius:50%;   }
.gift-frame { position:absolute; top:0; left:0; width:100%; height:100%; display:flex; flex-direction:column; justify-content:center; align-items:center; opacity:0; transform:translateY(-20px); transition:opacity .5s ease, transform .5s ease; text-align:center; }
.pro-gift.frame-1 .gift-icon { opacity:1; transform:translateY(0); }
.gift-icon .box { width:64px; height:64px; background-image: url('/i/v17/i/ic_whoa_gift.png?3'); background-repeat: no-repeat, no-repeat; background-position: center center; background-size: 36px 36px; border-radius:50%; }
.pro-gift.frame-2 .gift-text { opacity:1; transform:translateY(0); position:relative; top:-1px; }
.gift-frame.gift-text .line1, .gift-frame.gift-text .line2 { opacity: 0; transform: translateY(-20px); transition: opacity .5s ease, transform .5s ease; }
.pro-gift.frame-2 .gift-text .line1 { transition-delay:.5s; opacity:1; transform:translateY(0); letter-spacing:-.2px;  }
.pro-gift.frame-2 .gift-text .line2 { transition-delay:1s; opacity:1; transform:translateY(0);  letter-spacing:-.2px; }
.pro-gift.frame-3 .gift-button { opacity:1; transform:translateY(0); }
.pro-gift.frame-4 .gift-partner { opacity:1; transform:translateY(0); }
.pro-gift.frame-4 .partner-logo { opacity:1; transform:translateY(0); background-repeat: no-repeat, no-repeat; background-position: center center; background-size: 70px 24px; width:100%; height:24px; }
.article-match-info > a:nth-of-type(1) span {  opacity:1; padding:0 17px 0 0;  }
.article-match-info > a:nth-of-type(2) span {  opacity:1; padding:0 0 0 17px;  }
.whoa-690-text { margin:-10px 0 35px 0; max-width:690px; border-radius: 7px; overflow: hidden;}
.whoa-690-text > iframe, .whoa-690-text > a, .whoa-690-text > a > img { display:block; }

@media (max-width: 900px) { 
footer { flex-wrap: wrap; box-shadow: none; }
.footer-gag { display:none; }
.footer-left-menu div { width: 100%; }
.footer-left-menu div:nth-of-type(2) { padding-top:16px; }
.footer-left-menu div section a.footer-menu-title { display:flex; width:100%;  padding:2px 0 8px 0;  border-bottom:1px solid #DEE6EB; margin-bottom:5px; }
.footer-left-menu div section a { display:inline-block; width: auto; height:auto; padding:7px 0; margin-left:0 !important; margin-right:16px !important; }
.footer-left-menu div section a:nth-child(odd) {order: 1; }
.footer-left-menu div section a:nth-child(even) { order: 2; }
.footer-left-menu div span { height:16px; }
.footer-left-menu { gap:0; }
.subscribe-form  { border-top:1px solid #DEE6EB;  padding-top:25px; margin-top:25px; }
.footer-site { padding:25px 0 0 0;  }
.whoa-wall, .whoa-wall::after { display:none; } 
}

@media (max-width: 767px) { 
.section-tiz-bb-mob a:first-child { padding: 0 0 21px 0; }
.section-tiz-bb-mob  { border-top:0; } 
.section-tiz-bb-mob a:last-child { padding: 21px 0 0 0; }
.nav-wrapper { height:64px; }
.header-inner { padding-left: 30px; padding-right: 30px; }
.header-inner, .burger, .logo, .nav-fade, .nav-header, .menu-group a  { height: 64px;  }
.whoa-super { box-shadow: 0 1px 12px 0 rgba(51, 68, 77,0.25); }


.whoa_catfish{
padding-bottom: env(safe-area-inset-bottom); 
  position: fixed;
  left: 0;
  bottom: 0;                 /* ключевая правка */
  width: 100%;
  height: 70px;
  display: flex;
  justify-content: center;
  background:#33444D;        /* чтобы было видно область */
  color:#fff;
  transform: translateY(100%);       /* старт: полностью за пределами снизу */
  will-change: transform;
  z-index: 999;
box-shadow: 0 0 15px rgba(0,0,0,.2); 
animation: catfishUp 0.6s cubic-bezier(0.2, 0.8, 0.2, 1) forwards 3s;
}

@keyframes catfishUp{
  from{ transform: translateY(100%); }
  to  { transform: translateY(0); }
}

.ifrcent { width: 100%; min-width: 767px; position: absolute; left: 50%; transform: translateX(-50%); border: none;  }
.whoa_catfish_a { display:block; height:70px; }
.whoa_catfish_a img { display:block; }
}

@media (max-width: 640px) { 
.header-inner { padding-left: 20px; padding-right: 20px; }
.logo { padding-left:5px; padding-right:0; }
.pro-gift { width:82px; height:82px; top:-7px; }
.pro-gift a { width:82px; height:82px; }
.gift-icon .box { background-size: 36px 36px; }
.pro-gift-1win.frame-2 .gift-text .line1 { font: 700 13px/18px 'NT', sans-serif;   }
.pro-gift-1win.frame-2 .gift-text .line2 { font: 900 20px/1 'NT', sans-serif; }
footer { padding:30px 0 50px 0; border-top:1px solid  #DFE6EA;  }
.whoa-teaser-two { flex-direction:column; gap:25px; }
.whoa-teaser a { padding:0 25px 1px 25px; width:calc(100% - 50px); }
.whoa-teaser a i:nth-of-type(1) img { width:100%; max-width:100px; }
.whoa-teaser a b:nth-of-type(1) { padding:0 10px; font: 700 16px/1 'NT', sans-serif;  }
.whoa-teaser a u:nth-of-type(1) { max-width:120px; }
.whoa_intrs_wrap { display:block; position: relative; z-index:400; height: 850px; margin:-10px -20px 30px -20px; box-shadow: 0 0 15px rgba(0,0,0,.2); background-color:#111; }
.whoa_intrs_creative_wrap { display:block; position: absolute; width: 100%; height: 850px; clip: rect(0px, 1000px, 850px, 0px); }
.whoa_intrs_creative { position: fixed; height: 1000px; top: 50%; margin-top: -500px; left: 50%; backface-visibility: hidden; transform: translate3d(-50%, 0, 0);  }
}

@media (max-width: 490px) { 
.type-tab > div { justify-content:flex-start;  }
}

@media (max-width: 420px) { 
.type-tab > div { justify-content:space-between;  }
.whoa-teaser a i:nth-of-type(1) { width:35%;  }
.whoa-teaser a b:nth-of-type(1) { width:31%;  font: 700 15px/1 'NT', sans-serif;  }
.whoa-teaser a { padding:0 18px 1px 18px; width:calc(100% - 36px); }
}