/* Styles for the 40-minute at-home training page (matches 20min styling) */
.training-40-section .section__title{ text-align:center; margin-bottom:.4rem; font-family: var(--second-font); font-weight:800; font-size: clamp(1.8rem, 3.4vw, 3rem); letter-spacing: 1px; color: var(--title-color); -webkit-text-stroke: .4px rgba(0,0,0,0.08); }
.training-40-section .section__subtitle{ text-align:center; font-weight:700; margin-bottom:1rem; color:var(--text-color); font-size: clamp(1rem, 1.6vw, 1.25rem); }

.start-over{ display:inline-flex; margin:0 auto; padding:.6rem .95rem; border-radius:10px; background: transparent; color:var(--title-color); border:2px solid rgba(255,255,255,0.04); font-weight:700; }
.start-over:hover{ transform: translateY(-3px); box-shadow: 0 14px 36px rgba(0,0,0,0.12); }

.info-box{ background: hsl(79, 72%, 55%); border-radius:14px; padding:1.25rem 1.5rem; display:block; margin:0.75rem auto 1.25rem auto; text-align:center; max-width: 820px; width: 100%; box-shadow: 0 12px 30px rgba(18,83,36,0.06); }
.info-box__title{ font-weight:900; color:#1a1a1a; font-family: var(--second-font); font-size:1.05rem; letter-spacing:.6px; }
.info-box__meta{ color:#333333; margin-top:6px; font-size: .98rem; }

.programs__wrap{ display:grid; grid-template-columns: repeat(3, 1fr); gap:1rem; margin-top:1rem; align-items:stretch; }

.program-card{ background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.006)); border:1px solid rgba(255,255,255,0.03); border-radius:12px; padding:1.2rem; text-align:center; transition: transform .18s ease, box-shadow .18s ease; display:flex; flex-direction:column; justify-content:center; gap:.6rem; cursor:pointer; }
.program-card:hover{ transform: translateY(-8px); box-shadow: 0 20px 48px rgba(2,6,23,0.12); }

.program-icon{ width:56px; height:56px; border-radius:50%; display:grid; place-items:center; font-size:20px; margin:0 auto; background: linear-gradient(180deg, var(--first-color), var(--first-color-alt)); color:var(--title-color-black); }
.program-title{ font-weight:800; margin-top:.25rem; font-family: var(--second-font); font-size: 1.02rem; color: var(--title-color); letter-spacing: .3px; }
.program-count{ color:var(--text-color); font-size:.95rem; }

.programs__wrap{ align-items: stretch; grid-auto-rows: 1fr; }
.program-card{ height:100%; }

@media screen and (max-width: 1024px){
    .programs__wrap{ grid-template-columns: repeat(2, minmax(260px, 1fr)); gap:1rem; justify-content:center; }
    .program-card{ max-width:480px; width:100%; }
}

@media screen and (max-width: 720px){
    .programs__wrap{ grid-template-columns: 1fr; }
    .program-icon{ width:48px; height:48px; font-size:18px; }
}