/* PEARL INSTITUTE BATALA | Course catalogue and details ONLY.
   Version: 2026-10-29. Loaded after style.css and modern-ui.css.
   Covers BOTH the original .course-card-art and newer .course-card-media layouts. */
.pearl-landscape-courses, .pearl-landscape-courses * { box-sizing:border-box; }
.pearl-landscape-courses { width:100%; max-width:1240px; min-width:0; }
.pearl-landscape-courses .course-grid {
  display:grid !important; width:100% !important; min-width:0;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:24px !important; align-items:start;
}
.pearl-landscape-courses .course-grid > .course-card {
  display:flex;flex-direction:column; width:100% !important;
  max-width:100% !important; min-width:0 !important; height:auto;
  overflow:hidden !important;border-radius:18px;
}
/* 16:9 landscape frames independent of uploaded source orientation */
.pearl-landscape-courses .course-card .course-card-art,
.pearl-landscape-courses .course-card .course-card-media {
  position:relative !important; isolation:isolate; box-sizing:border-box !important;
  display:block !important; width:100% !important; height:auto !important;
  min-width:0 !important; min-height:0 !important;
  max-width:100% !important; aspect-ratio:16 / 9 !important;
  padding:0 !important; margin:0 !important;
  overflow:hidden !important; background:#eef2f9;
  border-radius:0 !important;
}
/* Original code used absolute images with object-fit:cover.
   Override this even if the banner itself is tall / portrait. */
.pearl-landscape-courses .course-card .course-cover-photo,
.pearl-landscape-courses .course-card .course-card-art > img,
.pearl-landscape-courses .course-card .course-card-media > img {
  position:absolute !important; inset:0 !important; display:block !important;
  width:100% !important;height:100% !important; min-width:0 !important;
  max-width:100% !important; max-height:100% !important;
  margin:0 !important; padding:0 !important; border:0 !important;
  aspect-ratio:auto !important; object-fit:contain !important;
  object-position:center !important; transform:none !important;
  border-radius:0 !important;
}
/* Keep labels on top and the card text readable. */
.pearl-landscape-courses .course-card .course-type {position:relative;z-index:2;margin:10px;}
.pearl-landscape-courses .course-card .course-art-symbol {z-index:1;}
.pearl-landscape-courses .course-card-body {min-width:0;flex:1;padding:21px;}
.pearl-landscape-courses .course-card h3 {font-size:clamp(1.08rem,1.25vw,1.35rem);line-height:1.34;overflow-wrap:anywhere;}
.pearl-landscape-courses .course-card p,
.pearl-landscape-courses .course-card .course-card-summary {
  display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:3;
  line-clamp:3;overflow:hidden;overflow-wrap:anywhere;
  font-size:.9rem;line-height:1.65;
}
.pearl-landscape-courses .course-card-foot {margin-top:auto;display:flex;gap:12px;flex-wrap:wrap;}
/* Single course cover: prevent the full-size image from escaping its card. */
.pearl-landscape-courses .course-detail-layout,
.pearl-landscape-courses .pearl-course-detail {width:100% !important;max-width:1140px !important;min-width:0 !important;margin-inline:auto;}
.pearl-landscape-courses .course-detail-layout > *,
.pearl-landscape-courses .course-detail-card,
.pearl-landscape-courses .pearl-course-visual,
.pearl-landscape-courses .pearl-course-visual-frame {box-sizing:border-box;max-width:100% !important;min-width:0 !important;}
.pearl-landscape-courses .pearl-course-visual {width:100%;overflow:hidden;}
.pearl-landscape-courses .pearl-course-visual-frame {width:100%;aspect-ratio:16 / 9;overflow:hidden;display:grid;place-items:center;background:#eef2f9;}
.pearl-landscape-courses .course-detail-cover,
.pearl-landscape-courses .course-detail-card > img,
.pearl-landscape-courses .pearl-course-visual img {
 position:static !important;display:block !important; box-sizing:border-box !important;
 width:100% !important; max-width:100% !important;min-width:0 !important;
 height:auto !important; max-height:unset !important;
 aspect-ratio:16 / 9 !important;object-fit:contain !important;
 object-position:center !important;margin:0 auto 22px !important;
 border-radius:12px !important;transform:none !important;
}
.pearl-landscape-courses .pearl-course-visual-frame > img {height:100% !important;margin:0 !important;}
.pearl-landscape-courses .course-detail-card {overflow:hidden !important;overflow-wrap:anywhere;}
.pearl-landscape-courses .course-detail-card > * {max-width:100%;}
.pearl-landscape-courses .pearl-course-detail-grid {display:grid;grid-template-columns:minmax(0,1.65fr) minmax(260px,.85fr);gap:24px;}
.pearl-landscape-courses .pearl-course-detail-grid > * {min-width:0;max-width:100%;}
/* Optional thumbnails supplied in portrait remain fully visible, with blank side space.
   To fill the frame edge-to-edge, upload a true 16:9 landscape cover. */
@media(max-width:1000px){.pearl-landscape-courses .course-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important}}
@media(max-width:720px){
 .pearl-landscape-courses .course-grid{grid-template-columns:minmax(0,1fr) !important;gap:17px !important}
 .pearl-landscape-courses .course-grid > .course-card{max-width:560px !important;margin-inline:auto;}
 .pearl-landscape-courses .pearl-course-detail-grid{grid-template-columns:minmax(0,1fr);gap:18px;}
 .pearl-landscape-courses .course-card-body{padding:17px;}
 .pearl-landscape-courses .course-detail-card{padding:18px;}
}