/* CarsMiddleEast: additional styling (loaded after style.css) */

/* Smooth interactions */
.btn,.chips a,.tab,.shortcut,.car-card,.news,.sort-row a,.pagination .page-numbers{transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease,border-color .18s ease,color .18s ease}

/* Buttons */
.btn:hover{transform:translateY(-1px);box-shadow:0 6px 16px #13202b26}
.btn:active{transform:translateY(0);box-shadow:none}
.btn.primary:hover{background:#09505a}
.btn.accent:hover{background:#9c350c}
.btn.outline:hover,.outline:hover{background:var(--primary);color:#fff}

/* Header */
.topbar{backdrop-filter:saturate(1.2)}
.mobile-nav a{border-radius:8px}
.mobile-nav a:hover{background:#3b3c40}
.nav select:hover,.menu-btn:hover{border-color:#9aa3ab}

/* Hero */
.hero{position:relative;overflow:hidden}
.hero:before{content:"";position:absolute;inset:-40% -10% auto auto;width:520px;height:520px;background:radial-gradient(circle,#0b5f6b1f,transparent 65%);pointer-events:none}
.search-card{position:relative}
.search-grid input:focus,.search-grid select:focus,.compare-controls select:focus{border-color:var(--primary);box-shadow:0 0 0 3px #0b5f6b26;outline:0}
.chips a:hover{border-color:var(--primary);color:var(--primary)}
.chips a.active:hover{color:#fff}
.tab:hover{color:var(--primary)}

/* Shortcuts */
.shortcut:hover{transform:translateY(-3px);box-shadow:0 8px 20px #13202b1a;border-color:var(--primary)}

/* Car cards */
.car-card{display:flex;flex-direction:column;animation:cme-fade .45s ease both}
.car-card:hover{transform:translateY(-4px);box-shadow:0 12px 28px #13202b1f;border-color:#b6c3cc}
.car-card .specs{flex:1}
.car-image{position:relative}
.car-image img{transition:transform .35s ease}
.car-card:hover .car-image img{transform:scale(1.05)}
.car-card h3 a:hover{color:var(--primary)}
.spec{font-weight:500}
.card-actions{margin-top:16px}
.car-grid .car-card:nth-child(2){animation-delay:.05s}
.car-grid .car-card:nth-child(3){animation-delay:.1s}
.car-grid .car-card:nth-child(4){animation-delay:.15s}
.car-grid .car-card:nth-child(5){animation-delay:.2s}
.car-grid .car-card:nth-child(6){animation-delay:.25s}
@keyframes cme-fade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* Single car */
.car-detail .car-image.large{box-shadow:0 8px 28px #13202b1a}
.spec-table tr:last-child th,.spec-table tr:last-child td{border-bottom:0}
.car-info .price{font-size:30px}
.entry-content{font-size:17px;line-height:1.75}
.entry-content h2,.entry-content h3{line-height:1.3;margin-top:1.6em}
.entry-content blockquote{margin:1.4em 0;padding:.4em 1.2em;border-inline-start:4px solid var(--primary);background:var(--surface);border-radius:0 8px 8px 0}
.entry-content table{width:100%;border-collapse:collapse}
.entry-content th,.entry-content td{border:1px solid var(--border);padding:8px 12px}

/* Compare table */
.compare-table{border-radius:12px;overflow:hidden;box-shadow:0 2px 10px #13202b0f}
.compare-table tbody tr:nth-child(even){background:#fafbfc}
.compare-table tbody tr:hover{background:#eef4f5}
.compare-table tbody tr:last-child td{border-bottom:0}
.compare-table td:first-child,.compare-table th:first-child{position:sticky;inset-inline-start:0;background:inherit;min-width:110px}
.compare-table th:first-child{background:var(--surface)}
.compare-table td:first-child{background:#fff}

/* News */
.news:hover{box-shadow:0 8px 22px #13202b14;border-color:#b6c3cc}
.news h3 a:hover{color:var(--primary)}
.news-img img{transition:transform .35s ease}
.news:hover .news-img img{transform:scale(1.06)}

/* Pagination and sorting */
.pagination .page-numbers:hover:not(.current){border-color:var(--primary);color:var(--primary)}
.sort-row a:hover:not(.active){border-color:var(--primary);color:var(--primary)}

/* Footer */
.footer a:hover{color:#fff;text-decoration:underline}

/* Section headings: small accent bar */
.section-head h2:after,.page-title:after{content:"";display:block;width:44px;height:3px;margin-top:8px;background:var(--accent);border-radius:2px}
.hero h1:after{display:none}

/* Back-to-top style link helper (optional: add class "to-top" to any link) */
.to-top{position:fixed;inset-inline-end:18px;bottom:18px;width:44px;height:44px;border-radius:50%;background:var(--primary);color:#fff;display:grid;place-items:center;box-shadow:0 6px 16px #0003}

/* Arabic / RTL polish */
[dir=rtl] .section-head a,[dir=rtl] .footer a{unicode-bidi:plaintext}
[dir=rtl] .car-card h3,[dir=rtl] .news h3{letter-spacing:0}
[dir=rtl] .btn{letter-spacing:0}

/* Larger screens */
@media(min-width:1200px){
.container{width:min(1180px,calc(100% - 64px))}
.hero{padding:76px 0 56px}
}

/* Small screens */
@media(max-width:560px){
.car-card:hover,.shortcut:hover{transform:none}
.card-actions{flex-direction:column}
.car-info h1{font-size:26px}
.car-info .price{font-size:26px}
.car-image.large{font-size:84px}
}

/* Accessibility and print */
@media(prefers-reduced-motion:reduce){
*,*:before,*:after{animation:none!important;transition:none!important}
}
@media print{
.topbar,.search-card,.chips,.card-actions,.sort-row,.pagination,footer.site-footer,.compare-controls{display:none!important}
body{color:#000}
.car-card,.news{break-inside:avoid;box-shadow:none}
a{color:#000}
}