.prof-experience-timeline {
  --primary: #badff0;
  --primary-dark: #527f94;
  --primary-soft: #e9f6fb;
  --primary-pale: #f5fbfe;
  --ink: #173744;
  --muted: #647f8b;
  --line: #d5eaf3;
  --white: #fff;
  padding: clamp(18px, 3vw, 30px);
  border: 1px solid rgba(186,223,240,.72);
  border-radius: 28px;
  background: rgba(255,255,255,.96);
  box-shadow: 0 8px 24px rgba(82,127,148,.12);
}
.prof-experience-timeline .event-title { margin: 0; color: var(--ink); font-size: 14px; line-height: 1.7; font-weight: 800; }
.prof-experience-timeline .event-org { display: block; margin-top: 2px; color: var(--primary-dark); font-size: 11px; font-weight: 700; }
.prof-experience-timeline .event-text { margin: 7px 0 0; color: var(--muted); font-size: 11px; line-height: 1.95; }
.prof-experience-timeline .event-date { display: inline-flex; align-items: center; gap: 5px; margin-bottom: 7px; padding: 4px 8px; color: var(--primary-dark); border-radius: 999px; background: var(--primary-soft); font-size: 9px; font-weight: 700; }

/* Source design 01 — classic vertical. */
.prof-experience-timeline .t01 { position: relative; padding-right: 31px; }
.prof-experience-timeline .t01::before { content:""; position:absolute; top:8px; right:9px; bottom:8px; width:2px; background:var(--line); }
.prof-experience-timeline .t01-item { position:relative; margin-bottom:24px; padding:15px 16px; border:1px solid var(--line); border-radius:16px; background:var(--white); }
.prof-experience-timeline .t01-item:last-child { margin-bottom:0; }
.prof-experience-timeline .t01-item::before { content:""; position:absolute; right:-29px; top:50%; width:14px; height:14px; border:4px solid var(--white); border-radius:50%; background:var(--primary); box-shadow:0 0 0 2px var(--primary); transform:translateY(-50%); }

/* Source design 02 — alternating. */
.prof-experience-timeline .t02 { position:relative; padding:8px 0; }
.prof-experience-timeline .t02::before { content:""; position:absolute; inset:0 50% 0 auto; width:3px; transform:translateX(50%); border-radius:99px; background:linear-gradient(var(--primary),var(--line)); }
.prof-experience-timeline .t02-item { position:relative; width:calc(50% - 22px); margin-bottom:20px; padding:14px; border-radius:16px; background:var(--primary-pale); }
.prof-experience-timeline .t02-item:nth-child(odd) { margin-left:auto; }
.prof-experience-timeline .t02-item:nth-child(even) { margin-right:auto; }
.prof-experience-timeline .t02-item::after { content:""; position:absolute; top:50%; width:15px; height:15px; border:4px solid var(--white); border-radius:50%; background:var(--primary); box-shadow:0 0 0 2px var(--primary); transform:translateY(-50%); }
.prof-experience-timeline .t02-item:nth-child(odd)::after { left:-30px; }
.prof-experience-timeline .t02-item:nth-child(even)::after { right:-30px; }

/* Source design 03 — icon rail. */
.prof-experience-timeline .t03-item { display:grid; grid-template-columns:54px 1fr; gap:13px; align-items:stretch; margin-bottom:12px; }
.prof-experience-timeline .t03-icon { position:relative; display:grid; place-items:center; min-height:90px; color:var(--ink); border-radius:15px; background:var(--primary); font-size:19px; }
.prof-experience-timeline .t03-icon::after { content:""; position:absolute; top:calc(100% + 2px); right:50%; width:2px; height:12px; transform:translateX(50%); background:var(--line); }
.prof-experience-timeline .t03-item:last-child .t03-icon::after { display:none; }
.prof-experience-timeline .t03-body { padding:13px 15px; border:1px solid var(--line); border-radius:15px; background:var(--white); }

/* Source design 05 — horizontal. */
.prof-experience-timeline .t05-scroll { overflow-x:auto; padding:10px 2px 16px; }
.prof-experience-timeline .t05 { min-width:760px; display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); position:relative; gap:14px; padding-top:28px; }
.prof-experience-timeline .t05::before { content:""; position:absolute; top:11px; right:0; left:0; height:3px; border-radius:99px; background:var(--line); }
.prof-experience-timeline .t05-item { position:relative; padding:16px 14px; border-radius:17px; background:var(--primary-pale); }
.prof-experience-timeline .t05-item::before { content:""; position:absolute; top:-24px; right:50%; width:15px; height:15px; transform:translateX(50%); border:4px solid var(--white); border-radius:50%; background:var(--primary); box-shadow:0 0 0 2px var(--primary); }

