/* Besual 4.18 · Course presentation and method (contract v4.2). Shared by courses/view.php and course/index.php. */
.course-about-wrap{--ca-violet:#5b43e8;--ca-ink:#1d1b22;--ca-muted:#5f5b66;--ca-line:#e7e3ee;--ca-soft:#f7f5fc;max-width:1180px;margin:0 auto;padding:8px 24px 24px;color:var(--ca-ink)}
.course-about-wrap .eyebrow{margin:0 0 6px;font-size:12px;font-weight:800;letter-spacing:.14em;color:var(--ca-violet)}
.course-about-wrap h2{margin:0 0 14px;font-size:clamp(24px,3vw,32px);line-height:1.2}
.course-about-wrap h3{margin:0 0 6px;font-size:18px;line-height:1.3}
.course-about-wrap p{margin:0 0 1em;font-size:17px;line-height:1.65;color:var(--ca-ink)}

.course-about{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(260px,1fr);gap:40px;padding:40px 0 32px;border-bottom:1px solid var(--ca-line)}
.course-about-main p{max-width:68ch}
.course-about-audience{padding:14px 16px;border-radius:12px;background:var(--ca-soft)}
.course-facts{display:grid;gap:14px;align-content:start;padding:20px;border:1px solid var(--ca-line);border-radius:16px;background:#fff}
.course-facts>div{display:grid;gap:2px;padding-bottom:12px;border-bottom:1px solid var(--ca-line)}
.course-facts>div:last-child{border-bottom:0;padding-bottom:0}
.course-facts span{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ca-muted)}
.course-facts strong{font-size:18px}
.course-facts small{font-size:14px;color:var(--ca-muted)}
.course-facts-needs ul{margin:4px 0 0;padding-left:18px;font-size:15px;line-height:1.55}

.course-learn{padding:32px 0;border-bottom:1px solid var(--ca-line)}
.course-learn-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 32px;margin:0;padding:0;list-style:none}
.course-learn-list li{position:relative;padding-left:30px;font-size:17px;line-height:1.55}
.course-learn-list li::before{content:"";position:absolute;left:2px;top:5px;width:16px;height:9px;border-left:3px solid var(--ca-violet);border-bottom:3px solid var(--ca-violet);transform:rotate(-45deg)}

.course-method{padding:36px 0 8px}
.course-method .section-title p{max-width:68ch}
.method-moments{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:8px 0 24px;padding:0;list-style:none}
.method-moments li{padding:20px;border:1px solid var(--ca-line);border-radius:16px;background:#fff}
.method-moments li>span{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;margin-bottom:10px;border-radius:50%;background:var(--ca-violet);color:#fff;font-weight:800}
.method-moments p{margin:0;font-size:15px;line-height:1.55;color:var(--ca-muted)}
.method-notes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:20px}
.method-notes>div{padding:18px 20px;border-radius:16px;background:var(--ca-soft)}
.method-notes ul{margin:0;padding-left:18px;font-size:15px;line-height:1.6}
.method-notes p{margin:0;font-size:15px;line-height:1.6}
.method-basis{margin:0 0 8px;padding:16px 20px;border:1px solid var(--ca-line);border-radius:16px;background:#fff}
.method-basis summary{cursor:pointer;font-weight:800;color:var(--ca-violet)}
.method-basis p{margin:12px 0;font-size:15px}
.method-basis ul{margin:0;padding-left:18px;display:grid;gap:10px;font-size:14px;line-height:1.55}
.method-basis ul strong{display:block;font-size:15px;color:var(--ca-ink)}
.method-basis a{color:var(--ca-muted)}
.method-basis .method-honest{font-size:14px;color:var(--ca-muted)}

/* Learner course index: the same content, folded into one panel. */
.course-about-panel{margin:0 0 28px;border:1px solid var(--ca-line,#e7e3ee);border-radius:18px;background:#fff}
.course-about-panel>summary{display:flex;flex-direction:column;gap:2px;padding:18px 22px;cursor:pointer;list-style:none}
.course-about-panel>summary::-webkit-details-marker{display:none}
.course-about-panel>summary .eyebrow{font-size:12px;font-weight:800;letter-spacing:.14em;color:#5b43e8}
.course-about-panel>summary strong{font-size:20px}
.course-about-panel>summary::after{content:"+";position:absolute;right:22px;font-size:24px;color:#5b43e8}
.course-about-panel{position:relative}
.course-about-panel[open]>summary::after{content:"−"}
.course-about-panel .course-about-wrap{padding:0 22px 12px;max-width:none}
.course-about-panel .course-about{padding-top:8px}

@media(max-width:900px){
  .course-about{grid-template-columns:1fr;gap:24px}
  .method-moments{grid-template-columns:repeat(2,minmax(0,1fr))}
  .method-notes{grid-template-columns:1fr}
}
@media(max-width:600px){
  .course-about-wrap{padding:8px 16px 20px}
  .course-learn-list,.method-moments{grid-template-columns:1fr}
  .course-about-wrap p,.course-learn-list li{font-size:16px}
}


/* Besual Learner Experience v1: course overview and curriculum */
.course-page{max-width:1330px!important}
.course-banner{border-radius:0 0 28px 28px;overflow:hidden}
.course-banner-inner{padding-block:clamp(30px,5vw,76px)!important}
.course-banner h1{font-size:clamp(32px,4.3vw,59px)!important;line-height:1.08;letter-spacing:-.035em}
.course-banner .hero-description{max-width:72ch;line-height:1.66}
.course-page .next-feature,.course-page .course-about-panel,.course-page .module,.course-page .feature-card{border-radius:22px!important;border:1px solid #ece8f3!important;box-shadow:0 12px 42px rgba(43,25,87,.055)}
.course-page .next-feature{background:linear-gradient(125deg,#f3efff,#fff)!important;padding:clamp(20px,3vw,34px)!important}
.course-page .module{overflow:hidden;margin-bottom:18px!important}
.course-page .module-header{gap:16px;padding:clamp(18px,2.5vw,29px)!important}
.course-page .lesson-list .lesson{transition:background .18s ease}
.course-page .lesson-list .lesson:hover{background:#f8f6ff!important}
.course-page .btn-primary{background:#634be8!important;border-radius:13px!important}
.course-page a:focus-visible{outline:3px solid #846bf1;outline-offset:3px}
@media(max-width:760px){.course-banner-inner{padding-inline:18px!important}.course-page .module-header{display:block}.course-page .next-feature{padding:20px!important}}