/* Team Caro · Progress Premium V1
   Presentation-only layer for the client progress surface. */

#portal .ptabpanel[data-tab="prog"]>.grid{
  gap:22px;
  align-items:start;
}

/* ── Editorial lead ─────────────────────────────────────────────────────── */
#portal .progress-lead{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  grid-column:span 12;
  min-height:300px;
  padding:44px 48px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  border:1px solid rgba(255,255,255,.16);
  border-radius:26px;
  color:#f8f4ec;
  background:#1d1a16;
  box-shadow:0 34px 84px -52px rgba(39,29,18,.72);
}
#portal .progress-lead::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  background:url('/assets/home/lifecycle-bg.webp') 52% 46%/cover no-repeat;
  filter:saturate(.78) contrast(1.04) brightness(.82);
  transform:scale(1.02);
}
#portal .progress-lead::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(90deg,rgba(23,20,16,.94) 0%,rgba(23,20,16,.80) 36%,rgba(23,20,16,.42) 70%,rgba(23,20,16,.18) 100%);
}
#portal .progress-lead .k{
  color:#e5c28a;
  font-size:10px;
  letter-spacing:.25em;
}
#portal .progress-lead h2{
  max-width:720px;
  margin:12px 0 16px;
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
  font-size:clamp(54px,7vw,86px);
  line-height:.9;
  letter-spacing:-.03em;
  text-transform:none;
  color:#fff;
}
#portal .progress-lead p{
  max-width:48ch;
  margin:0;
  color:rgba(255,255,255,.82);
  font-size:15.5px;
  line-height:1.66;
}

/* ── Lifecycle / process card ──────────────────────────────────────────── */
#portal .ptabpanel[data-tab="prog"] #lifecycleCard{
  grid-column:span 12;
  padding:28px 30px;
  border:1px solid rgba(78,64,47,.12);
  border-radius:22px;
  background:rgba(249,247,241,.92);
  box-shadow:0 28px 72px -56px rgba(47,34,21,.42);
}
#portal .ptabpanel[data-tab="prog"] .lc-phasebar{
  gap:7px;
  margin:8px 0 20px;
}
#portal .ptabpanel[data-tab="prog"] .lc-seg{
  height:4px;
  border:0;
  background:#ded8cd;
}
#portal .ptabpanel[data-tab="prog"] .lc-seg.on{
  background:linear-gradient(90deg,#9a6c2f,#c69b5d);
}
#portal .ptabpanel[data-tab="prog"] .lc-copy{
  max-width:760px;
  font-family:Georgia,'Times New Roman',serif;
  font-size:20px;
  line-height:1.55;
  color:#332d25;
}
#portal .ptabpanel[data-tab="prog"] .lc-ev{
  gap:0;
  margin:22px 0 18px;
  border-top:1px solid rgba(73,60,44,.11);
  border-bottom:1px solid rgba(73,60,44,.11);
}
#portal .ptabpanel[data-tab="prog"] .lc-ev-item{
  padding:18px 22px 17px 0;
  border:0;
  border-right:1px solid rgba(73,60,44,.11);
  border-radius:0;
  background:transparent;
}
#portal .ptabpanel[data-tab="prog"] .lc-ev-item+.lc-ev-item{padding-left:22px}
#portal .ptabpanel[data-tab="prog"] .lc-ev-item:last-child{border-right:0}
#portal .ptabpanel[data-tab="prog"] .lc-ev-v{
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
  font-size:30px;
  color:#27221c;
}
#portal .ptabpanel[data-tab="prog"] .lc-ev-l{
  margin-top:6px;
  font:500 9.5px 'IBM Plex Mono',monospace;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#8a8177;
}
#portal .ptabpanel[data-tab="prog"] .lc-cmp{
  padding-top:18px;
  border-top:0;
}
#portal .ptabpanel[data-tab="prog"] .lc-cmp-h{
  font-size:9.5px;
  letter-spacing:.18em;
  color:#9b6d31;
}
#portal .ptabpanel[data-tab="prog"] .lc-cmp-row{
  max-width:760px;
  padding:8px 0;
  border-bottom:1px solid rgba(73,60,44,.07);
}

