/* DR UK Institute — R5.61 Course Layout Standard
   Canonical shared layout for all 16 course detail pages.
   Mobile-first responsive grid logic; visible card gaps; square corporate panels. */

body.course-standard-v561{
  --c561-gap:24px;
  --c561-gap-tablet:18px;
  --c561-gap-mobile:16px;
  --c561-line:#d8e5ec;
  --c561-navy:#082f57;
  --c561-teal:#087f79;
  --c561-muted:#526b82;
  --c561-soft:#f5f8fb;
  --c561-white:#fff;
}

/* Base corporate panel language */
body.course-standard-v561 .course-summary,
body.course-standard-v561 .course-quick-card,
body.course-standard-v561 .curriculum-card,
body.course-standard-v561 .feature-check-grid > div,
body.course-standard-v561 .suitable-item,
body.course-standard-v561 .practice-panel,
body.course-standard-v561 .course-admission-steps ol > li,
body.course-standard-v561 .v83-info,
body.course-standard-v561 .career-list li{
  border:1px solid var(--c561-line)!important;
  border-radius:0!important;
  box-shadow:none!important;
  background:var(--c561-white)!important;
}

/* Overview quick facts — two equal cards, never joined */
body.course-standard-v561 .course-quick-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:var(--c561-gap)!important;
  border:0!important;
  border-radius:0!important;
  overflow:visible!important;
  background:transparent!important;
  max-width:none!important;
}
body.course-standard-v561 .course-quick-card{
  border-right:1px solid var(--c561-line)!important;
  border-bottom:1px solid var(--c561-line)!important;
  padding:22px!important;
}
body.course-standard-v561 .course-quick-grid > .course-quick-card:only-child{
  grid-column:1/-1;
  max-width:560px;
}

/* Six-card learning/features grids — balanced 3 x 2 */
body.course-standard-v561 .curriculum-grid,
body.course-standard-v561 .feature-check-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:var(--c561-gap)!important;
  border:0!important;
  border-radius:0!important;
  overflow:visible!important;
  background:transparent!important;
}
body.course-standard-v561 .curriculum-card,
body.course-standard-v561 .feature-check-grid > div{
  border-right:1px solid var(--c561-line)!important;
  border-bottom:1px solid var(--c561-line)!important;
  padding:22px!important;
  min-width:0;
}

/* Four suitability items — always balanced 2 x 2 on desktop/tablet */
body.course-standard-v561 .suitable-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:var(--c561-gap)!important;
  border:0!important;
  border-radius:0!important;
  overflow:visible!important;
  background:transparent!important;
  margin-top:20px;
}
body.course-standard-v561 .suitable-item{
  border-right:1px solid var(--c561-line)!important;
  border-bottom:1px solid var(--c561-line)!important;
  padding:20px!important;
  min-height:84px;
}

/* Practical panels — two equal columns with breathing space */
body.course-standard-v561 .practice-equipment-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:var(--c561-gap)!important;
}
body.course-standard-v561 .practice-panel{
  padding:24px!important;
}

/* Career/placement support — three independent cards */
body.course-standard-v561 .v83-info-strip{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:var(--c561-gap)!important;
  border:0!important;
  background:transparent!important;
}
body.course-standard-v561 .v83-info{
  border-right:1px solid var(--c561-line)!important;
  border-bottom:1px solid var(--c561-line)!important;
  padding:22px!important;
}

/* Four admission steps — equal row on desktop; square cards */
body.course-standard-v561 .course-admission-steps ol{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:var(--c561-gap)!important;
}
body.course-standard-v561 .course-admission-steps ol > li{
  min-height:150px!important;
  padding:58px 20px 22px!important;
}
body.course-standard-v561 .course-admission-steps ol > li::before{
  border-radius:0!important;
}

/* Split/content feature blocks share straight corporate edges */
body.course-standard-v561 .v85-career-direction,
body.course-standard-v561 .v85-course-cta-split{
  border-radius:0!important;
}
body.course-standard-v561 .v85-career-direction{
  box-shadow:none!important;
}

/* Remove small rounded-card drift from supporting course components */
body.course-standard-v561 .course-section-title > span,
body.course-standard-v561 .curriculum-icon,
body.course-standard-v561 .quick-card-icon,
body.course-standard-v561 .hero-course-meta span,
body.course-standard-v561 .faq-item,
body.course-standard-v561 .syllabus-year{
  border-radius:0!important;
}

/* Keep section rhythm consistent without changing content/order */
body.course-standard-v561 .course-copy-section{
  padding-top:52px!important;
  padding-bottom:52px!important;
}
body.course-standard-v561 .course-section-title{
  margin-bottom:24px!important;
}

