/* Body copy in a warmer editorial serif. Condensed display type, mono
   eyebrows, numbers and CTAs stay exactly as they are site-wide. */
/* anything the site sets in display or mono keeps it: statements stay
   condensed, labels and technical lines stay mono */

/* Photography sits on paper, so it gets a softer, warmer frame */
/* =====================================================================
   Mentorship page. Loaded after styles.css. Adds only page-specific
   components; nothing in the shared stylesheet is overridden.
   ===================================================================== */

/* Hero: bigger, more cinematic working-session image */
.mentor-hero{grid-template-columns:1fr 1.05fr; gap:64px; padding:64px 0 96px;}
.mentor-hero img{height:720px; filter:none; object-position:center 42%;}
@media (max-width:900px){
  .mentor-hero{grid-template-columns:1fr; gap:30px; padding:36px 0 56px;}
  .mentor-hero img{height:440px;}
}

/* What we'd work on */
.problem-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:0;
  border-top:1px solid var(--line); border-left:1px solid var(--line);
}
.problem{
  padding:34px 32px 38px; border-right:1px solid var(--line); border-bottom:1px solid var(--line);
  transition:background .25s ease;
}
.problem:hover{background:rgba(125,92,255,.045);}
.problem .p-num{
  font-family:var(--mono); font-size:11.5px; letter-spacing:.14em; color:var(--violet-bright);
  display:block; margin-bottom:18px;
}
.problem h3{font-size:clamp(22px,2.4vw,29px); line-height:1.02; margin-bottom:14px;}
.problem p{
  font-size:14.5px; color:var(--ink-dim); line-height:1.6;
}
@media (max-width:900px){
  .problem-grid{grid-template-columns:1fr;}
}

/* Qualify */
.qualify{
  display:grid; grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr); gap:64px; align-items:start;
  padding-top:14px;
}
.qualify h2{font-size:clamp(26px,3vw,38px); line-height:1;}
.qualify > div:first-child{padding-right:10px; border-right:1px solid var(--line);}
.qualify p{font-size:15px;}
.qualify .fit-list{list-style:none; margin-top:28px; border-top:1px solid var(--line);}
.qualify .fit-list li{
  padding:14px 0 14px 26px; border-bottom:1px solid var(--line); position:relative;
  font-size:15.5px; color:var(--ink-dim);
}
.qualify .fit-list li::before{
  content:''; position:absolute; left:0; top:22px; width:12px; height:2px; background:var(--violet-bright);
}
.requirement{
  margin-top:26px; padding:18px 20px; border-left:2px solid var(--violet-dim); background:var(--surface);
  font-family:var(--display); text-transform:uppercase; font-size:clamp(17px,1.9vw,21px);
  line-height:1.15; color:var(--ink);
}
.statement-block h3{
  font-size:clamp(30px,4.6vw,62px); line-height:.98; margin-bottom:22px; max-width:14ch;
}
.statement-block h3.accent{
  color:var(--violet-bright); margin-bottom:0; max-width:18ch;
  padding-top:22px; border-top:2px solid var(--violet-dim);
}
@media (max-width:900px){
  .qualify{grid-template-columns:1fr; gap:34px;}
}

/* The offer: one dominant block, not a package comparison */
.offer-single{
  border:1px solid var(--line); border-left:3px solid var(--violet); border-radius:2px;
  background:rgba(125,92,255,.05); padding:52px 56px 54px; max-width:980px;
  box-shadow:0 30px 80px -40px rgba(0,0,0,.8);
}
.offer-single .o-name{
  font-family:var(--display); font-weight:800; text-transform:uppercase;
  font-size:clamp(30px,4.2vw,54px); line-height:.98; color:var(--ink); margin-bottom:24px;
}
.offer-single p{font-size:17px; color:var(--ink-dim); max-width:720px;}
.feature-line{
  font-family:var(--mono); font-size:11.5px; letter-spacing:.09em; text-transform:uppercase;
  color:var(--violet-bright); line-height:1.9;
  margin:26px 0 28px; padding-top:20px; border-top:1px solid var(--line);
}
.intensive{margin-top:26px; max-width:840px;}
.intensive p{font-size:14.5px; color:var(--muted); margin-bottom:10px;}
@media (max-width:640px){
  .offer-single{padding:30px 22px 32px;}
}

