/* cbc-course-mobile.css (v1942, owner 25 Oct) - course pages and the /courses/ listing at phone width.
 * Added by the Course Studio serve step (cbc_cs_course_mobile_css) after every other stylesheet; desktop layout is untouched
 * (every rule is inside a max-width query). Fixes the sideways scroll (24-43px on all 27 course pages, 24px on the listing):
 *  1. the top bar (logo + My account / Sign in + WhatsApp icon + menu) did not fit under 400px: tighter padding, a smaller logo
 *     (true shape kept) and compact buttons; the WhatsApp button stays an icon;
 *  2. the certificate block's one-column grid grew to its content's minimum width: the column may now shrink to the screen. */
@media (max-width:920px){
  .cbccert-grid{grid-template-columns:minmax(0,1fr)}
  .cbccert-grid>*{min-width:0;max-width:100%}
  .cbccert,.cbccert-stage{max-width:100%}
}
@media (max-width:520px){
  .cbc-topbar__in{gap:8px;padding:10px 12px}
  .cbc-brand{flex:0 1 auto;min-width:0}
  .cbc-brand img{height:24px;width:auto;max-width:100%;object-fit:contain;object-position:left center}
  .cbc-top-cta{gap:5px;flex:0 0 auto}
  .cbc-top-cta .cbc-btn{padding:7px 9px;font-size:12.5px}
  .cbc-top-cta .cbc-btn--wa{font-size:0;padding:7px;gap:0}
  .cbc-top-cta .cbc-btn--wa svg{width:18px;height:18px}
  .cbc-burger{width:38px;height:38px}
}
@media (max-width:360px){
  /* v1943: the two-column instructor cards were 1-5px too wide at 320px (cloud-devops-internship, full-stack-web-development-internship) */
  .inst-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .inst{min-width:0}
  .inst *{overflow-wrap:anywhere}
  .cbc-brand img{height:18px}
  .cbc-top-cta .cbc-btn{padding:6px 8px;font-size:12px}
  .cbc-top-cta .cbc-btn--wa{font-size:0;padding:6px}
}
