/* CLASSMIRROR V132 PREMIUM — Mirror Score + MirrorBrain */

.cmscore{
  --ms-ink:#252a3a;
  --ms-muted:#6e7588;
  --ms-purple:#6749eb;
  --ms-purple-dark:#342478;
  --ms-green:#1e9c76;
  --ms-amber:#c98919;
  --ms-red:#c34b59;
  --ms-soft:#f7f8fc;
  --ms-border:#e3e5ee;
  overflow:hidden;
  color:var(--ms-ink);
  background:#fff;
}

.cmscore-container{
  width:min(1160px,calc(100% - 40px));
  margin:0 auto;
}

.cmscore-hero{
  position:relative;
  padding:92px 0 88px;
  background:
    radial-gradient(circle at 82% 16%,rgba(110,82,244,.18),transparent 25%),
    radial-gradient(circle at 9% 86%,rgba(55,215,170,.11),transparent 23%),
    linear-gradient(180deg,#fbfaff 0%,#fff 100%);
}

.cmscore-hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(350px,.88fr);
  gap:70px;
  align-items:center;
}

.cmscore-badge,.cmscore-kicker,.cmscore-demo-pill,.cmscore-compare-label{
  display:inline-flex;
  align-items:center;
  min-height:29px;
  padding:5px 11px;
  color:#5a43bf;
  font-size:10px;
  font-weight:950;
  letter-spacing:.055em;
  text-transform:uppercase;
  background:#efecff;
  border:1px solid #ddd7ff;
  border-radius:999px;
}

.cmscore-hero h1{
  max-width:760px;
  margin:17px 0 18px;
  color:#242839;
  font-size:clamp(42px,5.3vw,68px);
  line-height:.99;
  letter-spacing:-.045em;
}

.cmscore-lead{
  max-width:720px;
  margin:0;
  color:#646c7f;
  font-size:17px;
  line-height:1.76;
}

.cmscore-actions{
  display:flex;
  flex-wrap:wrap;
  gap:11px;
  margin-top:28px;
}

.cmscore-button{
  display:inline-flex;
  min-height:48px;
  align-items:center;
  justify-content:center;
  padding:0 19px;
  color:#4e39ad;
  font-size:13px;
  font-weight:900;
  text-decoration:none;
  background:#fff;
  border:1px solid #dcd7f3;
  border-radius:13px;
  transition:transform .16s ease,box-shadow .16s ease;
}

.cmscore-button:hover{transform:translateY(-2px)}

