/* =====================================================================
   ABOUT US PAGE (page-about-us.php)
===================================================================== */

/* Section rhythm for this page only — overrides the generic
   .csk-section{margin:52px 0} (meant for dense homepage rails) with a
   tighter, breakpoint-aware scale so the page doesn't read as gappy,
   especially on tablet/mobile where 52px was never reduced. Scoped via
   .csk-about-hero (unique to this template) so it can't leak to other
   pages that reuse .csk-section. */
.csk-about-hero ~ .csk-container .csk-section{margin:40px 0;}
.csk-about-hero ~ .csk-container .csk-section:first-child{margin-top:36px;}
.csk-about-hero ~ .csk-container .csk-section:last-child{margin-bottom:56px;}
@media (max-width:900px){
	.csk-about-hero ~ .csk-container .csk-section{margin:30px 0;}
	.csk-about-hero ~ .csk-container .csk-section:first-child{margin-top:26px;}
	.csk-about-hero ~ .csk-container .csk-section:last-child{margin-bottom:40px;}
}
@media (max-width:640px){
	.csk-about-hero ~ .csk-container .csk-section{margin:24px 0;}
	.csk-about-hero ~ .csk-container .csk-section:first-child{margin-top:22px;}
	.csk-about-hero ~ .csk-container .csk-section:last-child{margin-bottom:32px;}
}

/* ---------- Page banner ---------- */
.csk-about-hero{background:var(--csk-black);padding:38px 0 34px;margin-bottom:0;}
.csk-breadcrumb{display:flex;align-items:center;gap:8px;font-size:12.5px;color:#9a9a9a;margin-bottom:14px;}
.csk-breadcrumb a{color:#c9c9c9;}
.csk-breadcrumb a:hover{color:var(--csk-yellow);}
.csk-breadcrumb span:last-child{color:var(--csk-yellow);}
.csk-about-hero h1{font-size:32px;font-weight:800;color:var(--csk-white);margin-bottom:8px;}
.csk-about-hero h1 span{color:var(--csk-yellow);}
.csk-about-hero p{font-size:14.5px;color:#c9c9c9;max-width:520px;margin:0;}

.csk-eyebrow{display:inline-block;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--csk-yellow-dark);margin-bottom:10px;}

/* ---------- Our story ---------- */
.csk-story{display:grid;grid-template-columns:0.9fr 1.1fr;gap:44px;align-items:center;}
.csk-story-media{border-radius:var(--csk-radius);overflow:hidden;background:var(--csk-light);border:1px solid var(--csk-border);display:flex;align-items:center;justify-content:center;padding:36px;aspect-ratio:4/3;}
/* object-fit:contain (not cover) — this is a brand logo, not a photo, so it
   must never be cropped regardless of the box's aspect ratio. The fixed
   aspect-ratio above only shapes the empty card; the padding keeps the
   logo from touching the edges when it's letterboxed inside it. */
.csk-story-media img{width:100%;height:100%;object-fit:contain;aspect-ratio:auto;}
.csk-story-content h2{font-size:26px;font-weight:800;line-height:1.3;margin-bottom:14px;}
.csk-story-content p{font-size:14.5px;line-height:1.7;color:#444;margin:0 0 14px;}
.csk-story-content p:last-child{margin-bottom:0;}
@media (max-width:900px){
	.csk-story{grid-template-columns:1fr;gap:24px;}
	.csk-story-media{aspect-ratio:16/9;padding:24px;}
}

/* ---------- Mission & vision ---------- */
.csk-mv-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.csk-mv-card{border:1px solid var(--csk-border);border-radius:var(--csk-radius);padding:28px;background:var(--csk-white);}
.csk-mv-icon{width:46px;height:46px;border-radius:50%;background:var(--csk-black);display:flex;align-items:center;justify-content:center;margin-bottom:16px;}
.csk-mv-icon svg{width:22px;height:22px;stroke:var(--csk-yellow);}
.csk-mv-card h3{font-size:17px;font-weight:800;margin-bottom:8px;}
.csk-mv-card p{font-size:13.5px;line-height:1.65;color:#555;margin:0;}
@media (max-width:768px){.csk-mv-grid{grid-template-columns:1fr;}}

/* ---------- Founder spotlight ---------- */
.csk-founder-card{display:flex;align-items:center;gap:32px;background:var(--csk-light);border-radius:var(--csk-radius);padding:34px;}
.csk-founder-avatar{flex-shrink:0;width:96px;height:96px;border-radius:50%;background:var(--csk-black);color:var(--csk-yellow);display:flex;align-items:center;justify-content:center;font-size:30px;font-weight:800;letter-spacing:.5px;}
.csk-founder-content h3{font-size:21px;font-weight:800;margin:2px 0 4px;}
.csk-founder-role{display:block;font-size:12.5px;font-weight:600;color:var(--csk-gray);margin-bottom:12px;}
.csk-founder-content p{font-size:13.5px;line-height:1.65;color:#444;margin:0;max-width:640px;}
@media (max-width:640px){
	.csk-founder-card{flex-direction:column;text-align:center;gap:16px;padding:28px 22px;}
	.csk-founder-content p{max-width:none;}
}

/* ---------- CTA banner ---------- */
.csk-about-cta{background:var(--csk-yellow);border-radius:var(--csk-radius);padding:46px 20px;text-align:center;}
.csk-about-cta h2{font-size:24px;font-weight:800;color:var(--csk-black);margin-bottom:8px;}
.csk-about-cta p{font-size:14px;color:#3a3a3a;margin:0 0 20px;}
.csk-about-cta .csk-btn{background:var(--csk-black);border-color:var(--csk-black);color:var(--csk-white);}
.csk-about-cta .csk-btn:hover{background:var(--csk-white);border-color:var(--csk-white);color:var(--csk-black);}
