/* ==========================================================================
   کاپوت‌بالا — Custom About. Scoped under .cp-ab. RTL. Inherits Yekan Bakh.
   Shares the FAQ design language (brand red + dark + slate).
   ========================================================================== */

body.carparts-about-page .page_title,
body.carparts-about-page .header_onthe_cover .page_title,
body.carparts-about-page .breadcrumbs { display: none !important; }

.cp-ab {
	--cp-red:#eb2500; --cp-red-dark:#c41e00;
	--cp-ink:#0f172a; --cp-body:#334155; --cp-muted:#475569;
	--cp-bg:#f4f6f9; --cp-surface:#fff; --cp-line:#e3e8ef; --cp-dark:#101010;
	--cp-radius:16px;
	--cp-shadow:0 1px 2px rgba(16,24,40,.04),0 8px 24px rgba(16,24,40,.06);
	--cp-shadow-h:0 6px 14px rgba(16,24,40,.07),0 22px 48px rgba(16,24,40,.12);
	background:var(--cp-bg); color:var(--cp-body);
	font-family:inherit; line-height:1.9;
	-webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
.cp-ab *,.cp-ab *::before,.cp-ab *::after{box-sizing:border-box;}
.cp-ab-container{max-width:1120px;margin-inline:auto;padding-inline:20px;}
.cp-ab :focus-visible{outline:3px solid rgba(235,37,0,.45);outline-offset:3px;border-radius:8px;}

.cp-ic{width:24px;height:24px;display:block;}

/* shared kicker / heads */
.cp-ab-kicker{
	display:inline-block;font-weight:800;font-size:.82rem;letter-spacing:.02em;
	color:var(--cp-red);background:#fdeae4;border:1px solid #f6cbbb;
	padding:5px 14px;border-radius:999px;margin-bottom:14px;
}
.cp-ab-head{text-align:center;max-width:640px;margin:0 auto 40px;}
.cp-ab-head h2{font-size:clamp(1.5rem,3.2vw,2.1rem);font-weight:800;color:var(--cp-ink);margin:0;line-height:1.4;}

/* buttons */
.cp-ab-btn{
	display:inline-flex;align-items:center;gap:9px;font:inherit;font-weight:700;font-size:.97rem;
	padding:13px 24px;border-radius:12px;text-decoration:none;cursor:pointer;white-space:nowrap;
	transition:transform .12s,background .2s,box-shadow .2s,border-color .2s,color .2s;
}
.cp-ab-btn .cp-ic{width:19px;height:19px;}
.cp-ab-btn--primary{background:var(--cp-red);color:#fff;box-shadow:0 8px 22px rgba(235,37,0,.34);}
.cp-ab-btn--primary:hover{background:var(--cp-red-dark);color:#fff;transform:translateY(-2px);}
.cp-ab-btn--ghost{background:rgba(255,255,255,.10);color:#fff;border:1px solid rgba(255,255,255,.30);}
.cp-ab-btn--ghost:hover{background:rgba(255,255,255,.18);color:#fff;transform:translateY(-2px);}
.cp-ab-btn--dark-ghost{background:rgba(255,255,255,.06);color:#fff;border:1px solid rgba(255,255,255,.22);}
.cp-ab-btn--dark-ghost:hover{background:rgba(255,255,255,.14);color:#fff;transform:translateY(-2px);}

/* ---------- HERO ---------- */
.cp-ab-hero{position:relative;overflow:hidden;color:#fff;text-align:center;padding:96px 0 104px;
	background:var(--cp-dark);}
.cp-ab-hero::before{content:"";position:absolute;inset:0;
	background-image:var(--cp-hero-img);background-size:cover;background-position:center;
	opacity:.34;filter:grayscale(.2);}
.cp-ab-hero__overlay{position:absolute;inset:0;
	background:
		linear-gradient(0deg,rgba(16,16,16,.92),rgba(16,16,16,.55)),
		radial-gradient(60% 70% at 50% 0%,rgba(235,37,0,.30),transparent 70%);}
.cp-ab-hero__inner{position:relative;}
.cp-ab-eyebrow{display:inline-block;font-size:.82rem;font-weight:800;letter-spacing:.02em;color:#ffb9a6;
	background:rgba(235,37,0,.16);border:1px solid rgba(235,37,0,.36);padding:6px 16px;border-radius:999px;margin-bottom:20px;}
.cp-ab-hero__title{font-size:clamp(2rem,5vw,3.1rem);font-weight:800;line-height:1.3;margin:0 0 14px;color:#fff;}
.cp-ab-hero__sub{font-size:clamp(.98rem,2.2vw,1.16rem);color:#d4dae2;max-width:680px;margin:0 auto 30px;}
.cp-ab-hero__cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}

/* ---------- STORY ---------- */
.cp-ab-story{display:grid;grid-template-columns:0.95fr 1.05fr;gap:48px;align-items:center;
	padding-top:80px;padding-bottom:80px;}
.cp-ab-story__media{position:relative;}
.cp-ab-story__media img{width:100%;height:auto;border-radius:22px;display:block;
	box-shadow:var(--cp-shadow-h);}
.cp-ab-story__media::after{content:"";position:absolute;inset-inline-start:-14px;bottom:-14px;width:120px;height:120px;
	border-radius:18px;background:var(--cp-red);z-index:-1;opacity:.9;}
.cp-ab-badge{position:absolute;top:16px;inset-inline-end:16px;display:inline-flex;align-items:center;gap:7px;
	font-weight:700;font-size:.82rem;color:#fff;background:rgba(16,16,16,.78);backdrop-filter:blur(4px);
	padding:8px 14px;border-radius:999px;}
.cp-ab-badge .cp-ic{width:16px;height:16px;color:var(--cp-red);}
.cp-ab-story__text h2{font-size:clamp(1.5rem,3.2vw,2.1rem);font-weight:800;color:var(--cp-ink);margin:0 0 16px;line-height:1.45;}
.cp-ab-story__text p{margin:0 0 16px;color:var(--cp-body);font-size:1.02rem;}
.cp-ab-kicker{margin-bottom:14px;}
.cp-ab-textlink{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--cp-red);text-decoration:none;}
.cp-ab-textlink:hover{color:var(--cp-red-dark);gap:10px;transition:gap .2s;}

/* ---------- VALUES ---------- */
.cp-ab-values{padding:78px 0;background:#fff;border-top:1px solid var(--cp-line);border-bottom:1px solid var(--cp-line);}
.cp-ab-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.cp-ab-card{background:var(--cp-surface);border:1px solid var(--cp-line);border-radius:var(--cp-radius);
	padding:28px 24px;box-shadow:var(--cp-shadow);transition:transform .18s,box-shadow .2s,border-color .2s;}
.cp-ab-card:hover{transform:translateY(-4px);box-shadow:var(--cp-shadow-h);border-color:#f6cbbb;}
.cp-ab-card__ic{display:inline-grid;place-items:center;width:52px;height:52px;border-radius:14px;
	background:#fdeae4;color:var(--cp-red);margin-bottom:16px;}
.cp-ab-card__ic .cp-ic{width:26px;height:26px;}
.cp-ab-card h3{font-size:1.12rem;font-weight:800;color:var(--cp-ink);margin:0 0 8px;}
.cp-ab-card p{margin:0;color:var(--cp-muted);font-size:.96rem;line-height:1.85;}

/* ---------- STEPS ---------- */
.cp-ab-steps{padding:78px 0;}
.cp-ab-steps__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;
	counter-reset:step;position:relative;}
.cp-ab-step{position:relative;background:var(--cp-surface);border:1px solid var(--cp-line);border-radius:var(--cp-radius);
	padding:30px 26px 26px;box-shadow:var(--cp-shadow);}
.cp-ab-step__num{position:absolute;top:-16px;inset-inline-end:24px;width:42px;height:42px;border-radius:12px;
	display:grid;place-items:center;background:var(--cp-dark);color:#fff;font-weight:800;font-size:1.1rem;
	box-shadow:0 6px 16px rgba(0,0,0,.22);}
.cp-ab-step__ic{display:inline-grid;place-items:center;width:48px;height:48px;border-radius:12px;
	background:#fdeae4;color:var(--cp-red);margin-bottom:14px;}
.cp-ab-step h3{font-size:1.1rem;font-weight:800;color:var(--cp-ink);margin:0 0 8px;}
.cp-ab-step p{margin:0;color:var(--cp-muted);font-size:.96rem;}

/* ---------- CATEGORIES ---------- */
.cp-ab-cats{padding:78px 0;background:#fff;border-top:1px solid var(--cp-line);}
.cp-ab-cats__grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;}
.cp-ab-cat{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;
	background:var(--cp-bg);border:1px solid var(--cp-line);border-radius:var(--cp-radius);padding:26px 16px;
	text-decoration:none;transition:transform .16s,box-shadow .2s,border-color .2s,background .2s;}
.cp-ab-cat:hover{transform:translateY(-4px);box-shadow:var(--cp-shadow-h);border-color:var(--cp-red);background:#fff;}
.cp-ab-cat__ic{display:grid;place-items:center;width:46px;height:46px;border-radius:12px;background:#fff;color:var(--cp-red);border:1px solid var(--cp-line);}
.cp-ab-cat__name{font-weight:800;color:var(--cp-ink);font-size:1rem;}
.cp-ab-cat__count{font-size:.82rem;color:var(--cp-muted);}
.cp-ab-cat--all{background:var(--cp-dark);border-color:var(--cp-dark);}
.cp-ab-cat--all .cp-ab-cat__name{color:#fff;}
.cp-ab-cat--all:hover{background:#000;}
.cp-ab-cat__arrow{color:var(--cp-red);font-size:1.3rem;font-weight:800;}

/* ---------- PROMISE BAND ---------- */
.cp-ab-promise{background:var(--cp-dark);padding:30px 0;}
.cp-ab-promise__row{display:flex;flex-wrap:wrap;justify-content:space-around;gap:18px;}
.cp-ab-promise__item{display:flex;align-items:center;gap:12px;color:#fff;font-weight:700;font-size:1rem;}
.cp-ab-promise__item .cp-ic{width:26px;height:26px;color:var(--cp-red);flex:0 0 auto;}

/* ---------- FINAL CTA ---------- */
.cp-ab-cta{margin:72px 0;background:radial-gradient(120% 160% at 100% 0%,#232323 0%,var(--cp-dark) 70%);
	border-radius:22px;padding:42px 44px;display:flex;align-items:center;justify-content:space-between;gap:28px;
	flex-wrap:wrap;position:relative;overflow:hidden;}
.cp-ab-cta::before{content:"";position:absolute;inset-inline-start:-8%;top:-50%;width:320px;height:320px;
	background:radial-gradient(circle,rgba(235,37,0,.34),transparent 65%);pointer-events:none;}
.cp-ab-cta__text{position:relative;}
.cp-ab-cta__text h2{color:#fff;font-size:1.5rem;font-weight:800;margin:0 0 6px;}
.cp-ab-cta__text p{color:#c7ccd4;margin:0;font-size:1rem;}
.cp-ab-cta__actions{position:relative;display:flex;gap:12px;flex-wrap:wrap;}

/* ---------- REVEAL (fail-safe: hidden only when JS is active) ---------- */
.cp-ab-js #cp-about [data-reveal]{opacity:0;transform:translateY(18px);transition:opacity .5s ease,transform .5s ease;}
.cp-ab-js #cp-about [data-reveal].is-in{opacity:1;transform:none;}

/* ---------- RESPONSIVE ---------- */
@media (max-width:900px){
	.cp-ab-grid,.cp-ab-steps__list{grid-template-columns:repeat(2,1fr);}
	.cp-ab-cats__grid{grid-template-columns:repeat(3,1fr);}
	.cp-ab-story{grid-template-columns:1fr;gap:34px;}
	.cp-ab-story__media{max-width:460px;margin-inline:auto;}
}
@media (max-width:640px){
	.cp-ab-hero{padding:72px 0 80px;}
	.cp-ab-grid,.cp-ab-steps__list,.cp-ab-cats__grid{grid-template-columns:1fr;}
	.cp-ab-steps__list{gap:24px;}
	.cp-ab-promise__row{justify-content:flex-start;gap:14px 22px;}
	.cp-ab-promise__item{font-size:.92rem;}
	.cp-ab-cta{padding:30px 24px;}
	.cp-ab-cta__actions{width:100%;}
	.cp-ab-cta__actions .cp-ab-btn{flex:1 1 auto;justify-content:center;}
	.cp-ab-hero__cta{width:100%;}
}

/* ---------- REDUCED MOTION ---------- */
@media (prefers-reduced-motion:reduce){
	.cp-ab *{transition:none !important;}
	[data-reveal]{opacity:1 !important;transform:none !important;}
}
