/* Atheer Training — catalog + course detail styles */

/* Tailored course cards */
.catalog{background:#f6f3f0}
.course-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2.5vw,34px)}
.course-card{display:flex;flex-direction:column;gap:13px;background:var(--cream);padding:clamp(28px,3vw,44px);transition:.3s}
.course-card:hover{transform:translateY(-7px);box-shadow:0 18px 45px rgba(62,52,48,.1)}
.course-cat{font:500 10.5px "DM Sans","Readex Pro",sans-serif;letter-spacing:2px;text-transform:uppercase;color:var(--caramel)}
.course-card h3{font-size:clamp(19px,1.9vw,25px);font-weight:500;line-height:1.6;margin:0}
.course-card>p{font-size:13.5px;color:#746965;line-height:1.95;margin:0}
.course-facts{display:grid;gap:9px;margin-top:auto;padding-top:20px;border-top:1px solid rgba(92,79,74,.16)}
.fact{display:flex;align-items:center;gap:10px;font-size:12px;color:#746965}
.fact svg{width:15px;height:15px;flex:none;stroke:var(--caramel);fill:none;stroke-width:1.5}
.course-card .go{font-size:12px;color:var(--sage);margin-top:14px}

/* "What makes us different" band */
.unique-band{position:relative;overflow:hidden;background:var(--dark);color:white;padding:clamp(70px,9vw,120px) var(--pad)}
.unique-band:before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(38,63,59,.93),rgba(38,63,59,.93)),url("assets/Official Pattern.svg") center/cover no-repeat;opacity:.3}
.unique-inner{position:relative;z-index:2}
.unique-head{max-width:760px;margin-bottom:clamp(34px,4vw,56px)}
.unique-band .kicker{display:block;color:var(--caramel)}
.unique-band h2{font-size:clamp(30px,4.2vw,52px);font-weight:400;letter-spacing:-1px;line-height:1.4;margin:0}
.unique-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,44px)}
.unique-item{padding:clamp(26px,3vw,40px);border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04)}
.unique-item small{font:500 11px "DM Sans","Readex Pro",sans-serif;letter-spacing:2px;color:var(--caramel)}
.unique-item h3{font-size:clamp(20px,2.2vw,27px);font-weight:500;line-height:1.5;color:#fff;margin:12px 0 12px}
.unique-item p{font-size:14px;color:#d8d4d0;line-height:2;margin:0}
.unique-band .button{margin-top:clamp(30px,4vw,46px)}

/* Open-enrolment bundles */
.bundles{background:var(--cream)}
.bundle{margin-top:clamp(40px,5vw,64px)}
.bundle:first-of-type{margin-top:0}
.bundle-title{display:flex;align-items:center;justify-content:space-between;gap:18px;font-size:clamp(21px,2.3vw,28px);font-weight:500;margin:0;padding:0 0 14px;border-bottom:2px solid var(--dark);cursor:pointer;list-style:none}
.bundle-title::-webkit-details-marker{display:none}
.bundle-title:after{content:"+";flex:none;color:var(--caramel);font:300 26px "DM Sans";transition:transform .25s ease}
.bundle[open] .bundle-title:after{transform:rotate(45deg)}
.bundle-row{display:grid;grid-template-columns:2.2fr 1.1fr 1.2fr auto;gap:18px;align-items:start;padding:18px 0;border-bottom:1px solid rgba(92,79,74,.16)}
.bundle-course small{display:block;font:500 10px "DM Sans","Readex Pro",sans-serif;letter-spacing:2px;text-transform:uppercase;color:var(--caramel);margin-bottom:5px}
.bundles .bundle-course small{display:none!important}
.bundle-course b{display:block;font-size:15px;font-weight:500;color:var(--ink);line-height:1.6}
.bundle-row .meta{display:flex;align-items:center;gap:8px;font-size:12.5px;color:#746965;line-height:1.6}
.bundle-row .meta svg{width:15px;height:15px;flex:none;stroke:var(--caramel);fill:none;stroke-width:1.5}
.status{justify-self:end;width:152px;text-align:center;font:500 11px "DM Sans","Readex Pro",sans-serif;letter-spacing:1px;padding:9px 16px;border:1px solid rgba(92,79,74,.28);background:transparent;color:#746965;white-space:nowrap;line-height:1.6}
button.status{cursor:pointer;transition:color .25s ease,background-color .25s ease,border-color .25s ease}
button.status:hover,button.status:focus-visible{border-color:var(--caramel);background:var(--caramel);color:var(--dark)}
.status.soon{border-color:var(--caramel);color:#8a6a45;background:rgba(201,153,107,.12)}

/* Notify-me modal */
.notify-modal{width:min(520px,calc(100vw - 32px));padding:clamp(26px,3.5vw,42px);border:1px solid #e2dbd5;background:var(--white);color:var(--espresso);position:relative}
.notify-modal::backdrop{background:rgba(38,63,59,.55)}
.notify-modal h3{font-size:clamp(21px,2.3vw,28px);font-weight:500;line-height:1.5;margin:0 0 24px;padding-inline-end:34px}
.notify-close{position:absolute;top:14px;inset-inline-end:16px;width:34px;height:34px;display:grid;place-items:center;border:0;background:transparent;color:#a9a19c;font-size:24px;line-height:1;cursor:pointer;transition:color .2s ease}
.notify-close:hover{color:var(--caramel)}

/* Logistics cards — dark green, the only green cards on the site */
.cred-strip{padding:clamp(60px,8vw,100px) var(--pad);display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.5vw,34px);background:#f6f3f0}
.cred-item{position:relative;overflow:hidden;padding:clamp(30px,3.2vw,46px);background:var(--dark);color:#fff;transition:transform .3s ease,box-shadow .3s ease}
.cred-item:before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(38,63,59,.9),rgba(38,63,59,.9)),url("assets/Official Pattern.svg") center/cover no-repeat;opacity:.32}
.cred-item:after{content:"";position:absolute;inset-block-start:0;inset-inline-start:0;width:56px;height:2px;background:var(--caramel);z-index:2}
.cred-item:hover{transform:translateY(-6px);box-shadow:0 18px 45px rgba(38,63,59,.24)}
.cred-item h3,.cred-item p{position:relative;z-index:2}
.cred-item h3{font-size:clamp(17px,1.8vw,21px);font-weight:500;line-height:1.55;color:#fff;margin:0 0 12px}
.cred-item p{font-size:13px;color:#d8d4d0;line-height:2;margin:0}

/* ==== Course detail ==== */
.hero-facts{display:flex;gap:clamp(20px,3.5vw,50px);flex-wrap:wrap;margin-top:32px}
.hero-fact small{display:block;font:500 10px "DM Sans","Readex Pro",sans-serif;letter-spacing:2px;text-transform:uppercase;color:#b9ac9f;margin-bottom:4px}
.hero-fact b{font-size:14px;font-weight:500;color:#f0ece8}

.course-layout{display:grid;grid-template-columns:1.55fr 1fr;gap:clamp(34px,5vw,80px);align-items:start;padding:clamp(60px,8vw,95px) var(--pad);background:var(--cream)}
.course-main h2{font-size:clamp(19px,2vw,24px);font-weight:500;margin:44px 0 16px}
.course-main h2:first-of-type{margin-top:0}
.course-main>p{font-size:14.5px;color:#5f544f;line-height:2.1;margin:0 0 16px}
.course-list{list-style:none;margin:0 0 10px;padding:0;display:grid;gap:10px}
.course-list li{position:relative;font-size:13.5px;color:#5f544f;padding-inline-start:20px;line-height:1.95}
.course-list li:before{content:"";position:absolute;inset-inline-start:0;top:.75em;width:9px;height:1.5px;background:var(--caramel)}

.outline details{background:var(--white);border:1px solid #e2dbd5;margin-bottom:10px}
.outline summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:17px 22px;cursor:pointer;font-size:14.5px;font-weight:500;color:var(--ink)}
.outline summary::-webkit-details-marker{display:none}
.outline summary:after{content:"+";font:300 20px "DM Sans";color:var(--caramel);transition:transform .25s ease}
.outline details[open] summary:after{transform:rotate(45deg)}
.outline .outline-body{padding:0 22px 20px}
.outline .outline-body ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.outline .outline-body li{position:relative;font-size:13px;color:#5f544f;padding-inline-start:18px;line-height:1.9}
.outline .outline-body li:before{content:"";position:absolute;inset-inline-start:0;top:.72em;width:8px;height:1.5px;background:var(--sage)}
.exercise-note{margin-top:14px;padding:12px 16px;background:rgba(92,118,109,.1);border-inline-start:2px solid var(--sage);font-size:12.5px;color:#4c635a;line-height:1.9}

.cert-note{margin-top:14px;padding:16px 20px;border:1px solid rgba(92,79,74,.2);font-size:13px;color:#5f544f;line-height:2}
.cert-note b{color:var(--ink);font-weight:500}

/* Sticky enquiry aside */
.course-aside{position:sticky;top:105px;display:grid;gap:20px}
.aside-card{background:var(--white);border:1px solid #e2dbd5;padding:clamp(24px,2.5vw,32px)}
.aside-card h3{font-size:16px;font-weight:500;margin:0 0 6px}
.aside-card>p{font-size:12.5px;color:#746965;margin:0 0 18px;line-height:1.9}
.aside-note{font-size:12px;color:#746965;line-height:1.95;background:#f6f3f0;padding:16px 20px}
.aside-note b{color:var(--espresso);font-weight:500}

/* FAQ */
.faq{background:#f6f3f0}
.faq .outline{max-width:820px}

@media(max-width:900px){
  .course-layout{grid-template-columns:1fr}
  .course-aside{position:static}
}
@media(max-width:800px){
  .course-grid{grid-template-columns:1fr}
  .unique-grid{grid-template-columns:1fr}
  .bundle-row{grid-template-columns:1fr;gap:9px;padding:20px 0;align-items:start}
  .status{justify-self:start;margin-top:4px}
  .cred-strip{grid-template-columns:1fr;gap:14px}
}