Mini Cooper 3-Door Classic
Заказать подбор в Telegram
/* EK SINGLE (1791) — shared clean styles (one place) */
/* нормальные отступы абзацев внутри аккордеона/контента */
selector .ek-acc-glass .elementor-tab-content p,
selector .ek-acc-glass .elementor-accordion .elementor-tab-content p,
selector .ek-acc-glass .elementor-toggle .elementor-tab-content p,
selector .ek-acc-glass .e-n-accordion-content p{
margin: 0 0 10px;
}
selector .ek-acc-glass .elementor-tab-content p:last-child,
selector .ek-acc-glass .e-n-accordion-content p:last-child{
margin-bottom: 0;
}
/* SINGLE 1791 — единое стекло (ONE SOURCE) */
selector .ek-acc-wrap{
border-radius: 18px;
overflow: hidden;
border: 1px solid rgba(255,255,255,.10);
background: rgba(0,0,0,.08);
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px);
}
/* единые абзацы внутри аккордеона */
selector .ek-acc-wrap .ek-acc-glass .elementor-tab-content p{
margin: 0 0 10px;
}
selector .ek-acc-wrap .ek-acc-glass .elementor-tab-content p:last-child{
margin-bottom: 0;
}
/* =========================================
SINGLE 1791 — VISUAL TOKENS (match 978)
scoped to car-template only
========================================= */
selector{
--ek-text: rgba(255,255,255,.96);
--ek-muted: rgba(255,255,255,.72);
--ek-border: rgba(255,255,255,.14);
--ek-borderH: rgba(255,255,255,.18);
--ek-radius-card: 18px; /* как карточка 978 */
--ek-radius-btn: 14px;
--ek-glass-1: rgba(15,17,22,.70);
--ek-glass-2: rgba(15,17,22,.38);
}
/* ===== glass look для pricebar/pricecard (не трогаем ek-acc-wrap!) ===== */
selector .ek-pricebar,
selector .ek-pricecard{
border: 1px solid var(--ek-border);
border-radius: var(--ek-radius-card);
background:
radial-gradient(900px 260px at 18% 0%, rgba(255,255,255,.11), transparent 60%),
linear-gradient(180deg, var(--ek-glass-1), var(--ek-glass-2));
box-shadow: 0 20px 70px rgba(0,0,0,.55);
backdrop-filter: blur(18px) saturate(140%);
-webkit-backdrop-filter: blur(18px) saturate(140%);
overflow: hidden;
}
@media (hover: hover) and (pointer: fine){
selector .ek-pricebar:hover,
selector .ek-pricecard:hover{
border-color: var(--ek-borderH);
}
}
/* ===== типографика цены (коротко и жирно, цифры ровные) ===== */
selector .ek-price,
selector .ek-pricebar .elementor-heading-title,
selector .ek-pricecard .elementor-heading-title,
selector .ek-pricebar .elementor-shortcode,
selector .ek-pricecard .elementor-shortcode{
color: var(--ek-text) !important;
font-weight: 900 !important;
line-height: 1.05 !important;
letter-spacing: .02em !important;
font-variant-numeric: tabular-nums;
}
selector .ek-pricebar .elementor-shortcode *,
selector .ek-pricecard .elementor-shortcode *{
color: inherit !important;
font-weight: inherit !important;
line-height: inherit !important;
letter-spacing: inherit !important;
}
/* подписи/ноты */
selector .ek-note{
color: var(--ek-muted) !important;
}
/* ===== кнопки в Single: единая высота/радиус как в 978 ===== */
selector .elementor-button{
border-radius: var(--ek-radius-btn) !important;
min-height: 44px;
display: inline-flex;
align-items: center;
justify-content: center;
}
@media (max-width: 480px){
selector .elementor-button{
min-height: 38px;
}
}
/* SINGLE 1791 — Gallery (shortcode + featured image) unified */
selector .car-gallery{
overflow: hidden;
border-radius: 18px;
}
selector .car-gallery img{
border-radius: 18px !important;
display: block;
}
/* =========================================
SINGLE 1791 — Tech table + Accordion (clean)
- Таблица ek-tech: единый вид
- Аккордеон: СТРОГО только .ek-acc-glass
- Убраны дубли selector{border-radius...}
- Убраны широкие .elementor-accordion (чтобы не цеплять лишнее)
========================================= */
/* =========================
Таблица теххарактеристик
========================= */
selector .ek-tech{
display: flex;
flex-direction: column;
gap: 10px;
padding: 20px 24px;
border: 1px solid rgba(255,255,255,.12);
border-radius: 16px;
background: rgba(0,0,0,.20);
}
selector .ek-row{
display: flex;
justify-content: space-between;
align-items: baseline;
gap: 14px;
padding: 10px 0;
border-bottom: 1px dashed rgba(255,255,255,.14);
}
selector .ek-row:last-child{
border-bottom: none;
}
selector .ek-row span{
opacity: .75;
min-width: 130px;
}
selector .ek-row b{
font-weight: 800;
text-align: right;
padding-left: 14px;
font-variant-numeric: tabular-nums;
}
/* =========================
Аккордеон — ТОЛЬКО ek-acc-glass
========================= */
selector .ek-acc-glass .elementor-accordion-item{
border: 1px solid rgba(255,255,255,.10);
border-radius: 14px;
overflow: hidden;
background: rgba(0,0,0,.12);
}
selector .ek-acc-glass .elementor-tab-title{
padding: 18px 20px;
background: rgba(0,0,0,.12);
}
selector .ek-acc-glass .elementor-tab-content{
background: rgba(0,0,0,.16);
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
border-top: 1px solid rgba(255,255,255,.10);
padding: 18px 20px;
/* переносы строк из текста/шорткода */
white-space: pre-line;
line-height: 1.6;
}
/* списки внутри контента */
selector .ek-acc-glass .elementor-tab-content ul{
margin: 0;
padding-left: 18px;
}
selector .ek-acc-glass .elementor-tab-content li{
margin: 6px 0;
}
/* =========================
Мобилка — компактнее
========================= */
@media (max-width: 767px){
selector .ek-tech{
padding: 16px 16px;
border-radius: 14px;
}
selector .ek-row{
gap: 10px;
}
selector .ek-row span{
min-width: 110px;
}
selector .ek-acc-glass .elementor-tab-title{
padding: 16px 16px;
}
selector .ek-acc-glass .elementor-tab-content{
padding: 16px 16px;
border-radius: 12px;
}
}
/* =========================================
SINGLE 1791 — Catalogs + Messengers unified
One source of truth: car-template
========================================= */
selector{
--ek-text: rgba(255,255,255,.92);
--ek-muted: rgba(255,255,255,.70);
--ek-border: rgba(255,255,255,.14);
--ek-borderH: rgba(255,255,255,.18);
--ek-radius: 18px;
--ek-btn-radius: 14px;
--ek-btn-h: 44px;
--ek-glass-1: rgba(15,17,22,.70);
--ek-glass-2: rgba(15,17,22,.38);
}
/* общий “панельный” контейнер (и Каталоги, и WA/TG) */
selector .ek-panel{
position: relative;
border-radius: var(--ek-radius);
overflow: hidden;
border: 1px solid var(--ek-border);
background:
radial-gradient(900px 260px at 18% 0%, rgba(255,255,255,.11), transparent 60%),
linear-gradient(180deg, var(--ek-glass-1), var(--ek-glass-2));
box-shadow: 0 20px 70px rgba(0,0,0,.55);
backdrop-filter: blur(18px) saturate(140%);
-webkit-backdrop-filter: blur(18px) saturate(140%);
}
selector .ek-panel::after{
content:"";
position:absolute;
inset:0;
pointer-events:none;
background:
radial-gradient(120% 90% at 20% 0%,
rgba(120,200,255,0.18),
rgba(120,200,255,0.00) 55%),
radial-gradient(90% 120% at 100% 30%,
rgba(255,255,255,0.10),
rgba(255,255,255,0.00) 60%);
}
/* ===== Каталоги ===== */
selector .ek-catalogs{
padding: 18px 18px 16px;
color: var(--ek-text);
}
selector .ek-catalogs__title{
margin: 0 0 10px;
font-size: 20px;
line-height: 1.2;
font-weight: 900;
color:#fff;
letter-spacing: .2px;
}
selector .ek-catalogs__desc{
margin: 0 0 12px;
color: var(--ek-muted);
font-size: 14px;
line-height: 1.45;
}
/* сетка флагов — ровно и красиво при 3 элементах */
selector .ek-catalogs__flags{
display: grid;
grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
gap: 18px 26px;
margin-top: 12px;
justify-items: center;
align-items: start;
}
/* ссылки без “розового” */
selector .ek-catalogs__flag,
selector .ek-catalogs__flag:visited,
selector .ek-catalogs__flag:hover,
selector .ek-catalogs__flag:focus,
selector .ek-catalogs__flag:active{
text-decoration: none !important;
color: var(--ek-text) !important;
outline: none !important;
}
selector .ek-catalogs__flag{
display:flex;
flex-direction: column;
align-items: center;
gap: 8px;
}
selector .ek-catalogs__circle{
width: 72px;
height: 72px;
border-radius: 999px;
border: 1px solid rgba(255,255,255,.14);
background: rgba(0,0,0,.25);
display:flex;
align-items:center;
justify-content:center;
overflow:hidden;
box-shadow: 0 10px 22px rgba(0,0,0,.35);
transition: transform .18s ease, border-color .18s ease, filter .18s ease;
}
selector .ek-catalogs__circle img{
width: 78%;
height: 78%;
object-fit: contain;
display:block;
}
selector .ek-catalogs__label{
font-weight: 900;
letter-spacing: .35px;
text-transform: uppercase;
font-size: 13px;
opacity: .95;
text-align:center;
color: var(--ek-text) !important;
}
@media (hover:hover) and (pointer:fine){
selector .ek-catalogs__flag:hover .ek-catalogs__circle{
transform: translateY(-2px) scale(1.03);
border-color: rgba(255,255,255,.28);
filter: brightness(1.06);
}
}
/* “Назад” — как кнопка 978: высота/радиус одинаковые */
selector .ek-catalogs__links{
margin-top: 14px;
}
selector .ek-catalogs__pill{
width: 100%;
min-height: var(--ek-btn-h);
display:flex;
justify-content:center;
align-items:center;
padding: 10px 14px;
border-radius: var(--ek-btn-radius);
background: rgba(0,0,0,.25);
border: 1px solid var(--ek-border);
color: var(--ek-text) !important;
text-decoration: none !important;
font-weight: 700;
outline:none !important;
transition: transform .18s ease, border-color .18s ease, filter .18s ease;
}
@media (hover:hover) and (pointer:fine){
selector .ek-catalogs__pill:hover{
transform: translateY(-1px);
border-color: var(--ek-borderH);
filter: brightness(1.04);
}
}
/* ===== WA / TG — одинаковый размер ===== */
selector .tg-cta img,
selector .wa-cta img{
width: 78px;
height: 78px;
object-fit: contain;
display:block;
margin: 0 auto;
}
selector .tg-cta,
selector .wa-cta{
filter: drop-shadow(0 10px 26px rgba(0,0,0,.45));
transition: transform .25s ease, filter .25s ease;
}
@media (hover:hover) and (pointer:fine){
selector .tg-cta:hover,
selector .wa-cta:hover{
transform: translateY(-2px);
filter: drop-shadow(0 16px 34px rgba(0,0,0,.55));
}
}
@media (max-width: 480px){
selector{ --ek-btn-h: 38px; }
}
/* ===== Catalogs: transparent panel + bigger flags (FIX) ===== */
/* Прозрачная панель ТОЛЬКО у "Каталоги" */
selector .ek-panel--catalogs{
background: transparent !important;
backdrop-filter: none !important;
-webkit-backdrop-filter: none !important;
box-shadow: none !important;
}
/* ВАЖНО: убрать дымку/блик от общего .ek-panel::after */
selector .ek-panel--catalogs::after{
display: none !important;
}
/* Круги под флаги — без тёмной заливки */
selector .ek-panel--catalogs .ek-catalogs__circle{
background: transparent !important;
box-shadow: none !important;
border-color: rgba(255,255,255,.18) !important;
width: 90px !important;
height: 90px !important;
}
/* Иконка внутри — крупнее (убираем "провал") */
selector .ek-panel--catalogs .ek-catalogs__circle img{
width: 94% !important;
height: 94% !important;
}
/* Мобилка — компактнее */
@media (max-width: 480px){
selector .ek-panel--catalogs .ek-catalogs__circle{
width: 78px !important;
height: 78px !important;
}
selector .ek-panel--catalogs .ek-catalogs__circle img{
width: 92% !important;
height: 92% !important;
}
}
/* ===== Panels: show GLOBAL background through (glass, but transparent) ===== */
selector .ek-panel.ek-panel--global{
/* главное: прозрачная подложка вместо плотного градиента */
background: rgba(0,0,0,.08) !important;
/* оставляем стекло */
backdrop-filter: blur(18px) saturate(140%) !important;
-webkit-backdrop-filter: blur(18px) saturate(140%) !important;
/* рамку можно оставить */
border-color: rgba(255,255,255,.14) !important;
/* тень оставим, но мягче */
box-shadow: 0 18px 60px rgba(0,0,0,.40) !important;
}
/* убираем “дымку/блик”, которая перекрывает фон */
selector .ek-panel.ek-panel--global::after{
display: none !important;
}
/* ===== Catalogs: bigger flags, no “holes” ===== */
selector .ek-panel.ek-panel--global .ek-catalogs__circle{
width: 92px !important;
height: 92px !important;
background: transparent !important;
box-shadow: none !important;
}
selector .ek-panel.ek-panel--global .ek-catalogs__circle img{
width: 96% !important;
height: 96% !important;
}
@media (max-width: 480px){
selector .ek-panel.ek-panel--global .ek-catalogs__circle{
width: 78px !important;
height: 78px !important;
}
selector .ek-panel.ek-panel--global .ek-catalogs__circle img{
width: 94% !important;
height: 94% !important;
}
}