/* Why me: proof metrics, same language as the case-study stat rows */
.why-stats{
  display:grid; grid-template-columns:repeat(4,1fr); gap:36px 40px; margin:36px 0 0;
}
.why-stats .n{
  font-family:var(--mono); font-size:clamp(26px,3.4vw,40px); line-height:1.1;
  color:var(--violet-bright); display:block;
}
.why-stats .l{
  font-size:12px; font-family:var(--mono); color:var(--muted);
  text-transform:uppercase; letter-spacing:.06em; display:block; margin-top:6px;
}
@media (max-width:760px){
  .why-stats{grid-template-columns:1fr 1fr; gap:28px 24px;}
}

/* Judgment proof, folded under Why me */
.judgment-block{margin-top:56px; padding-top:40px; border-top:1px solid var(--line);}
.judgment-block > h3{font-size:clamp(26px,3.4vw,46px); line-height:.98; margin-bottom:28px;}
.judgment-close{
  font-family:var(--display); text-transform:uppercase; color:var(--ink);
  font-size:clamp(18px,2vw,24px); line-height:1.15; margin:30px 0 26px; max-width:760px;
}

/* Judgment cards: miniature versions of the case-studies index cards */
.judgment-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:30px;}
.judgment{
  position:relative; overflow:hidden; display:flex; flex-direction:column; justify-content:flex-end;
  min-height:300px; border:1px solid var(--line); border-radius:3px; background:var(--surface);
  transition:transform .3s ease, border-color .3s ease;
}
.judgment:hover{transform:translateY(-4px); border-color:var(--violet);}
.judgment .j-bg{
  position:absolute; inset:0; background-size:cover; background-position:center;
  opacity:.32; transition:opacity .3s ease, transform .5s ease;
}
.judgment .j-bg.tssf-card-bg{background-position:center top;}
.judgment:hover .j-bg{opacity:.5; transform:scale(1.04);}
.judgment .j-body{
  position:relative; z-index:2; padding:26px;
  background:linear-gradient(0deg, rgba(10,9,13,.94) 30%, rgba(10,9,13,0));
}
/* the cards stay dark on the warm page: they are photography, and they
   echo the case-studies index exactly */
.judgment h3{font-size:clamp(21px,2.3vw,27px); line-height:1; margin-bottom:10px;}
.judgment p{font-size:14px; color:var(--ink-dim);}
@media (max-width:860px){
  .judgment-grid{grid-template-columns:1fr;}
  .judgment{min-height:240px;}
}

/* Mentorship callout, reused on the homepage and case studies */
.mentor-callout{
  margin:40px 0 0;
  border:1px solid var(--line); border-radius:2px; padding:26px 28px 28px; background:var(--surface);
}
.mentor-callout .eyebrow{margin-bottom:10px;}
.mentor-callout h3{font-size:clamp(20px,2.2vw,26px); line-height:1.05; margin-bottom:12px;}
.mentor-callout p{font-size:14.5px; color:var(--ink-dim); max-width:620px; margin-bottom:16px;}

/* Application: a destination, not a form at the bottom */
.apply-split{
  display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:64px; align-items:start;
}
.apply-intro{position:sticky; top:110px;}
.apply-intro p{max-width:420px;}
.apply-form{
  border:1px solid var(--line); border-radius:2px; background:var(--bg);
  padding:40px 42px 44px;
}
@media (max-width:900px){
  .apply-split{grid-template-columns:1fr; gap:30px;}
  .apply-intro{position:static;}
  .apply-form{padding:28px 22px 30px;}
}