/* ── Monthly coach review ──────────────────────────────────────────────── */
#portal .ptabpanel[data-tab="prog"] #monthlyReviewCard{
  padding:32px 34px;
  border:1px solid rgba(150,105,42,.17);
  border-radius:22px;
  background:linear-gradient(145deg,#fbf8f1 0%,#f2ece1 100%);
  box-shadow:0 30px 76px -58px rgba(49,35,21,.45);
}
#portal .ptabpanel[data-tab="prog"] .mr-head{
  padding-bottom:20px;
  margin-bottom:24px;
  border-bottom:1px solid rgba(73,60,44,.12);
}
#portal .ptabpanel[data-tab="prog"] .mr-eyebrow{
  font-size:9.5px;
  letter-spacing:.19em;
}
#portal .ptabpanel[data-tab="prog"] .mr-title{
  margin-top:3px;
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
  font-size:clamp(28px,3.4vw,42px);
  line-height:1.04;
  color:#2e2922;
}
#portal .ptabpanel[data-tab="prog"] .mr-metrics{
  grid-template-columns:repeat(auto-fit,minmax(130px,1fr));
  gap:0;
  margin:0 0 28px;
  border-top:1px solid rgba(73,60,44,.11);
  border-bottom:1px solid rgba(73,60,44,.11);
}
#portal .ptabpanel[data-tab="prog"] .mr-metric{
  padding:18px 20px 18px 0;
  border:0;
  border-right:1px solid rgba(73,60,44,.11);
  border-radius:0;
  background:transparent;
}
#portal .ptabpanel[data-tab="prog"] .mr-metric+.mr-metric{padding-left:20px}
#portal .ptabpanel[data-tab="prog"] .mr-metric:last-child{border-right:0}
#portal .ptabpanel[data-tab="prog"] .mr-metric-l{
  font-size:9px;
  letter-spacing:.12em;
}
#portal .ptabpanel[data-tab="prog"] .mr-metric-v{
  margin-top:7px;
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
  font-size:28px;
}
#portal .ptabpanel[data-tab="prog"] .mr-block{
  max-width:820px;
  margin-bottom:21px;
}
#portal .ptabpanel[data-tab="prog"] .mr-block-h{
  font-size:9.5px;
  letter-spacing:.16em;
}
#portal .ptabpanel[data-tab="prog"] .mr-meaning{
  font-family:Georgia,'Times New Roman',serif;
  font-size:19px;
  line-height:1.62;
  color:#302a23;
}
#portal .ptabpanel[data-tab="prog"] .mr-list li{
  margin-bottom:7px;
  color:#625a51;
  line-height:1.6;
}
#portal .ptabpanel[data-tab="prog"] .mr-message{
  max-width:820px;
  margin-top:10px;
  padding:20px 22px 20px 24px;
  border:0;
  border-left:2px solid #a7793b;
  border-radius:0;
  background:rgba(163,116,55,.055);
  font-family:Georgia,'Times New Roman',serif;
  font-size:18px;
  line-height:1.65;
  color:#393129;
}

/* ── Progress data surface ─────────────────────────────────────────────── */
#portal .ptabpanel[data-tab="prog"] #progressCard{
  padding:30px 32px 34px;
  border:1px solid rgba(72,60,44,.11);
  border-radius:22px;
  background:rgba(249,247,241,.93);
  box-shadow:0 28px 72px -56px rgba(47,34,21,.40);
}
#portal .ptabpanel[data-tab="prog"] #progressCard>.card-head{
  margin-bottom:24px;
  padding-bottom:18px;
  border-bottom:1px solid rgba(73,60,44,.11);
}
#portal .ptabpanel[data-tab="prog"] #progressCard>.card-head h3,
#portal .ptabpanel[data-tab="prog"] #photosCard>.card-head h3{
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
  font-size:28px;
  letter-spacing:-.01em;
  text-transform:none;
  color:#2c2721;
}
#portal .ptabpanel[data-tab="prog"] #progressCard>.card-head .tag,
#portal .ptabpanel[data-tab="prog"] #photosCard>.card-head .tag{
  border:0;
  background:transparent;
  padding:0;
  font-size:9.5px;
  letter-spacing:.12em;
  color:#988d80;
}
#portal .ptabpanel[data-tab="prog"] .pv-summary{
  margin-bottom:30px;
  padding:0 0 26px;
  border:0;
  border-bottom:1px solid rgba(73,60,44,.11);
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
#portal .ptabpanel[data-tab="prog"] .pv-head h4{
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
  font-size:22px;
  text-transform:none;
}
#portal .ptabpanel[data-tab="prog"] .pv-tiles{
  grid-template-columns:repeat(auto-fit,minmax(155px,1fr));
  gap:10px;
}
#portal .ptabpanel[data-tab="prog"] .pv-tile{
  min-height:108px;
  padding:17px 17px 15px;
  border-color:rgba(73,60,44,.09);
  border-radius:15px;
  background:#f2eee5;
}
#portal .ptabpanel[data-tab="prog"] .pv-tile-v{
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
  font-size:27px;
  color:#29241e;
}
#portal .ptabpanel[data-tab="prog"] .pv-insights{
  margin-top:20px;
  padding-top:17px;
}
#portal .ptabpanel[data-tab="prog"] .pv-insight{
  max-width:760px;
  padding-left:18px;
  margin-bottom:7px;
  color:#5f574e;
  line-height:1.6;
}
#portal .ptabpanel[data-tab="prog"] .progrid{
  gap:16px;
}
#portal .ptabpanel[data-tab="prog"] .metric{
  padding:21px 20px 14px;
  border-color:rgba(73,60,44,.09);
  border-radius:17px;
  background:#f5f2eb;
  box-shadow:none;
}
#portal .ptabpanel[data-tab="prog"] .metric-h b{
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
  font-size:18px;
  text-transform:none;
}
#portal .ptabpanel[data-tab="prog"] .metric-group-h{
  margin-bottom:17px;
  font-size:9.5px;
  letter-spacing:.18em;
  color:#9a6d31;
}
#portal .ptabpanel[data-tab="prog"] .chart .cg{stroke:rgba(71,59,44,.08)}
#portal .ptabpanel[data-tab="prog"] .chart .cline{stroke:#a27436;stroke-width:2.2}
#portal .ptabpanel[data-tab="prog"] .chart .cdot{fill:#a27436}

