/* 技术筑基 助力职业发展 f2_tech_base */
.f2-tech-base {margin-top: clamp(53px, calc(53 / 1440 * 100vw), 70px);}
.f2-tech-base .f2-tech-title {margin-bottom: clamp(18px, calc(24 / 1440 * 100vw), 30px);}
.f2-tech-base .f2-tech-title h3 {margin: 0; font-size: clamp(27px, calc(27 / 1440 * 100vw), 36px); font-weight: 400; color: #333;}
.f2-tech-loading {display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 54px; color: #7a7f90; font-size: clamp(13px, calc(13 / 1440 * 100vw), 16px);}
.f2-tech-loading::before {content: ""; width: 14px; height: 14px; border-radius: 50%; border: 2px solid #d8ddf0; border-top-color: #4f35e2; animation: f2-tech-spin 0.8s linear infinite;}
.f2-tech-empty {display: flex; align-items: center; justify-content: center; min-height: 120px; border: 1px dashed #e3e7f2; border-radius: 8px; color: #8e95aa; font-size: clamp(13px, calc(13 / 1440 * 100vw), 16px);}
.f2-tech-tabs {display: flex; justify-content: center; flex-wrap: wrap; gap: 14px; margin-bottom: 20px;}
.f2-tech-tab {border: 0; border-radius: 999px; padding: 11px 34px; background: #ededed; color: #50515a; font-size: 15px; line-height: 1; cursor: pointer; transition: all 0.25s ease;}
.f2-tech-tab:hover {background: #e2e2e2;}
.f2-tech-tab.active {background: linear-gradient(90deg, #3623ce 0%, #4f35e2 100%); box-shadow: 0 8px 16px rgba(56, 38, 204, 0.22); color: #fff;}
.f2-tech-content {margin-bottom: clamp(53px, calc(53 / 1440 * 100vw), 70px);}
.f2-tech-panel {display: none; --f2-tab-soft: #F5F6FF; --f2-tab-accent: #7AA0FF;}
.f2-tech-panel.active {display: block;}
.f2-tech-panel:nth-child(2) {--f2-tab-soft: #FFF5F5; --f2-tab-accent: #FF7A7C;}
.f2-tech-panel:nth-child(3) {--f2-tab-soft: #F5FBFF; --f2-tab-accent: #4EA2DE;}
.f2-tech-panel:nth-child(4) {--f2-tab-soft: #F5F6FF; --f2-tab-accent: #A785E3;}
.f2-tech-card {background: #fff; border: 1px solid #ebedf2; border-radius: 8px; box-shadow: 0 6px 16px rgba(16, 24, 40, 0.06); padding: 18px 20px 14px;}
.f2-tech-grid {display: grid; grid-template-columns: clamp(210px, calc(210 / 1440 * 100vw), 280px) 1fr; gap: clamp(15px, calc(15 / 1440 * 100vw), 20px);}
.f2-tech-left {padding-top: 4px; width: 100%; height: clamp(218px, calc(218 / 1440 * 100vw), 290px);}
.f2-tech-left-img {display: block; width: 100%; height: 100%; border-radius: 10px; object-fit: cover;}
.f2-tech-head {margin: 0 0 10px; font-size: clamp(14px, calc(14 / 1440 * 100vw), 18px); color: #2f3342; font-weight: 700;}
.f2-tech-main {display: flex; min-width: 0;}
.f2-tech-col {min-width: 0;}
.f2-tech-col-course {width: clamp(204px, calc(204 / 1440 * 100vw), 275px); flex: 0 0 clamp(204px, calc(204 / 1440 * 100vw), 275px); padding-right: clamp(8px, calc(8 / 1440 * 100vw), 11px);}
.f2-tech-col-schedule {width: clamp(199px, calc(199 / 1440 * 100vw), 265px); flex: 0 0 clamp(199px, calc(199 / 1440 * 100vw), 265px); padding-left: clamp(12px, calc(12 / 1440 * 100vw), 18px); padding-right: clamp(12px, calc(12 / 1440 * 100vw), 18px); border-left: 1px solid #EBF1FF; border-right: 1px solid #EBF1FF;}
.f2-tech-col-faq {flex: 1 1 auto; padding-left: clamp(15px, calc(15 / 1440 * 100vw), 20px);}
.f2-tech-col li {font-size: clamp(11px, calc(11 / 1440 * 100vw), 14px);}
.f2-tech-courses, .f2-tech-schedule, .f2-tech-faq {margin: 0; padding: 0; list-style: none;}
.f2-tech-courses li {display: flex; align-items: center; gap: 7px; margin-bottom: clamp(20px, calc(20 / 1440 * 100vw), 27px); line-height: 1.4;}
.f2-tech-courses li:last-child {margin-bottom: 0;}
.f2-tech-num {width: clamp(14px, calc(14 / 1440 * 100vw), 18px); height: clamp(14px, calc(14 / 1440 * 100vw), 18px); border-radius: 50%; background: var(--f2-tab-accent); color: #fff; font-size: clamp(8px, calc(8 / 1440 * 100vw), 11px); font-weight: 700; line-height: clamp(14px, calc(14 / 1440 * 100vw), 18px); text-align: center; flex-shrink: 0;}
.f2-tech-course-text {color: #666;}
.f2-tech-courses li:hover .f2-tech-course-text {color: #4b34dd;}
.f2-tech-highlight {display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.f2-tech-schedule li {display: grid; grid-template-columns: 2fr 4fr 4fr; align-items: center; column-gap: 8px; line-height: 1.6; color: #616779; margin-bottom: clamp(20px, calc(20 / 1440 * 100vw), 27px); white-space: nowrap;}
.f2-tech-schedule-city, .f2-tech-schedule-date {overflow: hidden; text-overflow: ellipsis;}
.f2-tech-schedule-badge-wrap {display: flex; align-items: center; justify-content: flex-end; min-width: 0; position: relative;}
.f2-tech-faq li {line-height: 1.6; color: #666; white-space: nowrap; display: flex; align-items: center; gap: 6px; padding: 0 6px; border-radius: 6px; transition: color 0.2s ease, background-color 0.2s ease;}
.f2-tech-faq li {margin-bottom: clamp(12px, calc(12 / 1440 * 100vw), 16px);}
.f2-tech-faq li::before {content: "•"; color: currentColor; flex-shrink: 0;}
.f2-tech-badge {display: inline-flex; align-items: center; justify-content: center; gap: clamp(3px, calc(3 / 1440 * 100vw), 5px); width: clamp(53px, calc(53 / 1440 * 100vw), 70px); height: clamp(19px, calc(19 / 1440 * 100vw), 25px); margin-left: 0; padding: 0; line-height: 1; border-radius: 20px; background: #ebedf1; color: #6c7285;}
.f2-tech-badge:hover {background: #ffe7c7; color: #ff9800; transition: background-color 0.2s ease, color 0.2s ease;}
.f2-tech-schedule-badge-wrap.has-fire::before {content: ""; position: absolute; right: clamp(52px, calc(52 / 1440 * 100vw), 74px); top: 50%; transform: translateY(-50%); width: clamp(12px, calc(12 / 1440 * 100vw), 16px); height: clamp(12px, calc(12 / 1440 * 100vw), 16px); background: url("../../skin/images/huo.png") center / contain no-repeat;}
.f2-tech-faq li:hover {background-color: var(--f2-tab-soft); color: var(--f2-tab-accent);}
.f2-tech-features {display: grid; grid-template-columns: clamp(210px, calc(210 / 1440 * 100vw), 280px) 1fr; gap: clamp(15px, calc(15 / 1440 * 100vw), 20px); align-items: stretch; padding-top: 10px; margin-top: 8px;}
.f2-tech-features-col {display: flex; flex-wrap: wrap; gap: 8px 12px; height: 100%;}
.f2-tech-features-col:first-child {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(8px, calc(8 / 1440 * 100vw), 12px);}
.f2-tech-features-col:first-child .f2-tech-feature {width: 100%; justify-content: center;}
.f2-tech-features-col:first-child .f2-tech-feature.is-fixed {flex-direction: column; gap: 6px; padding: 10px 4px; border-radius: 8px; min-height: clamp(70px, calc(70 / 1440 * 100vw), 94px);}
.f2-tech-features-col:first-child .f2-tech-feature.is-fixed span {white-space: nowrap; line-height: 1.2;}
.f2-tech-features-col:first-child .f2-tech-feature-img {width: clamp(18px, calc(18 / 1440 * 100vw), 22px); height: clamp(18px, calc(18 / 1440 * 100vw), 22px);}
.f2-tech-features-col:last-child {display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px 12px; align-content: center; --f2-feature-bg: var(--f2-tab-soft); --f2-feature-color: var(--f2-tab-accent); background-color: var(--f2-feature-bg); color: var(--f2-feature-color);}
.f2-tech-features-col:last-child .f2-tech-feature {width: 100%; justify-content: center; padding: 6px 8px; border-radius: 8px; background-color: inherit; color: inherit;}
.f2-tech-features-col:last-child .f2-tech-feature-icon {color: currentColor;}
.f2-tech-feature {display: inline-flex; align-items: center; gap: 6px; color: #616779; font-size: clamp(11px, calc(11 / 1440 * 100vw), 14px); padding: 2px 0;}
.f2-tech-feature-icon {display: inline-flex; align-items: center; justify-content: center; width: clamp(18px, calc(18 / 1440 * 100vw), 24px); height: clamp(18px, calc(18 / 1440 * 100vw), 24px); border-radius: 50%; background-color: var(--f2-tab-accent); color: #fff; font-size: clamp(10px, calc(10 / 1440 * 100vw), 13px); line-height: 1; flex-shrink: 0;}
.f2-tech-feature-icon::before {content: "✓"; color: #fff; font-size: clamp(10px, calc(10 / 1440 * 100vw), 13px); font-weight: 700; line-height: 1;}
.f2-tech-feature.is-fixed {gap: 5px; padding: 4px 10px; border-radius: 999px; color: #60677a;}
.f2-tech-feature-img {display: block; width: 14px; height: 14px;}
@media (max-width: 1280px) {.f2-tech-grid {grid-template-columns: clamp(210px, calc(210 / 1440 * 100vw), 280px) 1fr;} .f2-tech-features {grid-template-columns: clamp(210px, calc(210 / 1440 * 100vw), 280px) 1fr;}}
@media (max-width: 992px) {.f2-tech-grid {grid-template-columns: 1fr;} .f2-tech-card {padding: 16px;} .f2-tech-main {display: block;} .f2-tech-col-course, .f2-tech-col-schedule, .f2-tech-col-faq {width: auto; flex: 0 0 auto; padding: 0;} .f2-tech-col-schedule {border-left: 0; border-right: 0;} .f2-tech-col + .f2-tech-col {border-top: 1px solid #EBF1FF; padding-top: 12px; margin-top: 12px;} .f2-tech-features {grid-template-columns: 1fr;} .f2-tech-schedule li, .f2-tech-faq li {white-space: normal;} .f2-tech-left, .f2-tech-main {max-width: 560px;} .f2-tech-left {height: clamp(180px, calc(220 / 992 * 100vw), 260px);}}
@media (max-width: 640px) {.f2-tech-base {margin-top: 36px;} .f2-tech-tabs {justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 6px; gap: 10px;} .f2-tech-tab {flex: 0 0 auto; white-space: nowrap; padding: 10px 22px; font-size: 14px;} .f2-tech-card {padding: 12px;} .f2-tech-left, .f2-tech-main {max-width: 100%;} .f2-tech-left {height: 180px;} .f2-tech-col + .f2-tech-col {padding-top: 10px; margin-top: 10px;} .f2-tech-schedule li {grid-template-columns: 1fr auto; grid-template-areas: "city badge" "date badge"; row-gap: 4px; margin-bottom: 12px;} .f2-tech-schedule-city {grid-area: city;} .f2-tech-schedule-date {grid-area: date;} .f2-tech-schedule-badge-wrap {grid-area: badge; align-self: center;} .f2-tech-features {grid-template-columns: 1fr; gap: 10px;} .f2-tech-features-col:first-child {grid-template-columns: repeat(2, minmax(0, 1fr));} .f2-tech-features-col:last-child {grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 10px;} .f2-tech-feature {font-size: 12px;}}
@keyframes f2-tech-spin {to {transform: rotate(360deg);}}