/* ==========================================================================
   CareerHike — responsive fixes for every screen (phones 320px → large
   desktops). Loaded after Elementor, so it only adjusts sizes; the homepage
   content itself stays editable in Elementor.
   ========================================================================== */

/* No sideways scrolling on any device */
body { max-width: 100%; overflow-x: hidden; }
/* 'clip' stops the sideways scrollbar without breaking the sticky header */
@supports (overflow-x: clip) {
	html, body { overflow-x: clip !important; }
}
img, video, iframe, embed { max-width: 100%; }
body .elementor img { height: auto; }

/* Readable card text on desktop too (was 8–10px) */
body .ch-explore .ch-badge { font-size: 9.5px; }
body .ch-explore .ch-card-name { font-size: 12px; }
body .ch-explore .ch-card-btn { font-size: 11px; padding: 7px 6px; }
body .ch-explore .ch-sidebar-item .cat-sub { font-size: 10.5px; }
body .ch-tools .ch-tool-badge { font-size: 9.5px; }
body .ch-tools .ch-tool-name { font-size: 12px; }
body .ch-tools .ch-tool-btn { font-size: 11px; padding: 7px 6px; }
body .ch-uni-widget .ch-uni-name { font-size: 11.5px; }
body .ch-uni-widget .ch-explore-btn { font-size: 10.5px; }