/* ── Photos as an editorial before/after gallery ───────────────────────── */
#portal .ptabpanel[data-tab="prog"] #photosCard{
  padding:30px 32px 34px;
  border:1px solid rgba(72,60,44,.11);
  border-radius:22px;
  background:rgba(249,247,241,.93);
  box-shadow:0 28px 72px -56px rgba(47,34,21,.40);
}
#portal .ptabpanel[data-tab="prog"] #photosCard>.card-head{
  margin-bottom:24px;
  padding-bottom:18px;
  border-bottom:1px solid rgba(73,60,44,.11);
}
#portal .ptabpanel[data-tab="prog"] .photos-compare{
  gap:16px;
}
#portal .ptabpanel[data-tab="prog"] .photos-compare figure{
  position:relative;
  border:0;
  border-radius:18px;
  overflow:hidden;
  background:#e8e1d5;
  box-shadow:0 20px 50px -40px rgba(40,29,18,.45);
}
#portal .ptabpanel[data-tab="prog"] .photos-compare img{
  aspect-ratio:4/5;
  filter:saturate(.9) contrast(1.01);
}
#portal .ptabpanel[data-tab="prog"] .photos-compare figcaption{
  padding:12px 14px;
  background:#f0ebe2;
  font-size:9px;
  letter-spacing:.13em;
  color:#776e64;
}
#portal .ptabpanel[data-tab="prog"] .pgrid{
  grid-template-columns:repeat(auto-fill,minmax(112px,1fr));
  gap:10px;
}
#portal .ptabpanel[data-tab="prog"] .pthumb{
  border:0;
  border-radius:13px;
  box-shadow:0 14px 34px -28px rgba(40,29,18,.42);
}
#portal .ptabpanel[data-tab="prog"] #ph_file{
  background:#f2eee5!important;
  border-color:rgba(73,60,44,.10)!important;
  border-radius:12px!important;
}
#portal .ptabpanel[data-tab="prog"] #phBtn{
  width:auto;
  justify-self:start;
  border-radius:999px;
  padding:11px 18px;
}

@media(min-width:1100px){
  #portal .ptabpanel[data-tab="prog"]{
    width:min(1180px,calc(100vw - 40px));
    margin-left:50%;
    transform:translateX(-50%);
  }
}

@media(max-width:820px){
  #portal .progress-lead{
    min-height:250px;
    padding:30px 22px 28px;
    border-radius:21px;
  }
  #portal .progress-lead::before{background-position:58% 50%}
  #portal .progress-lead::after{background:linear-gradient(0deg,rgba(23,20,16,.93),rgba(23,20,16,.63) 64%,rgba(23,20,16,.28))}
  #portal .progress-lead h2{font-size:clamp(46px,13vw,68px)}
  #portal .progress-lead p{font-size:14px}
  #portal .ptabpanel[data-tab="prog"] #lifecycleCard,
  #portal .ptabpanel[data-tab="prog"] #monthlyReviewCard,
  #portal .ptabpanel[data-tab="prog"] #progressCard,
  #portal .ptabpanel[data-tab="prog"] #photosCard{
    padding:22px 20px;
    border-radius:18px;
  }
  #portal .ptabpanel[data-tab="prog"] .lc-ev-item,
  #portal .ptabpanel[data-tab="prog"] .lc-ev-item+.lc-ev-item{
    padding:14px 10px;
  }
  #portal .ptabpanel[data-tab="prog"] .mr-metric,
  #portal .ptabpanel[data-tab="prog"] .mr-metric+.mr-metric{
    padding:14px 10px;
  }
  #portal .ptabpanel[data-tab="prog"] .photos-compare{gap:9px}
}