/* Source design 06 — soft wave. */
.prof-experience-timeline .t06-item { position:relative; margin-bottom:17px; padding:17px 20px; border:1px solid var(--line); border-radius:12px 28px 12px 28px; background:linear-gradient(110deg,var(--primary-soft),#fff); }
.prof-experience-timeline .t06-item:nth-child(even) { border-radius:28px 12px 28px 12px; background:linear-gradient(250deg,var(--primary-soft),#fff); }
.prof-experience-timeline .t06-item::before { content:""; position:absolute; top:50%; right:-8px; width:16px; height:16px; transform:translateY(-50%) rotate(45deg); border-radius:3px; background:var(--primary); }

/* Source design 09 — date badges. */
.prof-experience-timeline .t09-item { display:grid; grid-template-columns:78px 1fr; gap:14px; align-items:center; margin-bottom:15px; }
.prof-experience-timeline .t09-date { position:relative; padding:10px 8px; color:var(--ink); border-radius:14px; background:var(--primary); text-align:center; }
.prof-experience-timeline .t09-date strong { display:block; font-size:17px; line-height:1.4; }
.prof-experience-timeline .t09-date span { font-size:9px; opacity:.86; }
.prof-experience-timeline .t09-date::after { content:""; position:absolute; top:50%; right:100%; border:7px solid transparent; border-right-color:var(--primary); transform:translateY(-50%) rotate(180deg); }
.prof-experience-timeline .t09-body { padding:14px 16px; border:1px solid var(--line); border-radius:14px; }

/* Source design 11 — connected bubbles. */
.prof-experience-timeline .t11 { position:relative; display:grid; gap:14px; padding-right:66px; }
.prof-experience-timeline .t11::before { content:""; position:absolute; right:26px; top:26px; bottom:26px; width:4px; border-radius:99px; background:repeating-linear-gradient(to bottom,var(--primary),var(--primary) 12px,transparent 12px,transparent 20px); }
.prof-experience-timeline .t11-item { position:relative; padding:15px 17px; border-radius:18px; background:var(--primary-pale); }
.prof-experience-timeline .t11-item::before { content:attr(data-step); position:absolute; right:-63px; top:15px; width:44px; height:44px; display:grid; place-items:center; color:var(--primary-dark); border:2px solid var(--primary); border-radius:50%; background:var(--white); font-size:11px; font-weight:900; }

/* Source design 18 — minimal editorial. */
.prof-experience-timeline .t18-item { display:grid; grid-template-columns:115px 1fr; gap:20px; padding:20px 0; border-top:1px solid var(--line); }
.prof-experience-timeline .t18-item:first-child { border-top:4px solid var(--primary); }
.prof-experience-timeline .t18-year { color:var(--primary); font-size:21px; font-weight:900; line-height:1.2; }
.prof-experience-timeline .t18-year span { display:block; margin-top:5px; color:var(--muted); font-size:9px; font-weight:600; }

/* Source design 19 — split panel. */
.prof-experience-timeline .t19 { overflow:hidden; border:1px solid var(--line); border-radius:19px; }
.prof-experience-timeline .t19-item { display:grid; grid-template-columns:120px 1fr; min-height:104px; border-bottom:1px solid var(--line); }
.prof-experience-timeline .t19-item:last-child { border-bottom:0; }
.prof-experience-timeline .t19-side { display:grid; place-items:center; padding:13px; color:var(--ink); background:var(--primary); text-align:center; font-size:12px; line-height:1.9; font-weight:800; }
.prof-experience-timeline .t19-body { padding:18px 20px; background:var(--white); }
.prof-experience-timeline .t19 .event-title { font-size:16px; }
.prof-experience-timeline .t19 .event-org,.prof-experience-timeline .t19 .event-text { font-size:12px; }

/* Source design 23 — calendar blocks. */
.prof-experience-timeline .t23-item { display:grid; grid-template-columns:68px 1fr; gap:15px; align-items:center; margin-bottom:14px; }
.prof-experience-timeline .t23-calendar { align-self:center; overflow:hidden; border:1px solid var(--line); border-radius:13px; text-align:center; background:var(--white); }
.prof-experience-timeline .t23-calendar b { display:block; padding:5px 4px; color:var(--ink); background:var(--primary); font-size:9px; }
.prof-experience-timeline .t23-calendar strong { display:block; padding:7px 4px 2px; color:var(--primary-dark); font-size:16px; line-height:1; }
.prof-experience-timeline .t23-calendar span { display:block; padding:3px 4px 7px; color:var(--muted); font-size:8px; }
.prof-experience-timeline .t23-body { min-height:96px; display:flex; flex-direction:column; justify-content:center; padding:13px 15px; border-radius:14px; background:var(--primary-pale); }

@media (max-width:680px) {
  .prof-experience-timeline { padding:16px 13px; border-radius:18px; }
  .prof-experience-timeline .t02::before { right:10px; transform:none; }
  .prof-experience-timeline .t02-item { width:auto; margin:0 30px 16px 0 !important; }
  .prof-experience-timeline .t02-item::after { right:-29px !important; left:auto !important; }
  .prof-experience-timeline .t03-item { grid-template-columns:44px 1fr; }
  .prof-experience-timeline .t18-item,.prof-experience-timeline .t19-item { grid-template-columns:1fr; gap:9px; }
  .prof-experience-timeline .t19-side { min-height:58px; }
}
