
/* ---------- 实体店门户扩展 ---------- */
.portal-hero { padding-bottom: 72px; }
.learning-visual { min-height: 390px; border-radius: 24px; background: linear-gradient(135deg, #eef1ff 0%, #f7efff 100%); border: 1px solid #e7e9f6; position: relative; display: grid; place-items: center; overflow: hidden; }
.learning-visual::before, .learning-visual::after { content:""; position:absolute; border-radius:50%; border:1px solid rgba(79,70,229,.12); }
.learning-visual::before { width:420px; height:420px; }
.learning-visual::after { width:280px; height:280px; }
.learning-board { width: 280px; padding: 28px; border-radius: 18px; background: #fff; box-shadow: 0 22px 50px rgba(79,70,229,.18); position:relative; z-index:1; }
.board-kicker { display:block; font-size:12px; color:var(--accent); letter-spacing:1px; margin-bottom:14px; }
.learning-board strong { display:block; font-size:26px; line-height:1.35; letter-spacing:-.4px; }
.learning-board strong span { color:var(--accent); }
.board-row { display:flex; justify-content:space-between; align-items:center; margin-top:24px; padding-top:16px; border-top:1px solid var(--border); color:var(--text-2); font-size:13px; }
.board-row b { color:#059669; font-size:12px; }
.visual-float { position:absolute; z-index:2; background:#fff; border:1px solid var(--border); box-shadow:0 12px 28px rgba(17,24,39,.12); padding:10px 14px; border-radius:12px; font-size:12.5px; font-weight:600; animation:floaty 5s ease-in-out infinite; }
.vf-1 { top:30px; right:12px; }.vf-2 { left:12px; bottom:74px; animation-delay:1s; }.vf-3 { right:48px; bottom:20px; animation-delay:2s; }
.center-link { text-align:center; margin-top:32px; }
.course-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.course-grid-all { grid-template-columns:repeat(3,1fr); }
.course-card { background:#fff; border:1px solid var(--border); border-radius:18px; overflow:hidden; transition:transform .25s, box-shadow .25s; display:flex; flex-direction:column; }
.course-card:hover { transform:translateY(-5px); box-shadow:0 20px 40px rgba(17,24,39,.10); }
.course-cover { min-height:132px; padding:18px; background:linear-gradient(135deg,#eef1ff,#f7efff); position:relative; display:flex; align-items:center; justify-content:center; }
.course-icon { width:52px; height:52px; border-radius:16px; display:grid; place-items:center; background:#fff; color:var(--accent); font-size:25px; box-shadow:0 10px 24px rgba(79,70,229,.14); }
.course-category,.course-level { position:absolute; top:14px; font-size:11px; padding:4px 9px; border-radius:999px; background:rgba(255,255,255,.8); color:var(--accent); }
.course-category { left:14px; }.course-level { right:14px; color:var(--text-2); }
.course-body { padding:20px; display:flex; flex-direction:column; flex:1; }.course-body h3 { font-size:18px; font-weight:700; margin-bottom:8px; }.course-body p { color:var(--text-2); font-size:13.5px; min-height:48px; }.course-meta { display:flex; flex-wrap:wrap; gap:8px 12px; color:var(--text-3); font-size:11.5px; margin:16px 0; }.course-price { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:auto; padding-top:14px; border-top:1px solid var(--border); }.course-price b { font-size:22px; color:var(--accent); }.course-price del { color:var(--text-3); font-size:12px; }.course-price .btn { padding:8px 13px; font-size:12px; }.course-actions{display:flex;align-items:center;gap:10px}.course-actions .card-link{font-size:12px;color:var(--accent)}
.detail-page{padding-top:135px}.detail-shell{background:#fff;border:1px solid var(--border);border-radius:24px;overflow:hidden}.detail-cover{height:210px;background:linear-gradient(135deg,#eef1ff,#f7efff);display:flex;align-items:center;justify-content:center;position:relative}.detail-cover .course-icon{width:82px;height:82px;font-size:38px}.detail-cover .course-category,.detail-cover .course-level{top:20px}.detail-cover .course-category{left:22px}.detail-cover .course-level{right:22px}.detail-main{padding:34px 42px;border-bottom:1px solid var(--border)}.detail-main h1{font-size:36px;margin:2px 0 10px}.detail-summary{color:var(--text-2);font-size:16px}.detail-price{display:flex;align-items:center;gap:14px;margin-top:24px}.detail-price b{font-size:30px;color:var(--accent)}.detail-price del{color:var(--text-3);font-size:13px}.detail-price .btn{margin-left:auto}.detail-facts{display:flex;gap:20px;flex-wrap:wrap;color:var(--text-3);font-size:13px;margin-top:18px}.detail-columns{display:grid;grid-template-columns:1.5fr 1fr;gap:50px;padding:36px 42px}.detail-columns h2{font-size:20px;margin-bottom:16px}.detail-columns h2:not(:first-child){margin-top:34px}.detail-list,.chapter-list{list-style:none;padding:0}.detail-list li{padding:9px 0 9px 28px;position:relative;color:var(--text-2);font-size:15px}.detail-list li:before{content:'✓';position:absolute;left:0;color:var(--accent);font-weight:700}.chapter-list{counter-reset:chapter}.chapter-list li{display:flex;align-items:center;gap:14px;padding:13px 0;border-bottom:1px dashed var(--border);font-size:14px}.chapter-list li span{width:28px;height:28px;border-radius:9px;background:rgba(79,70,229,.08);color:var(--accent);display:grid;place-items:center;font-size:11px;font-weight:700}.detail-aside{background:var(--bg-soft);border:1px solid var(--border);border-radius:18px;padding:26px;height:max-content}.detail-aside h3{font-size:18px;margin-bottom:18px}.detail-aside p{color:var(--text-2);font-size:14px;margin:10px 0}.detail-aside .btn{margin-top:18px;width:100%}
@media(max-width:640px){.detail-main,.detail-columns{padding:26px 22px}.detail-main h1{font-size:28px}.detail-price{flex-wrap:wrap}.detail-price .btn{width:100%;margin-left:0}.detail-columns{grid-template-columns:1fr;gap:28px}}
.course-filter { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-bottom:34px; }.course-filter button { border:1px solid var(--border); background:#fff; color:var(--text-2); padding:9px 17px; border-radius:999px; cursor:pointer; font:inherit; font-size:13.5px; transition:.2s; }.course-filter button:hover,.course-filter button.active { color:var(--accent); border-color:rgba(79,70,229,.35); background:rgba(79,70,229,.07); font-weight:600; }
.activity-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:20px; }.activity-card { border:1px solid var(--border); border-radius:18px; padding:28px; background:#fff; position:relative; overflow:hidden; }.activity-card::after { content:"✦"; position:absolute; right:20px; bottom:-20px; font-size:100px; color:rgba(79,70,229,.06); }.activity-tag { color:var(--accent); font-size:12px; font-weight:700; }.activity-card h3 { font-size:20px; margin:10px 0 8px; }.activity-card p { color:var(--text-2); font-size:14px; margin-bottom:18px; }.activity-card strong { color:var(--text-3); font-size:13px; }
.testimonial-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }.testimonial { background:#fff; border:1px solid var(--border); border-radius:18px; padding:26px; }.stars { color:#f59e0b; letter-spacing:2px; font-size:14px; }.testimonial p { color:var(--text-2); font-size:14.5px; margin:14px 0 20px; }.testimonial b { display:block; font-size:14px; }.testimonial small { color:var(--text-3); font-size:12px; }
.store-section { background:#fbfbfd; }.store-grid { display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center; }.store-copy h2 { font-size:clamp(28px,3.4vw,42px); line-height:1.3; margin:10px 0 18px; }.store-copy > p { color:var(--text-2); max-width:450px; }.store-facts { display:grid; gap:12px; margin:28px 0; }.store-facts div { display:flex; gap:18px; align-items:flex-start; font-size:14px; }.store-facts b { width:68px; color:var(--text); flex-shrink:0; }.store-facts span { color:var(--text-2); }.store-map { min-height:370px; border:1px solid #e3e6f4; border-radius:24px; position:relative; overflow:hidden; background-color:#eef1ff; background-image:linear-gradient(30deg,transparent 45%,rgba(255,255,255,.8) 46%,rgba(255,255,255,.8) 49%,transparent 50%),linear-gradient(120deg,transparent 44%,rgba(255,255,255,.7) 45%,rgba(255,255,255,.7) 48%,transparent 49%); background-size:130px 130px,180px 180px; display:grid; place-items:center; }.store-map .btn { position:absolute; bottom:22px; }.map-pin { width:64px; height:64px; border-radius:50% 50% 50% 0; transform:rotate(-45deg); background:var(--gradient); color:#fff; display:grid; place-items:center; font-size:26px; box-shadow:0 14px 28px rgba(79,70,229,.3); }.map-label { margin-top:26px; padding:8px 14px; border-radius:999px; background:#fff; box-shadow:0 8px 20px rgba(17,24,39,.1); font-size:13px; font-weight:600; }.map-road { position:absolute; height:12px; background:rgba(255,255,255,.9); transform:rotate(-24deg); width:140%; }.road-a { top:120px; }.road-b { bottom:108px; transform:rotate(18deg); }
.enroll-modal { position:fixed; inset:0; z-index:220; display:none; place-items:center; padding:20px; background:rgba(17,24,39,.48); }.enroll-modal.open { display:grid; }.enroll-dialog { width:100%; max-width:510px; background:#fff; border-radius:22px; padding:34px; box-shadow:0 30px 90px rgba(0,0,0,.22); position:relative; max-height:calc(100vh - 40px); overflow:auto; }.enroll-dialog h2 { font-size:25px; margin:3px 0 8px; }.modal-close { position:absolute; top:16px; right:18px; border:0; background:var(--bg-soft); color:var(--text-2); width:32px; height:32px; border-radius:50%; font-size:23px; cursor:pointer; line-height:1; }.modal-course { color:var(--text-2); font-size:14px; margin-bottom:22px; }.modal-course b { color:var(--accent); }.modal-fields { display:grid; grid-template-columns:1fr 1fr; gap:15px; margin-bottom:20px; }.modal-fields label { font-size:13px; font-weight:600; }.modal-fields label:nth-last-child(-n+2) { grid-column:1 / -1; }.modal-fields .input { margin-top:7px; display:block; }.modal-fields textarea { min-height:80px; resize:vertical; }.modal-tip { text-align:center; color:var(--text-3); font-size:12px; margin-top:16px; }
@media (max-width:1024px){.course-grid{grid-template-columns:repeat(2,1fr)}.course-grid-all{grid-template-columns:repeat(2,1fr)}.store-grid{gap:36px}.testimonial-grid{grid-template-columns:1fr 1fr}.testimonial-grid .testimonial:last-child{grid-column:1/-1}}
@media (max-width:640px){.course-grid,.course-grid-all,.activity-grid,.testimonial-grid,.store-grid{grid-template-columns:1fr}.store-grid{gap:32px}.learning-visual{min-height:320px}.learning-board{width:245px;padding:22px}.learning-board strong{font-size:22px}.visual-float{font-size:11px;padding:8px 10px}.vf-1{right:5px}.vf-2{left:5px}.vf-3{right:18px}.modal-fields{grid-template-columns:1fr}.modal-fields label:nth-last-child(-n+2){grid-column:auto}.enroll-dialog{padding:28px 22px}}
