/* AR Course Details for Elementor v1.0.0 — banner, About, What You Will
   Learn and the sticky fee card from the SSITP Digital Marketing page.
   Every control-written value arrives as a CSS var on {{WRAPPER}} and is
   consumed here with its default as the var() fallback — this stylesheet
   declares no control vars of its own, so Elementor's per-device values
   always win. Defaults reproduce the Digital Marketing redesign:
   navy #0A083B / #2C4A70, amber #DB8927 / dark #C1751F, ink #13183F. */

/* ---------- Shared: section shell, heading, animations ---------- */
.arport-sec{margin:var(--arport-margin,0); padding:var(--arport-pad,64px 20px 64px);
  overflow-x:clip;}
.arport-inner{max-width:var(--arport-in-max,1200px); margin:0 auto;}
.arport-sec.arport-fit{display:flex; flex-direction:column; justify-content:center;
  min-height:calc(var(--arport-fit-h,100vh) - var(--arport-nav,0px));}
.arport-sec.arport-fit .arport-inner{zoom:var(--arport-scale,1); width:100%;}
.arport-head{font-family:var(--arport-hfont,"Bricolage Grotesque",Manrope,sans-serif);
  font-size:var(--arport-h-fs,27px); font-weight:800; line-height:1.08;
  letter-spacing:-.01em; color:var(--arport-h-c,#13183F); margin:0 0 14px;}

/* Entrance animations: hidden state is JS-gated (.arport-anim-on is added
   by JS only), so content stays fully visible when JS is disabled. */
.arport-anim .arport-anim-item{transition:opacity var(--arport-in-speed,600ms) ease,
  transform var(--arport-in-speed,600ms) ease;}
.arport-anim.arport-anim-on .arport-anim-item{opacity:0;}
.arport-anim.arport-anim-on .arport-anim-item.anim-fade-up{transform:translateY(24px);}
.arport-anim.arport-anim-on .arport-anim-item.anim-slide-left{transform:translateX(-28px);}
.arport-anim.arport-anim-on .arport-anim-item.anim-slide-right{transform:translateX(28px);}
.arport-anim.arport-anim-on .arport-anim-item.anim-zoom{transform:scale(.94);}
.arport-anim.arport-anim-on .arport-anim-item.in{opacity:1; transform:none;}
@media (prefers-reduced-motion:reduce){
  .arport-anim .arport-anim-item{transition:none;}
  .arport-anim.arport-anim-on .arport-anim-item{opacity:1; transform:none;}
}

/* ---------- AR Course Details ---------- */
.arcd-root{background:var(--arcd-sec-bg,#ffffff);
  font-family:var(--arport-bfont,Manrope,system-ui,sans-serif);
  font-size:16.5px; line-height:1.65; color:var(--arcd-body-c,#4B5578);}
.arcd-grid{display:grid; grid-template-columns:1.9fr 1fr;
  gap:var(--arcd-gap,36px); align-items:start;}
.arcd-banner{height:var(--arcd-banner-h,300px); border-radius:18px; overflow:hidden;
  box-shadow:0 18px 44px rgba(10,8,59,.14); margin-bottom:34px;}
.arcd-banner img{width:100%; height:100%; object-fit:cover; display:block;}
.arcd-block{margin-bottom:38px;}
.arcd-block:last-child{margin-bottom:0;}
.arcd-block p{margin:0 0 12px;}
.arcd-block p:last-child{margin-bottom:0;}
.arcd-learn{display:grid; grid-template-columns:repeat(var(--arcd-learn-cols,2),1fr);
  gap:12px 22px; list-style:none; margin:0; padding:0;}
.arcd-learn li{font-size:var(--arcd-learn-fs,15.5px); font-weight:500;
  color:var(--arcd-learn-c,#13183F); padding-left:30px; position:relative; line-height:1.55;}
.arcd-check:before{content:""; position:absolute; left:0; top:3px; width:19px; height:19px;
  border-radius:50%; background:var(--arcd-tick-c,#DB8927);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center/11px no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center/11px no-repeat;}
/* Modules (curriculum accordion) */
.arcd-mod{border:1px solid var(--arcd-mod-bc,#E9E5DA); border-radius:14px; margin-bottom:12px;
  background:var(--arcd-mod-bg,#ffffff); overflow:hidden;}
.arcd-mod summary{cursor:pointer; list-style:none; display:flex; align-items:center; gap:14px; padding:17px 20px;}
.arcd-mod summary::-webkit-details-marker{display:none;}
.arcd-mod .no{flex:none; width:34px; height:34px; border-radius:50%;
  background:var(--arcd-mod-num-bg,rgba(219,137,39,.14)); color:var(--arcd-mod-num-c,#C1751F);
  font-family:var(--arport-hfont,"Bricolage Grotesque",Manrope,sans-serif); font-weight:800; font-size:14px;
  display:flex; align-items:center; justify-content:center;}
.arcd-mod h4{font-size:16px; font-weight:700; flex:1; color:var(--arcd-mod-title-c,#13183F); margin:0;}
.arcd-mod .plus{font-size:20px; font-weight:700; color:var(--arcd-mod-num-c,#C1751F); transition:.25s;}
.arcd-mod[open ] .plus{transform:rotate(45deg);}
.arcd-mod[open]{border-color:var(--arcd-mod-open-bc,#DB8927);}
.arcd-mod .body{padding:0 20px 18px 68px; color:var(--arcd-mod-body-c,#4B5578); font-size:15px;}
.arcd-mod .body p{margin:0 0 6px;}
.arcd-mod .body ul{margin:6px 0 0; padding-left:18px;}
.arcd-mod .body li{margin-bottom:4px;}
/* Fee card */
.arcd-side.arcd-sticky{position:sticky; top:24px;}
.arcd-fee-card{background:var(--arcd-card-bg,#ffffff);
  border:1px solid var(--arcd-card-bc,#E9E5DA);
  border-radius:var(--arcd-card-r,18px); padding:26px;
  box-shadow:0 18px 44px rgba(10,8,59,.10);
  transition:transform .3s ease,box-shadow .3s ease;}
.arcd-fee-card:hover{transform:translateY(calc(var(--arport-lift,6px) * -1));
  box-shadow:0 24px 52px rgba(10,8,59,.16);}
.arcd-fee{font-family:var(--arport-hfont,"Bricolage Grotesque",Manrope,sans-serif);
  font-size:var(--arcd-fee-fs,34px); font-weight:800;
  color:var(--arcd-fee-c,#13183F); letter-spacing:-.5px; line-height:1.1;}
.arcd-fee small{display:block; font-family:var(--arport-bfont,Manrope,system-ui,sans-serif);
  font-size:13.5px; font-weight:500; color:var(--arcd-body-c,#4B5578); margin-top:2px;}
.arcd-fee-list{list-style:none; margin:20px 0; padding:0; border-top:1px solid var(--arcd-card-bc,#E9E5DA);}
.arcd-fee-list li{padding:11px 0; border-bottom:1px solid var(--arcd-card-bc,#E9E5DA);
  font-size:15px; color:var(--arcd-row-label-c,#13183F); font-weight:500;
  display:flex; justify-content:space-between; gap:12px;}
.arcd-fee-list li span:last-child{color:var(--arcd-row-value-c,#4B5578); font-weight:400; text-align:right;}
.arcd-btn{display:block; font-family:var(--arport-hfont,"Bricolage Grotesque",Manrope,sans-serif);
  font-weight:700; font-size:15.5px; text-decoration:none; text-align:center;
  padding:14px 28px; border-radius:12px; transition:.25s; border:none; cursor:pointer;}
.arcd-btn-navy{background:var(--arcd-enroll-bg,#0A083B); color:var(--arcd-enroll-c,#ffffff); width:100%;}
.arcd-btn-navy:hover{background:#191463;}
.arcd-btn-ghost{border:1.5px solid var(--arcd-call-bc,#DDD8C8); color:var(--arcd-call-c,#13183F);
  width:100%; margin-top:10px; background:var(--arcd-card-bg,#ffffff);}
.arcd-btn-ghost:hover{border-color:var(--arcd-tick-c,#DB8927); color:var(--arcd-tick-c,#DB8927);}
.arcd-fee-note{font-size:13.5px; color:var(--arcd-body-c,#4B5578); margin:14px 0 0; text-align:center;}

/* ---------- Small screens ---------- */
@media(max-width:767px){
  .arcd-grid{grid-template-columns:1fr;}
  .arcd-side.arcd-sticky{position:static;}
  .arcd-learn{grid-template-columns:1fr;}
}
@media(max-width:480px){
  .arcd-mod .body{padding-left:20px;}
}