/* E-Motors v8.6 — presentation only, 2026-09-10.
   Loaded after the existing ProAuctions styles; no functional hooks changed.
   Remove the marked stylesheet link to restore the original appearance. */
@font-face{font-family:Inter;src:url('./Inter-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:Inter;src:url('./Inter-SemiBold.ttf') format('truetype');font-style:normal;font-weight:600 900;font-display:swap}
@font-face{font-family:Oswald;src:url('./Oswald-Bold.ttf') format('truetype');font-style:normal;font-weight:700;font-display:swap}
/* Legacy components name their fonts directly. These aliases apply the
   approved font files without rewriting component templates or selectors. */
@font-face{font-family:'Clinica Pro';src:url('./Inter-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'Bebas Neue';src:url('./Oswald-Bold.ttf') format('truetype');font-style:normal;font-weight:400 700;font-display:swap}

:root{
  --em-graphite:#303431;--em-surface:#3A3E3B;--em-surface-3:#555B57;
  --em-ink:#131619;--em-paper:#FFFFFF;--em-neutral:#F2F3F2;
  --em-yellow:#F2C230;--em-muted:#C8C9C0;--em-line:#555B57;
  --font:Inter,Arial,sans-serif;--primary:#FFFFFF;--secondary:#F2C230;
  --gray:#C8C9C0;--green:#24613D;--bg-box:#303431;--bg-box-gray:#F2F3F2;
  --bg-box-dark:#3A3E3B;--font-dark:#131619;--font-gray:#C8C9C0;
  --border:#555B57;--bg-dark:#303431;--bg-card:#3A3E3B;--primary-dark:#131619;
}
body{background:var(--em-graphite);font-family:var(--font);color:var(--em-paper)}
body.dark{background:var(--em-graphite)}
::selection{background:var(--em-yellow);color:var(--em-ink)}
:where(a,button,input,textarea,select,[tabindex]):focus-visible{outline:2px solid var(--em-yellow);outline-offset:4px}

/* Existing navigation, ordering and breakpoint visibility are retained. */
.top{background:var(--em-neutral);border-bottom:1px solid #D5D8D5}
.top .city__select span,.top .tel span{color:var(--em-ink);font-size:14px}
.top .t-social__link svg,.top .city__icon svg,.top .tel svg{fill:var(--em-ink)}
.navbar{background:var(--em-graphite);border-color:var(--em-line)}
.logo{width:200px;height:64px}
.logo img{content:url('./Emotors_Dark_S.svg');width:100%;height:100%;object-fit:contain}
.mobile-menu .logo img{content:url('./Emotors_Light_S.svg')}
.menu__link,.login-btn span,.dropdown__link{font-family:var(--font);font-size:15px;line-height:1.45}
.menu__link:hover,.login-btn:hover span{color:var(--em-yellow)}
.header{margin-bottom:48px}
.top-account,.dropdown,.dropdown-second{background:var(--em-graphite);border-color:var(--em-line)}
.top-account{border-radius:2px;box-shadow:0 16px 40px #13161933}
.dropdown__link{border-color:var(--em-line);padding-top:16px;padding-bottom:16px}
.dropdown__link:hover{background:var(--em-yellow);border-radius:2px;color:var(--em-ink)}
.dropdown__close svg{fill:var(--em-muted)}
.mobile-menu{background:var(--em-paper);color:var(--em-ink)}
.mobile-menu .mobile-nav__link,.mobile-menu .fav,.mobile-menu .f-contacts__tel{color:var(--em-ink)}
.mobile-menu__close{border-radius:2px;border-color:#D5D8D5}
.mobile-menu__close svg{stroke:var(--em-ink)}

/* One primary-action treatment; secondary controls remain distinguishable. */
.app-btn,.btn{background:var(--em-yellow);border-color:var(--em-yellow);color:var(--em-ink);border-radius:2px;font-family:var(--font);font-size:15px;font-weight:600;line-height:1.3;text-transform:none}
.app-btn{min-height:48px}
.app-btn:hover,.btn:hover{background:var(--em-neutral);border-color:var(--em-neutral);color:var(--em-ink)}
.btn-arr>span,.hero__link span{background:var(--em-yellow);border-radius:2px;color:var(--em-ink);font-family:var(--font);font-size:16px;font-weight:600;text-transform:none;line-height:1.3}
.btn-arr .icon,.hero__link .icon{background:var(--em-neutral);border-radius:2px}
.btn-arr:hover>span,.hero__link:hover span{background:var(--em-neutral)}
.link{font-family:var(--font);text-underline-offset:4px}

/* Same hero content and photograph, with a less overwhelming type scale. */
.hero{margin-bottom:80px}
.hero .container{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"title" "links" "photo";--em-hero-button:144px;--em-hero-notch-x:calc(100% - 280px)}
.hero__title{grid-area:title;font-family:Oswald,sans-serif;font-weight:700;font-size:clamp(54px,5.2vw,80px);line-height:1.12;letter-spacing:-.02em;margin-bottom:32px}
.hero__btns{grid-area:links;gap:16px;margin-bottom:32px}
.hero__link{width:224px}
.hero__link span,.hero__link .icon{height:52px}
.hero__link .icon{width:52px}
.hero__img{grid-area:photo;min-width:0;background:var(--em-graphite);isolation:isolate}
.hero__img img{border-radius:2px;mix-blend-mode:lighten}
/* Share the photograph's grid area: title wrapping cannot move the button
   away from its cutout. The notch is 280px from the right in the 1720x493
   original. Smaller breakpoints mirror its existing object-fit crop. */
.hero__btn{grid-area:photo;position:relative;align-self:start;justify-self:start;top:auto;right:auto;left:var(--em-hero-notch-x);transform:translate(-50%,-50%);background-color:var(--em-yellow);width:var(--em-hero-button);height:var(--em-hero-button);background-size:130px;transition:background-color .3s linear}
.hero__btn:hover{background-color:var(--em-neutral)}

.section-title,.box__title{font-family:Oswald,sans-serif;font-size:clamp(32px,3.4vw,48px);font-weight:700;line-height:1.2;letter-spacing:-.015em;margin-bottom:32px}
.section-title span{color:var(--em-yellow)}
.section-title--inner{font-size:40px}
.section-title--sm{font-size:32px}
.box{margin-bottom:80px}
.section__text{color:var(--em-muted);line-height:1.6}
.specifs__item span:first-child,.section__text figcaption,.breadcrumbs__link,
.auction-list__toggle,.car-other__offer,.article figcaption,.article__author div span,
.comparison__item .comparison__col:first-child span,.contract__load p,
.contract-nav__item,.track-auto__item span,.member__role,.checking__footer p{color:var(--em-muted)}
.specifs__item{border-color:var(--em-line)}

/* Inputs preserve their original sizes and Select2/range-slider behaviour. */
.form-group label{font-family:var(--font);font-size:14px;line-height:1.4;color:var(--em-muted)}
.form-group input,.form-group textarea,.form-group__double,.form-group__section:nth-child(2),.city-search form input{border-color:var(--em-line);border-width:1px;border-radius:2px;background-color:var(--em-surface);color:var(--em-paper);font-family:var(--font);font-size:16px;line-height:1.5}
.form-group input::placeholder,.form-group textarea::placeholder{color:var(--em-muted);opacity:1}
.form-group__double input{background:transparent}
.form-group__double::before,.form-group__double::after{color:var(--em-muted);font-size:14px}
.form-group input:focus,.form-group textarea:focus{border-color:var(--em-yellow)}
.select2-container--default .select2-selection--single,.select2-container--default .select2-selection--multiple{background-color:var(--em-surface);border:1px solid var(--em-line);border-radius:2px}
.select2-container--default .select2-selection--single .select2-selection__rendered,.select2-container--default .select2-selection--multiple .select2-selection__rendered{font-family:var(--font);font-size:16px;line-height:1.5;color:var(--em-paper)}
.select2-container--default .select2-selection--single .select2-selection__placeholder{color:var(--em-muted)}
.select2-container--default.select2-container--disabled .select2-selection--single{background:var(--em-graphite);border-color:var(--em-line);opacity:.6}
.select2-container--default.select2-container--open .select2-selection--single,.select2-container--default.select2-container--open .select2-selection--multiple{border-color:var(--em-yellow);border-radius:2px!important}
.select2-container--default .select2-dropdown,.form-group__dropdown{background:var(--em-surface);border:1px solid var(--em-line);border-radius:2px}
.select2-container--default .select2-results__option{font-size:15px;line-height:1.45;border-radius:2px}
.select2-container--default .select2-results__option--highlighted[aria-selected]{background:var(--em-yellow);color:var(--em-ink)}
.select2-container--default .select2-results__option[aria-selected=true]:not(.select2-results__option--highlighted){background:var(--em-surface-3);color:var(--em-paper)}
.select2-container--default .select2-search--dropdown .select2-search__field{font:16px/1.4 Inter,Arial,sans-serif;background:var(--em-graphite);color:var(--em-paper);border-color:var(--em-line)}
.form-checkbox label{font-family:var(--font);font-size:14px;line-height:1.55;color:var(--em-muted)}
.form-checkbox label::before{border-width:1px;border-radius:2px;border-color:var(--em-muted)}
.form-checkbox input:checked+label::before{background-color:var(--em-yellow);border-color:var(--em-yellow)}

/* Vehicle cards: no new data, no changed links, no image replacement. */
.card__img{border-radius:2px 2px 0 0}
.card__desc{background:var(--em-surface);border:1px solid var(--em-line);border-top:0;border-radius:0 0 2px 2px;padding:24px}
.card__name{font-family:Oswald,sans-serif;font-size:26px;line-height:1.25;font-weight:700;letter-spacing:0;margin-bottom:16px}
.card__name span{font-family:var(--font);font-size:16px}
.card__item span,.card__col span:nth-child(2){font-family:var(--font);font-size:15px;line-height:1.5;color:var(--em-muted)}
.card__col span:first-child{font-family:var(--font);font-size:13px;color:var(--em-muted)}
.card__info{row-gap:12px;margin-bottom:24px}
.card__price{background:transparent;color:var(--em-paper);justify-content:flex-start;font-family:var(--font);font-size:20px;font-weight:600;text-transform:none;line-height:1.3;border-radius:2px}
.card__btn{background:var(--em-yellow);border-radius:2px;width:52px;height:52px;align-self:center}
.card__btn:hover{background:var(--em-neutral)}
.card-row{background:var(--em-surface);border-color:var(--em-line);border-width:1px;border-radius:2px}
.card-row__car,.card-row__info{border-color:var(--em-line)}
.card-row__name{font-family:Oswald,sans-serif;font-size:25px;line-height:1.25}
.card-row__age span,.card-row__col span,.card-row__price-txt,.card-row__price-info{font-family:var(--font);font-size:15px;line-height:1.5}
.card-row__price-val{font-family:var(--font);font-size:23px;line-height:1.3}
.card-row__price-val:first-child,.card-row__price-info{color:var(--em-yellow)}
.card-sm,.card-type,.card-stock,.card-video__img,.card-row__img{border-radius:2px}
.card-stock__img,.card-stock__desc,.card-sm__img{border-radius:2px}
.card-stock__name{color:var(--em-paper)}
.card-stock__label{color:var(--em-ink);border-radius:2px}
.card-sm__offers,.card-type__desc{color:var(--em-muted)}

/* Editorial/proof blocks retain content and order, with calmer contrast. */
.review-card,.faq__item,.reviews-nav__item{border:1px solid var(--em-line);background:var(--em-surface);border-radius:2px}
.review-card__name{font-family:Oswald,sans-serif;font-size:23px;line-height:1.3}
.review-card__text p{font-family:var(--font);font-size:16px;line-height:1.6;color:var(--em-muted)}
.review-card__toggle{font-family:var(--font);font-size:14px;line-height:1.5;color:var(--em-yellow)}
.review-card time{color:var(--em-muted)}
.faq__header span{font-family:var(--font);font-size:18px;font-weight:600;line-height:1.5;text-transform:none}
.faq__item.open{background:var(--em-neutral);border-color:var(--em-neutral)}
.faq__item.open .faq__header span,.faq__text p{color:var(--em-ink)}
.faq__text p{font-family:var(--font);font-size:16px;line-height:1.6}
.preview{border-radius:2px}
.preview__img::before{background:linear-gradient(180deg,transparent 25%,rgba(19,22,25,.94) 100%)}
.preview__title{font-family:Oswald,sans-serif;font-size:23px;line-height:1.3;color:var(--em-paper)}
.preview__title span,.preview__date{font-family:var(--font);color:var(--em-muted);font-size:13px;line-height:1.5}

/* Dialogs: preserve display/position/z-index and all event bindings. */
.modal__inner{background:var(--em-graphite);border:1px solid var(--em-line);border-radius:2px;padding:40px}
.modal__title{font-family:Oswald,sans-serif;font-size:36px;line-height:1.25;margin-bottom:24px}
.modal__text{font-family:var(--font);font-size:16px;line-height:1.6;color:var(--em-muted)}
.modal__inputs{row-gap:16px;margin-bottom:28px}
.modal__inner .btn{font-family:var(--font);font-size:16px;border-radius:2px;height:56px;min-height:52px}
.modal__inner .form-group input{height:52px}
.modal__inner .close-btn{width:44px;height:44px;top:12px;right:12px;display:flex;align-items:center;justify-content:center}
.modal__inner .close-btn svg{width:20px;height:20px;fill:var(--em-muted);stroke:var(--em-muted)}
.modal__inner .form-checkbox label{font-size:13px;line-height:1.55}
body .cookies{background:var(--em-graphite);border:1px solid var(--em-line);border-radius:2px;box-shadow:0 8px 32px #13161940}
.cookies .cookies__text{font-family:var(--font);font-size:13px;line-height:1.5;color:var(--em-muted)}
.cookies .cookie__popup-actions .cookies__accept-btn{border-radius:2px;border:1px solid var(--em-yellow);color:var(--em-paper);font-family:var(--font);font-size:13px;line-height:1.4;min-height:44px}
.footer{background:var(--em-graphite)}
.footerbar{border-color:var(--em-line)}
.footerbar .logo{width:200px}
.footerbar .tel span{font-family:var(--font);font-size:17px}

@media(min-width:1200px){
  .card__img{height:280px}
  .card__desc{height:calc(100% - 280px)}
}
@media(max-width:1199px){
  .hero .container{grid-template-areas:"title" "photo" "links"}
  .hero__title{font-size:64px;margin-bottom:calc(var(--em-hero-button)/2 + 16px)}
  .hero,.box{margin-bottom:64px}
  .section-title,.box__title{font-size:40px}
  .card__desc{padding:20px}
  .card__price{font-size:18px}
}
@media(max-width:1023px){
  .hero .container{--em-hero-notch-x:630.73px}
}
@media(max-width:991px){
  .hero .container{--em-hero-button:124px}
  .hero__title{font-size:56px}
  .hero__btn{background-size:112px}
  .hero__btns{margin:24px 0 0;gap:12px}
  .hero__link{width:calc((100% - 24px)/3)}
  .hero__link span{font-size:14px}
  .logo{width:180px;height:58px}
  .faq__header span{font-size:16px}
}
@media(max-width:767px){
  .header{margin-bottom:32px}
  .navbar__row{height:68px}
  .navbar .logo{width:160px;height:52px;flex-shrink:0}
  .navbar .app-btn{width:auto;padding:0 12px;min-height:44px;height:44px;font-size:12px}
  .hero .container{--em-hero-button:112px;--em-hero-notch-x:430.73px}
  .hero__title{font-size:46px;line-height:1.13}
  .hero__btn{background-size:102px}
  .hero__btn svg{width:28px;height:28px}
  .hero__link{width:100%}
  .hero__link span{font-size:16px}
  .hero__link span,.hero__link .icon{height:52px}
  .hero__btns{gap:8px}
  .section-title,.box__title{font-size:32px;margin-bottom:24px;line-height:1.25}
  .hero,.box{margin-bottom:48px}
  .card__name{font-size:24px}
  .card__desc{padding:20px}
  .card__item span,.card__col span:nth-child(2){font-size:14px}
  .card__price{font-size:19px}
  .card-row__name{font-size:24px}
  .card-row__price-val{font-size:22px}
  .card-row__price-txt,.card-row__price-info{font-size:14px}
  .review-card__text p{font-size:15px;line-height:1.55}
  .faq__item{padding:20px}
  .faq__header span{font-size:16px}
  .faq__text{padding-right:0}
  .preview__title{font-size:22px}
  .modal__inner{padding:28px 24px}
  .modal__title{font-size:30px;margin-bottom:20px}
  .modal__text{font-size:15px;margin-left:0;margin-right:0}
  .btn-arr>span{font-size:15px}
}
@media(max-width:575px){
  .hero .container{--em-hero-notch-x:calc(87.8% - 52.66px)}
}
@media(max-width:479px){
  .navbar__row{gap:10px;flex-wrap:wrap;height:auto;min-height:68px;padding:8px 0}
  .navbar .logo{margin-right:auto}
  .navbar .app-btn{order:5;width:100%;height:48px;font-size:14px}
  .hero__title{font-size:42px}
  .top .city__select span,.top .tel span{font-size:12px}
  body .cookies{left:16px;right:16px;bottom:64px;width:auto;max-width:none;padding:16px;gap:12px}
  .cookies .cookie__popup-actions{width:100%}
  .cookies .cookie__popup-actions .cookies__accept-btn{width:100%;padding:10px 12px}
}
@media(prefers-reduced-motion:reduce){
  .app-btn,.btn,.card__desc,.preview__img,.faq__item{transition:none}
}