.experience { min-height: 100svh; display: flex; flex-direction: column; justify-content: center; padding: 96px max(6.4vw,36px); color: #fff; background: #161616; overflow: hidden; }
.experience h2 { position: relative; z-index: 2; margin: 0; font: 700 clamp(42px,4.4vw,68px)/1.3 "Noto Sans SC", sans-serif; }
.experience-orbit { position: absolute; z-index: 0; top: -40px; left: 50%; display: block; width: min(43.35vw, 829.6px); height: auto; object-fit: contain; transform: translateX(-55%); opacity: .94; pointer-events: none; }
.experience-grid { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 25px; margin-top: clamp(40px, 8svh, 100px); }
.experience-card { min-height: 405px; padding: 48px; border: 1px solid rgba(255,255,255,.13); border-radius: 41px; background: rgba(255,255,255,.06); box-shadow: inset 0 4px 10px rgba(255,255,255,.25); backdrop-filter: blur(16px); }
.experience-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.company-mark { display: grid; flex: 0 0 68px; width: 68px; height: 68px; place-items: center; overflow: hidden; border-radius: 12px; background: rgba(255,255,255,.11); }
.company-mark img { max-width: 62%; max-height: 62%; object-fit: contain; }
.skill-tags { display: flex; flex: 1; justify-content: flex-end; flex-wrap: wrap; gap: 8px; }
.skill-tags span { padding: 4px 13px; border: .6px solid rgba(255,255,255,.8); border-radius: 99px; background: rgba(0,0,0,.28); color: #fff; font-size: 12px; white-space: nowrap; }
.years { margin: 34px 0 10px; color: var(--lime); font-size: 18px; font-weight: 600; }.years i { padding: 0 6px; font-style: normal; }
.experience-card h3 { margin: 0; font-size: clamp(21px,2vw,28px); }.experience-card .role { display: inline-block; margin: 14px 0 12px; padding: 5px 16px; border: .6px solid #359a38; border-radius: 99px; background: rgba(104,196,107,.14); color: var(--lime); font-size: 13px; }
.experience-card ul { margin: 0; padding-left: 20px; color: rgba(255,255,255,.68); font-size: 17px; line-height: 1.75; }
@media (max-width: 800px) { .experience { min-height: auto; padding: 90px 24px; }.experience-orbit { top: 5px; width: 578px; transform: translateX(-55%); opacity: .42; }.experience-grid { grid-template-columns: 1fr; margin-top: 80px; }.experience-card { min-height: 0; padding: 28px; border-radius: 28px; }.experience-top { display: block; }.skill-tags { justify-content: flex-start; margin-top: 18px; }.experience-card ul { font-size: 15px; } }