/* ---------- Tablets (≤1024px) ---------- */
@media (max-width: 1024px) {
	body .ch-tools .ch-tools-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* ---------- Large phones / small tablets (≤782px) ---------- */
@media (min-width: 600px) and (max-width: 782px) {
	/* room for the Sign Up button next to Compare */
	body .mud-hf-header .mud-hf-login-btn { display: inline-flex !important; font-size: 12px; padding: 6px 12px; border-radius: 6px; }
}
@media (max-width: 782px) {
	body .ch-explore .ch-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
	body .ch-explore .ch-card-icon { font-size: 22px; }
	body .ch-explore .ch-card-top { padding: 7px 6px 4px; }
	body .ch-explore .ch-badge { font-size: 9px; padding: 2px 6px; white-space: normal; text-align: center; }
	body .ch-explore .ch-card-name { font-size: 12px; line-height: 1.3; padding: 4px 2px 7px; }
	body .ch-explore .ch-card-btn { font-size: 11px; padding: 7px 4px; letter-spacing: 0; }
	body .ch-explore .ch-sidebar-item .cat-title { font-size: 13px; }

	body .ch-tools .ch-tools-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
	body .ch-tools .ch-tool-icon { font-size: 22px; }
	body .ch-tools .ch-tool-card-top { padding: 7px 6px 4px; }
	body .ch-tools .ch-tool-badge { font-size: 9px; padding: 2px 6px; }
	body .ch-tools .ch-tool-name { font-size: 12px; line-height: 1.3; padding-bottom: 7px; }
	body .ch-tools .ch-tool-btn { font-size: 11px; padding: 7px 4px; letter-spacing: 0; }

	body .ch-uni-widget .ch-uni-name { font-size: 11px; }
	body .ch-uni-widget .ch-explore-btn { font-size: 10px; padding: 3px 9px; }

	/* section headings: readable pill, heading may wrap instead of overflowing */
	body .ch-uni-heading .ch-heading-pill,
	body .ch-heading-row .ch-heading-pill { font-size: 11.5px !important; padding: 7px 12px 7px 10px !important; }
	body .ch-uni-heading .ch-heading-title,
	body .ch-heading-row .ch-heading-title { white-space: normal; font-size: 24px; line-height: 1.2; }
	body .ch-tools .ch-eyebrow { font-size: 11.5px; }

	body .ch-blog-heading-row { flex-wrap: wrap; row-gap: 12px; }
	body .ch-blog-pill { font-size: 11.5px !important; }
	body .ch-blog-title { white-space: normal; font-size: 24px; line-height: 1.2; }
	body .ch-blog-btn { width: auto; height: auto; padding: 9px 16px; font-size: 11.5px; }
}

/* ---------- Phones (≤480px) ---------- */
@media (max-width: 480px) {
	body .ch-explore .ch-grid,
	body .ch-tools .ch-tools-grid { gap: 6px; }
	body .ch-explore .ch-badge,
	body .ch-tools .ch-tool-badge { font-size: 8.5px; padding: 2px 5px; }
	body .ch-explore .ch-card-name,
	body .ch-tools .ch-tool-name { font-size: 11.5px; }
	body .ch-explore .ch-card-btn,
	body .ch-tools .ch-tool-btn { font-size: 10.5px; padding: 6px 3px; }
	body .ch-explore .ch-card-icon,
	body .ch-tools .ch-tool-icon { font-size: 20px; }
	body .ch-explore .ch-sidebar-item .cat-title { font-size: 12.5px; }

	body .ch-uni-heading .ch-heading-title,
	body .ch-heading-row .ch-heading-title,
	body .ch-blog-title,
	body .ch-tools .ch-heading { font-size: 22px; }

	body .elementor-widget-heading .elementor-heading-title { overflow-wrap: anywhere; }
	body .elementor-element-364859d .elementor-heading-title { font-size: 28px !important; line-height: 1.2 !important; }
}

/* ---------- Small phones (≤360px) ---------- */
@media (max-width: 360px) {
	body .ch-explore .ch-badge,
	body .ch-tools .ch-tool-badge { font-size: 8px; padding: 1px 4px; }
	body .ch-explore .ch-card-name,
	body .ch-tools .ch-tool-name { font-size: 11px; }
	body .ch-explore .ch-card-btn,
	body .ch-tools .ch-tool-btn { font-size: 10px; }
	body .ch-uni-widget .ch-uni-name { font-size: 10.5px; }
	body .ch-uni-heading .ch-heading-title,
	body .ch-heading-row .ch-heading-title,
	body .ch-blog-title,
	body .ch-tools .ch-heading { font-size: 20px; }
	body .elementor-element-364859d .elementor-heading-title { font-size: 25px !important; }
}

/* ---------- Large screens (≥1600px): keep content centred, not stretched ---------- */
@media (min-width: 1600px) {
	body .ch-explore .ch-wrapper { max-width: 1280px; }
}
/* ---- Home "100+ Online Universities" heading (Elementor HTML widget .ch-uni-widget) ---- */
body .ch-uni-widget .ch-section-eyebrow {
	display: flex; width: fit-content; align-items: center; gap: 8px; margin: 0 0 14px;
	padding: 7px 16px 7px 8px; border-radius: 999px;
	background: linear-gradient(#fff, #fff) padding-box, linear-gradient(90deg, #f35000, #ffb088, #051d43) border-box;
	border: 1.5px solid transparent; box-shadow: 0 6px 18px -8px rgba(243,80,0,.35);
	font-size: 12.5px; font-weight: 700; letter-spacing: .08em; color: #051d43;
	transition: transform .3s ease, box-shadow .3s ease, color .3s ease, background .3s ease; cursor: default;
}
body .ch-uni-widget .ch-section-eyebrow::before {
	content: '🎓'; display: inline-flex; align-items: center; justify-content: center;
	width: 26px; height: 26px; border-radius: 50%; background: #fff1e8; font-size: 14px;
	animation: chEyeCap 2.6s ease-in-out infinite;
}
body .ch-uni-widget .ch-section-eyebrow::after {
	content: ''; width: 7px; height: 7px; border-radius: 50%; background: #22c55e; margin-left: 2px;
	box-shadow: 0 0 0 0 rgba(34,197,94,.6); animation: chEyePulse 1.8s ease-out infinite;
}
body .ch-uni-widget .ch-section-eyebrow:hover {
	transform: translateY(-2px); color: #fff; box-shadow: 0 12px 24px -10px rgba(243,80,0,.6);
	background: linear-gradient(90deg, #f35000, #ff7a33) padding-box, linear-gradient(90deg, #f35000, #ff7a33) border-box;
}
body .ch-uni-widget .ch-section-eyebrow:hover::before { background: #fff; animation-duration: .9s; }

body .ch-uni-widget .ch-section-heading {
	position: relative; display: block; width: fit-content; max-width: 100%; margin: 0 0 28px; padding-left: 16px;
	font-size: clamp(20px, 3.4vw, 30px); font-weight: 800; line-height: 1.3; color: #051d43;
	letter-spacing: -.01em; transition: transform .35s ease;
}
body .ch-uni-widget .ch-section-heading::before { /* accent bar on the left */
	content: ''; position: absolute; left: 0; top: 6%; bottom: 6%; width: 5px; border-radius: 5px;
	background: linear-gradient(180deg, #f35000, #ffb088 60%, #051d43);
	transform-origin: top; transition: transform .35s ease, width .35s ease;
}
body .ch-uni-widget .ch-section-heading span {
	position: relative; white-space: nowrap;
	background: linear-gradient(90deg, #f35000 0%, #ff8a3d 35%, #f35000 55%, #c73e00 100%);
	background-size: 220% 100%; -webkit-background-clip: text; background-clip: text;
	-webkit-text-fill-color: transparent; color: #f35000;
	animation: chHeadShine 5s linear infinite;
}
body .ch-uni-widget .ch-section-heading span::after { /* hand-drawn style underline */
	content: ''; position: absolute; left: 0; right: 6px; bottom: -4px; height: 6px; border-radius: 6px;
	background: linear-gradient(90deg, rgba(243,80,0,.35), rgba(255,176,136,.25));
	transform: scaleX(.35); transform-origin: left; transition: transform .45s cubic-bezier(.2,.8,.2,1);
}
body .ch-uni-widget .ch-section-heading:hover { transform: translateX(4px); }
body .ch-uni-widget .ch-section-heading:hover::before { width: 7px; }
body .ch-uni-widget .ch-section-heading:hover span::after { transform: scaleX(1); }
body .ch-uni-widget .ch-section-heading:hover span { animation-duration: 1.6s; }

@keyframes chEyeCap { 0%,100% { transform: translateY(0) rotate(0); } 25% { transform: translateY(-3px) rotate(-10deg); } 50% { transform: translateY(0) rotate(0); } }
@keyframes chEyePulse { 0% { box-shadow: 0 0 0 0 rgba(34,197,94,.6); } 100% { box-shadow: 0 0 0 8px rgba(34,197,94,0); } }
@keyframes chHeadShine { to { background-position: -220% 0; } }
@media (max-width: 600px) {
	body .ch-uni-widget .ch-section-heading span { white-space: normal; }
}
@media (prefers-reduced-motion: reduce) {
	body .ch-uni-widget .ch-section-eyebrow::before, body .ch-uni-widget .ch-section-eyebrow::after, body .ch-uni-widget .ch-section-heading span { animation: none; }
}

/* CareerHike 4.1.15 — sidebars restored to normal page flow.
 * Do not make content sidebars sticky or independently scrollable. This keeps
 * the cards at their natural height and prevents the clipped/inner-scroll
 * appearance on desktop and mobile. */
.ch40-sidebar,.ch40-course-sidebar,.mud-blog .mud-sidebar,.mud-sidebar{
  position:static!important;
  top:auto!important;
  bottom:auto!important;
  align-self:start!important;
  max-height:none!important;
  height:auto!important;
  overflow:visible!important;
  scrollbar-width:auto!important;
}