.cmscore-button.primary{
  color:#fff;
  background:linear-gradient(135deg,#5c40d6,#7657f4);
  border-color:transparent;
  box-shadow:0 12px 28px rgba(91,64,214,.22);
}

.cmscore-button.secondary{background:#fff}

.cmscore-trust{
  display:flex;
  flex-wrap:wrap;
  gap:10px 18px;
  margin-top:22px;
  color:#697083;
  font-size:11px;
  font-weight:800;
}

.cmscore-hero-visual{
  position:relative;
  display:flex;
  min-height:430px;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  padding:28px;
}

.cmscore-ring{
  position:relative;
  display:grid;
  width:278px;
  height:278px;
  place-items:center;
  border-radius:50%;
  background:
    conic-gradient(#6749eb 0 78%,#e8e8f0 78% 100%);
  box-shadow:0 28px 65px rgba(72,51,164,.20);
}

.cmscore-ring::before{
  content:"";
  position:absolute;
  inset:14px;
  background:#fff;
  border-radius:50%;
}

.cmscore-ring-inner{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
}

.cmscore-ring-label{
  color:#776f91;
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.06em;
}

.cmscore-ring strong{
  margin-top:5px;
  color:#443090;
  font-size:70px;
  line-height:1;
  letter-spacing:-.06em;
}

.cmscore-ring small{
  margin-top:3px;
  color:#9791a9;
  font-size:13px;
  font-weight:900;
}

.cmscore-demo-label{
  margin-top:20px;
  padding:7px 11px;
  color:#6749eb;
  font-size:10px;
  font-weight:950;
  letter-spacing:.09em;
  background:#f1efff;
  border-radius:999px;
}

.cmscore-demo-warning{
  max-width:310px;
  margin:10px auto 0;
  color:#7b8190;
  font-size:10px;
  line-height:1.55;
  text-align:center;
}

.cmscore-section{
  padding:82px 0;
}

.cmscore-demo-section{
  background:#f7f8fc;
}

.cmscore-heading{
  max-width:820px;
  margin:0 auto 34px;
  text-align:center;
}

.cmscore-heading h2,.cmscore-flow-copy h2{
  margin:13px 0 11px;
  color:#292e3f;
  font-size:clamp(30px,4vw,45px);
  line-height:1.08;
  letter-spacing:-.025em;
}

.cmscore-heading p,.cmscore-flow-copy p{
  margin:0;
  color:var(--ms-muted);
  line-height:1.76;
}

.cmscore-dashboard{
  padding:27px;
  background:#fff;
  border:1px solid #e0e2eb;
  border-radius:26px;
  box-shadow:0 18px 50px rgba(40,45,73,.08);
}

.cmscore-dashboard-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
  padding-bottom:22px;
  border-bottom:1px solid #eaebf1;
}

.cmscore-dashboard-head h3{
  margin:9px 0 0;
  font-size:23px;
}

.cmscore-dashboard-score{
  padding:12px 15px;
  color:#fff;
  font-size:19px;
  font-weight:950;
  background:linear-gradient(135deg,#5a40d4,#7454ef);
  border-radius:14px;
}

.cmscore-metrics{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin-top:20px;
}

.cmscore-metrics article{
  min-height:105px;
  padding:17px;
  background:#f9f9fc;
  border:1px solid #eaebf1;
  border-radius:15px;
}

.cmscore-metrics article.priority{
  background:#fff9ee;
  border-color:#f3dfb7;
}

.cmscore-metrics small{
  display:block;
  color:#858b99;
  font-size:9px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.055em;
}

.cmscore-metrics strong{
  display:block;
  margin-top:8px;
  color:#343949;
  font-size:19px;
  line-height:1.18;
}

.cmscore-demo-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
  margin-top:16px;
}

.cmscore-mirrorbrain-card,.cmscore-next-card{
  padding:23px;
  background:#fff;
  border:1px solid #e4e5ed;
  border-radius:19px;
}

.cmscore-card-title{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:18px;
}

.cmscore-card-title>span{
  display:grid;
  width:47px;
  height:47px;
  place-items:center;
  font-size:24px;
  background:#f1efff;
  border-radius:14px;
}

.cmscore-card-title small{
  display:block;
  color:#837d94;
  font-size:9px;
  font-weight:950;
  text-transform:uppercase;
}

.cmscore-card-title h3{
  margin:3px 0 0;
  font-size:18px;
}

.cmscore-concept,.cmscore-action-line{
  display:flex;
  align-items:center;
  gap:12px;
  padding:13px 0;
  border-top:1px solid #eeeeF3;
}

.cmscore-concept>span,.cmscore-action-line>span{
  display:grid;
  flex:0 0 34px;
  width:34px;
  height:34px;
  place-items:center;
  font-size:15px;
  font-weight:950;
  border-radius:10px;
}

.cmscore-concept.mastered>span{
  color:#168c69;
  background:#eaf8f3;
}

.cmscore-concept.fragile>span{
  color:#b27211;
  background:#fff4df;
}

.cmscore-concept.priority>span{
  color:#5d44cc;
  background:#efecff;
}

.cmscore-action-line>span{
  background:#f2f3f8;
}

.cmscore-concept strong,.cmscore-action-line strong{
  display:block;
  font-size:12px;
}

.cmscore-concept small,.cmscore-action-line small{
  display:block;
  margin-top:3px;
  color:#858b9a;
  font-size:10px;
}

.cmscore-dimensions-section{
  background:#fff;
}

.cmscore-dimensions{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}

.cmscore-dimensions article{
  min-height:250px;
  padding:27px;
  background:#fafafe;
  border:1px solid #e5e6ed;
  border-radius:20px;
}

.cmscore-dimension-icon{
  display:grid;
  width:51px;
  height:51px;
  place-items:center;
  color:#5c44c3;
  font-size:24px;
  background:#efecff;
  border-radius:14px;
}

.cmscore-dimensions h3{
  margin:18px 0 9px;
  font-size:19px;
}

.cmscore-dimensions p{
  min-height:88px;
  margin:0;
  color:#737a8c;
  font-size:12px;
  line-height:1.72;
}

.cmscore-flow-section{
  background:linear-gradient(180deg,#f8f8fc,#fff);
}

.cmscore-flow-layout{
  display:grid;
  grid-template-columns:minmax(0,.8fr) minmax(520px,1.2fr);
  gap:65px;
  align-items:center;
}

.cmscore-flow{
  display:grid;
  grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;
  gap:9px;
  align-items:center;
  padding:23px;
  background:#fff;
  border:1px solid #e2e4ec;
  border-radius:22px;
  box-shadow:0 15px 40px rgba(40,45,73,.07);
}

.cmscore-flow>div{
  min-height:104px;
  padding:15px 10px;
  text-align:center;
  background:#f8f8fc;
  border:1px solid #ececf2;
  border-radius:14px;
}

.cmscore-flow>div span{
  display:grid;
  width:29px;
  height:29px;
  margin:0 auto 10px;
  place-items:center;
  color:#6047c5;
  font-size:10px;
  font-weight:950;
  background:#ece9ff;
  border-radius:50%;
}

.cmscore-flow>div strong{
  font-size:10px;
}

.cmscore-flow>div.active{
  color:#fff;
  background:linear-gradient(145deg,#4933ac,#6d4deb);
  border-color:transparent;
}

.cmscore-flow>div.active span{
  color:#fff;
  background:rgba(255,255,255,.16);
}

.cmscore-flow>b{
  color:#9a91b4;
  font-size:18px;
}

.cmscore-compare-section{
  background:#fff;
}

.cmscore-compare-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:17px;
}

.cmscore-compare-grid article{
  min-height:260px;
  padding:29px;
  border-radius:23px;
}

.cmscore-compare-grid article.simple{
  background:#f7f7fa;
  border:1px solid #e4e5eb;
}

.cmscore-compare-grid article.classmirror{
  background:linear-gradient(150deg,#f0edff,#fbfaff);
  border:1px solid #d8d1ff;
}

.cmscore-compare-grid h3{
  margin:17px 0 10px;
  font-size:25px;
  line-height:1.15;
}

.cmscore-compare-grid p{
  margin:0;
  color:#72798a;
  line-height:1.72;
}

.cmscore-info{
  padding:74px 0;
  background:#f7f8fc;
}

.cmscore-info-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}

.cmscore-info article{
  display:flex;
  gap:14px;
  padding:24px;
  background:#fff;
  border:1px solid #e3e5ec;
  border-radius:18px;
}

.cmscore-info article>span{
  font-size:25px;
}

.cmscore-info h3{
  margin:0 0 7px;
  font-size:16px;
}

.cmscore-info p{
  margin:0;
  color:#737a8b;
  font-size:12px;
  line-height:1.7;
}

.cmscore-final{
  padding:82px 0 90px;
  background:#fff;
}

.cmscore-final-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:38px;
  padding:42px;
  color:#fff;
  background:
    radial-gradient(circle at 88% 8%,rgba(92,227,189,.19),transparent 28%),
    linear-gradient(135deg,#2d1f69,#6849ed);
  border-radius:27px;
  box-shadow:0 25px 60px rgba(49,32,117,.22);
}

.cmscore-final h2{
  max-width:750px;
  margin:12px 0 9px;
  color:#fff;
  font-size:clamp(29px,4vw,43px);
  line-height:1.06;
}

.cmscore-final p{
  max-width:760px;
  margin:0;
  color:rgba(255,255,255,.77);
  line-height:1.7;
}

.cmscore-badge.dark{
  color:#fff;
  background:rgba(255,255,255,.12);
  border-color:rgba(255,255,255,.18);
}

.cmscore-button.light{
  flex:0 0 auto;
  color:#4d35af;
  background:#fff;
  border-color:#fff;
}

.cmscore-final-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

html[dir="rtl"] .cmscore{
  text-align:right;
}

html[dir="rtl"] .cmscore-flow>b{
  transform:rotate(180deg);
}

@media(max-width:1000px){
  .cmscore-hero-grid,
  .cmscore-flow-layout{
    grid-template-columns:1fr;
  }

  .cmscore-hero-visual{
    min-height:370px;
  }

  .cmscore-metrics{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:820px){
  .cmscore-demo-grid,
  .cmscore-dimensions,
  .cmscore-compare-grid,
  .cmscore-info-grid{
    grid-template-columns:1fr;
  }

  .cmscore-dimensions p{
    min-height:0;
  }

  .cmscore-final-card{
    align-items:flex-start;
    flex-direction:column;
  }
}

@media(max-width:640px){
  .cmscore-container{
    width:min(100% - 28px,1160px);
  }

  .cmscore-hero{
    padding:58px 0 54px;
  }

  .cmscore-section,
  .cmscore-info,
  .cmscore-final{
    padding:58px 0;
  }

  .cmscore-hero h1{
    font-size:40px;
  }

  .cmscore-lead{
    font-size:14px;
  }

  .cmscore-ring{
    width:210px;
    height:210px;
  }

  .cmscore-ring strong{
    font-size:54px;
  }

  .cmscore-metrics{
    grid-template-columns:1fr;
  }

  .cmscore-dashboard{
    padding:18px;
  }

  .cmscore-dashboard-head{
    align-items:stretch;
    flex-direction:column;
  }

  .cmscore-dashboard-score{
    align-self:flex-start;
  }

  .cmscore-flow{
    grid-template-columns:1fr;
  }

  .cmscore-flow>b{
    transform:rotate(90deg);
    text-align:center;
  }

  html[dir="rtl"] .cmscore-flow>b{
    transform:rotate(90deg);
  }

  .cmscore-actions,
  .cmscore-final-actions{
    display:grid;
    width:100%;
  }

  .cmscore-button{
    width:100%;
  }

  .cmscore-final-card{
    padding:28px 22px;
  }
}