/* ============================================================
   PERSONA INDIVIDUAL — Trainologym
   Clon Figma node 117-696 (PERSONA INDIV. DESKTOP, 1440)
   Depende de styles.css (tokens, nav, footer, btn-circle, overline)
   ============================================================ */

.persona{background:var(--tgy-bg);}

/* ---------- opacidades de texto ---------- */
.persona .o100{color:#fff}
.persona .o60{color:rgba(255,255,255,.6)}
.persona .o40{color:rgba(255,255,255,.2)}

/* ============ HEADING POST (hero) ============ */
.p-hero{
  display:flex;align-items:stretch;
  min-height:675px;
  background:var(--tgy-bg);
  padding-top:0;
}
.p-hero__content{
  position:relative;
  flex:0 0 49.305%;          /* 710 / 1440 */
  max-width:49.305%;
  background:var(--tgy-rojo);
  display:flex;flex-direction:column;justify-content:flex-start;
  overflow:hidden;
}
.p-hero__heading{
  margin-left:7.08%;          /* 102/1440 */
  margin-top:181px;
  max-width:535px;
  display:flex;flex-direction:column;gap:25px;
  letter-spacing:.5px;
}
.p-hero__name{
  font-family:var(--tgy-font-display);font-weight:400;
  font-size:64px;line-height:67px;color:#fff;text-transform:uppercase;
  margin:0;word-break:break-word;
}
.p-hero__role{
  font-family:var(--tgy-font-body);font-weight:700;
  font-size:27px;line-height:24px;color:rgba(255,255,255,.99);margin:0;
}
.p-hero__bio{
  font-family:var(--tgy-font-body);font-weight:400;
  font-size:20px;line-height:24px;color:rgba(255,255,255,.99);margin:0;
}
.p-hero__social{
  margin-left:7.08%;margin-top:48px;
  display:flex;align-items:center;gap:20px;
}
.p-hero__social a{
  display:inline-flex;align-items:center;justify-content:center;
  color:#fff;transition:opacity .2s ease;
}
.p-hero__social a:hover{opacity:.8}
.p-hero__social svg{width:34px;height:34px;display:block}
.p-hero__social a:last-child svg{width:36px;height:36px}

.p-hero__img{
  flex:1 1 auto;
  position:relative;overflow:hidden;
}
.p-hero__img img{
  position:absolute;inset:0;
  width:100%;height:100%;object-fit:cover;object-position:center 25%;
  display:block;
}

/* ============ SOBRE REBECA ============ */
.p-about{padding:100px 0;background:var(--tgy-bg)}
.p-about__inner{
  width:100%;max-width:1330px;margin-inline:auto;padding-inline:105px;
  display:grid;grid-template-columns:301px 1fr;column-gap:0;align-items:start;
}
.p-about__overline{margin:0;font-size:20px}
.p-about__overline span:last-child{
  font-family:var(--tgy-font-body);font-weight:500;font-size:20px;color:#fff;
}
.p-about__text{
  font-family:var(--tgy-font-body);font-weight:400;
  font-size:38px;line-height:1.1;letter-spacing:0;margin:0;max-width:928px;
}

/* ============ TIMELINE ============ */
.p-timeline{background:var(--tgy-bg);padding:190px 0 60px}
.p-timeline__inner{
  position:relative;
  width:100%;max-width:1330px;margin-inline:auto;padding-inline:88px;
}
.p-timeline__track{
  position:relative;
  display:flex;justify-content:space-between;align-items:flex-end;
}
/* línea horizontal que cruza por el centro de los nodos */
.p-timeline__line{
  position:absolute;left:117px;right:88px;bottom:32px;       /* alineado al centro del nodo (64/2) */
  height:1px;background:rgba(255,255,255,.35);z-index:0;
}
.p-tl-item{
  position:relative;z-index:1;
  display:flex;flex-direction:column;align-items:center;
}
.p-tl-year{
  font-family:var(--tgy-font-body);font-weight:600;
  font-size:32px;line-height:1;color:#fff;margin:0 0 13px;letter-spacing:.3px;
  transition:opacity .2s ease;
}
/* nodo: círculo con anillo blanco + relleno gradiente rojo */
.p-tl-node{
  width:64px;height:64px;border-radius:50%;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.18);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.p-tl-node::before{
  content:"";width:18px;height:18px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #ec5b31 0%, #b31a23 45%, #641219 100%);
  box-shadow:0 0 0 3px #fff;
}
/* tarjeta: flota sobre el nodo; oculta por defecto, se revela al hover o en .is-open */
.p-tl-card{
  position:absolute;left:50%;bottom:104px;transform:translate(-50%,8px);
  width:208px;
  background:#f2f4f8;
  border:0;
  border-radius:15px;
  padding:20px;
  box-shadow:0 18px 40px rgba(0,0,0,.35);
  opacity:0;visibility:hidden;pointer-events:none;z-index:3;
  transition:opacity .25s ease,transform .25s ease,visibility .25s ease;
}
.p-tl-item:hover .p-tl-card,
.p-tl-item.is-open .p-tl-card{opacity:1;visibility:visible;transform:translate(-50%,0)}
.p-tl-card__year{
  font-family:var(--tgy-font-body);font-weight:600;
  font-size:24px;line-height:1.3;color:#000;margin:0 0 11px;
}
.p-tl-card__text{
  font-family:var(--tgy-font-body);font-weight:400;
  font-size:16px;line-height:1.6;color:#45464d;margin:0;
  display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;
}

/* ============ CURSOS QUE IMPARTE ============ */
.p-courses{background:var(--tgy-bg);padding:100px 0 120px}
.p-courses__inner{
  width:100%;max-width:1330px;margin-inline:auto;padding-inline:105px;
}
.p-courses__overline{margin:0 0 54px;font-size:20px}
.p-courses__overline span:last-child{
  font-family:var(--tgy-font-body);font-weight:500;font-size:20px;color:#fff;
}
.p-courses__track{display:flex;gap:24px;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;
  overscroll-behavior-x:contain;padding-bottom:8px;scroll-snap-type:x proximity;
  scrollbar-width:none;-ms-overflow-style:none}
.p-courses__track::-webkit-scrollbar{display:none}
.p-courses__track > .course-card{flex:0 0 auto;scroll-snap-align:start}

/* ---- Cards "cursos que imparte": REUTILIZAN .course-card de la home
   (mismo hover ROJO + estado .is-active). Solo se ajusta la geometría:
   más bajas (440px), sin fila meta y con notch + CTA en la esquina
   INFERIOR-IZQUIERDA (en la home el notch va abajo-derecha). ---- */
.course-card--person{height:440px}
.course-card--person .course-card__inner{
  padding:13px 13px 0;
  /* notch circular abajo-izquierda para el botón CTA */
  clip-path:path('M267.389 0C278.434 0 287.389 8.95431 287.389 20V420C287.389 431.046 278.434 440 267.389 440H150.5C139.454 440 130.5 431.046 130.5 420V414C130.5 401.85 120.65 392 108.5 392H20C8.95431 392 0 383.046 0 372V20C0 8.95431 8.95431 0 20 0H267.389Z');
}
.course-card--person .course-card__img{
  width:257px;height:168px;margin:0 auto;
}
.course-card--person .course-card__title{
  font-size:20px;line-height:24px;letter-spacing:.5px;margin:21px 8px 0;
}
.course-card--person .course-card__desc{
  font-size:20px;line-height:1.3;margin:15px 8px 0;
}
/* CTA reposicionado a la esquina inferior-izquierda */
.course-card--person .course-card__cta{
  left:auto;right:35px;bottom:0;gap:75px;
}
.course-card--person .course-card__cta .btn-circle{width:46px;height:46px}
.course-card--person .course-card__cta-label{margin-left:0}

/* ============ RESPONSIVE ≤991.98px → 1 columna ============ */
@media (max-width:991.98px){
  .p-hero{flex-direction:column;min-height:0}
  /* Móvil: la imagen va primero y el contenido (rojo) después */
  .p-hero__img{order:1}
  .p-hero__content{order:2;flex:1 1 auto;max-width:100%;padding-bottom:48px}
  .p-hero__heading{margin:120px 24px 0;max-width:none}
  .p-hero__name{font-size:48px;line-height:1.05}
  .p-hero__role{font-size:24px}
  .p-hero__social{margin:32px 24px 0}
  .p-hero__img{width:100%;height:420px;flex:0 0 auto}
  .p-hero__img img{position:relative}

  .p-about{padding:60px 0}
  .p-about__inner{grid-template-columns:1fr;row-gap:24px;padding-inline:24px}
  .p-about__text{font-size:26px;line-height:1.2;max-width:none}

  .p-timeline__inner{padding-inline:24px;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}
  .p-timeline__inner::-webkit-scrollbar{width:0;height:0;display:none}
  .p-timeline__track{gap:48px;justify-content:flex-start;min-width:760px}
  .p-timeline__line{left:24px;right:24px}

  .p-courses{padding:60px 0 80px}
  .p-courses__inner{padding-inline:24px}
  .p-courses__track{justify-content:center}
}

@media (max-width:575.98px){
  .p-hero__name{font-size:40px}
}