@media (max-width:900px){
  body.course-standard-v561{
    --c561-gap:var(--c561-gap-tablet);
  }
  body.course-standard-v561 .curriculum-grid,
  body.course-standard-v561 .feature-check-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  body.course-standard-v561 .suitable-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  body.course-standard-v561 .course-admission-steps ol{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  body.course-standard-v561 .v83-info-strip{
    grid-template-columns:1fr!important;
  }
  body.course-standard-v561 .v83-info{
    border-bottom:1px solid var(--c561-line)!important;
  }
}

@media (max-width:640px){
  body.course-standard-v561{
    --c561-gap:var(--c561-gap-mobile);
  }
  body.course-standard-v561 .course-quick-grid,
  body.course-standard-v561 .curriculum-grid,
  body.course-standard-v561 .feature-check-grid,
  body.course-standard-v561 .suitable-grid,
  body.course-standard-v561 .practice-equipment-grid,
  body.course-standard-v561 .course-admission-steps ol,
  body.course-standard-v561 .two-column-copy{
    grid-template-columns:1fr!important;
  }
  body.course-standard-v561 .course-quick-grid > .course-quick-card:only-child{
    max-width:none;
  }
  body.course-standard-v561 .course-copy-section{
    padding-top:38px!important;
    padding-bottom:38px!important;
  }
  body.course-standard-v561 .curriculum-card,
  body.course-standard-v561 .feature-check-grid > div,
  body.course-standard-v561 .suitable-item,
  body.course-standard-v561 .practice-panel,
  body.course-standard-v561 .v83-info{
    padding:18px!important;
  }
  body.course-standard-v561 .course-admission-steps ol > li{
    min-height:0!important;
    padding:54px 18px 18px!important;
  }
}




/* R5.60 — compact but fixed-header-safe course hero spacing.
   The fixed header height is already reserved by testcase-pass-v103.css;
   this preserves a visible breathing gap without allowing the hero card to sit
   flush against the header at desktop/tablet/mobile widths. */
body.course-standard-v561{
  scroll-padding-top:calc(var(--druk-header-live-height, 118px) + 58px);
}
body.course-standard-v561 .course-detail-hero{
  padding-top:30px!important;
  padding-bottom:34px!important;
}
body.course-standard-v561 .course-detail-hero .page-hero-grid{
  margin-top:0!important;
}
@media (max-width:900px){
  body.course-standard-v561 .course-detail-hero{
    padding-top:22px!important;
    padding-bottom:28px!important;
  }
}
@media (max-width:640px){
  body.course-standard-v561 .course-detail-hero{
    padding-top:18px!important;
    padding-bottom:22px!important;
  }
}


/* R5.61 — Admission step sequence: explicit values avoid legacy counter collisions */
body.course-standard-v561 .course-admission-steps ol{
  counter-reset:none!important;
}
body.course-standard-v561 .course-admission-steps ol > li,
body.course-standard-v561 .course-admission-steps ol > li::before{
  counter-increment:none!important;
}
body.course-standard-v561 .course-admission-steps ol > li:nth-child(1)::before{content:"1"!important;}
body.course-standard-v561 .course-admission-steps ol > li:nth-child(2)::before{content:"2"!important;}
body.course-standard-v561 .course-admission-steps ol > li:nth-child(3)::before{content:"3"!important;}
body.course-standard-v561 .course-admission-steps ol > li:nth-child(4)::before{content:"4"!important;}

/* R5.61 — Compact Career Directions panel */
body.course-standard-v561 .course-copy-section.v85-career-direction{
  display:grid!important;
  grid-template-columns:96px minmax(0,1fr)!important;
  gap:0!important;
  padding:0!important;
  margin:28px 0!important;
  margin-left:0!important;
  margin-right:0!important;
  border:1px solid var(--c561-line)!important;
  border-radius:0!important;
  overflow:hidden!important;
  background:#fff!important;
  box-shadow:none!important;
}
body.course-standard-v561 .course-copy-section.v85-career-direction .v85-career-icon{
  min-height:148px!important;
  display:grid!important;
  place-items:center!important;
  background:var(--c561-teal)!important;
  color:#fff!important;
}
body.course-standard-v561 .course-copy-section.v85-career-direction .v85-career-icon i{
  font-size:2.35rem!important;
}
body.course-standard-v561 .course-copy-section.v85-career-direction .v85-career-copy{
  padding:26px 30px!important;
  align-self:center!important;
}
body.course-standard-v561 .course-copy-section.v85-career-direction .v85-career-copy h2{
  margin:0 0 10px!important;
  font-size:1.55rem!important;
  line-height:1.15!important;
  color:var(--c561-navy)!important;
}
body.course-standard-v561 .course-copy-section.v85-career-direction .v85-career-copy p{
  margin:0!important;
  max-width:none!important;
  color:var(--c561-muted)!important;
  line-height:1.65!important;
}
@media (max-width:760px){
  body.course-standard-v561 .course-copy-section.v85-career-direction{
    grid-template-columns:68px minmax(0,1fr)!important;
    margin:22px 0!important;
  }
  body.course-standard-v561 .course-copy-section.v85-career-direction .v85-career-icon{
    min-height:0!important;
  }
  body.course-standard-v561 .course-copy-section.v85-career-direction .v85-career-icon i{
    font-size:1.85rem!important;
  }
  body.course-standard-v561 .course-copy-section.v85-career-direction .v85-career-copy{
    padding:20px!important;
  }
  body.course-standard-v561 .course-copy-section.v85-career-direction .v85-career-copy h2{
    font-size:1.3rem!important;
  }
}

/* R5.63 — course hero outer-gap correction.
   Reduce the visible empty band between the shared header and the hero card.
   Lock section/container/grid spacing so legacy page-hero rules cannot reintroduce the gap. */
body.course-standard-v561 .course-detail-hero.page-hero{
  padding-top:10px!important;
  padding-bottom:24px!important;
  margin-top:0!important;
}
body.course-standard-v561 .course-detail-hero > .container{
  padding-top:0!important;
  margin-top:0!important;
}
body.course-standard-v561 .course-detail-hero .page-hero-grid{
  margin-top:0!important;
}
@media (max-width:900px){
  body.course-standard-v561 .course-detail-hero.page-hero{
    padding-top:8px!important;
    padding-bottom:20px!important;
  }
}
@media (max-width:640px){
  body.course-standard-v561 .course-detail-hero.page-hero{
    padding-top:6px!important;
    padding-bottom:16px!important;
  }
}


/* R5.64 — Course navigation, divider, FAQ and related-course cleanup.
   Shared final rules for all 16 course detail pages. */

/* Course pages do not need the generic cyan header separator. */
body.course-standard-v561 .site-header{
  border-bottom:0!important;
}

/* Use spacing/background changes for section separation; remove generic horizontal rules. */
body.course-standard-v561 .course-detail-hero,
body.course-standard-v561 .course-copy-section{
  border-top:0!important;
  border-bottom:0!important;
}

/* Admission Enquiry: keep headings left aligned and justify supporting descriptions. */
body.course-standard-v561 .course-admission-steps ol > li strong{
  text-align:left!important;
}
body.course-standard-v561 .course-admission-steps ol > li span{
  text-align:justify!important;
  text-justify:inter-word;
  hyphens:auto;
}

/* FAQ: clear left/right inset for question, +/- icon and expanded answer. */
body.course-standard-v561 .v83-course-faq .faq-list{
  gap:16px!important;
}
body.course-standard-v561 .v83-course-faq .faq-item{
  overflow:hidden!important;
  border-radius:0!important;
}
body.course-standard-v561 .v83-course-faq .faq-question{
  display:flex!important;
  align-items:flex-start!important;
  gap:20px!important;
  padding:18px 24px!important;
}
body.course-standard-v561 .v83-course-faq .faq-question > span{
  flex:1 1 auto;
  min-width:0;
  padding-right:6px;
}
body.course-standard-v561 .v83-course-faq .faq-question > i{
  flex:0 0 20px;
  width:20px;
  margin-left:auto!important;
  margin-top:3px;
  text-align:center;
}
body.course-standard-v561 .v83-course-faq .faq-answer{
  padding:0 24px 20px!important;
}
body.course-standard-v561 .v83-course-faq .faq-answer p{
  margin:0!important;
}

/* Related Courses: give each item clear breathing space rather than a tight chip row. */
body.course-standard-v561 .v85-related-strip-section{
  padding-top:8px!important;
  padding-bottom:36px!important;
}
body.course-standard-v561 .v85-related-strip{
  gap:18px!important;
  padding:16px 18px!important;
  border-radius:0!important;
}
body.course-standard-v561 .v85-related-scroll{
  gap:14px!important;
}
body.course-standard-v561 .v85-related-scroll a{
  padding:9px 12px!important;
  border-radius:0!important;
}

@media (max-width:640px){
  body.course-standard-v561 .course-admission-steps ol > li span{
    text-align:justify!important;
  }
  body.course-standard-v561 .v83-course-faq .faq-list{
    gap:14px!important;
  }
  body.course-standard-v561 .v83-course-faq .faq-question{
    gap:16px!important;
    padding:16px 18px!important;
  }
  body.course-standard-v561 .v83-course-faq .faq-answer{
    padding:0 18px 18px!important;
  }
  body.course-standard-v561 .v85-related-strip{
    gap:12px!important;
    padding:14px 16px!important;
  }
  body.course-standard-v561 .v85-related-scroll{
    gap:12px!important;
  }
}
