/* First screen: a surgical teaching room, with the original learning modules intact. */
.page-shell{background:#edf2ff;color:#24334f}
.page-shell .farm-scene,.page-shell .sky-wash,.page-shell .sky-clouds{display:none}
.page-shell .site-header{height:82px;padding:17px clamp(24px,4vw,68px);color:#24334f}
.page-shell .brand,.page-shell .site-header button{color:inherit}
.page-shell .brand>svg{stroke:#6672c7}
.page-shell .brand>span{font-family:Arial,"Microsoft YaHei",sans-serif;font-size:23px;letter-spacing:-.04em}
.page-shell .brand small{font-size:11px;letter-spacing:.08em;color:#687693}
.page-shell .desktop-nav{gap:clamp(10px,1.3vw,22px);margin:0}
.page-shell .desktop-nav button{font-size:14px;font-weight:500}
.page-shell .desktop-nav button:after{background:#6775d7}
.page-shell .menu-toggle{background:#e2e8ff}
.page-shell .menu-toggle span{background:#42527d}
.page-shell .mobile-menu{background:#ffffff;color:#24334f}
.page-shell .mobile-menu button:hover{background:#edf1ff}
.page-shell .hero{height:calc(100dvh - 128px);min-height:0;overflow:hidden}
.surgery-hero-image{position:absolute;inset:0;background:url('/assets/surgery-hero-light.png') 61% top/cover no-repeat;animation:surgery-backdrop-drift 18s ease-in-out infinite alternate}
.surgery-hero:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#f4f7ffeb 0%,#f4f7ffb8 31%,#f4f7ff15 63%),linear-gradient(0deg,#e7edffcc 0%,transparent 27%)}
.surgery-scan{position:absolute;z-index:1;top:0;bottom:0;left:66%;width:1px;background:#91a3e871;box-shadow:0 0 24px #a7b8f2a8;animation:surgery-scan-drift 11s ease-in-out infinite alternate}
.page-shell .hero-copy{z-index:2;left:clamp(28px,6vw,112px);top:14%;transform:none;width:min(740px,57%);text-align:left}
.page-shell .hero h1{margin:0}
.page-shell .wordmark{font:600 clamp(35px,3.3vw,56px)/1 Arial,"Microsoft YaHei",sans-serif;letter-spacing:-.05em;margin:0 0 20px;color:#5e69ba}
.page-shell .chinese{font:600 clamp(30px,3.1vw,48px)/1.16 "Microsoft YaHei","PingFang SC",sans-serif;letter-spacing:-.065em;white-space:nowrap;color:#1f3050}
.hero-summary{max-width:32em;margin:24px 0 26px!important;color:#4e5d7a;font-size:17px!important;line-height:1.65!important}
.page-shell .course-cta{margin:0;background:#6773d5;color:#fff;border-radius:3px;padding:14px 24px;min-height:50px;font-size:15px}
.page-shell .course-cta:hover{background:#5462c4}
.hero-imaging-note{position:absolute;z-index:2;right:5%;top:22%;display:flex;align-items:center;gap:12px;color:#506190;font-size:12px;letter-spacing:.08em;writing-mode:vertical-rl}
.note-line{width:1px;height:48px;background:#8194db;display:block}
.page-shell .module-grid{position:absolute;z-index:2;left:clamp(28px,6vw,112px);right:clamp(28px,6vw,112px);bottom:28px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.page-shell .module-card{position:relative;min-height:102px;border:1px solid #d7def5;border-radius:3px;padding:17px 14px 14px;background:#ffffffde;color:#28395e;box-shadow:0 12px 30px #6572a519;backdrop-filter:blur(8px);animation:surgery-tile-in .65s both;text-align:left;transition:background .2s,transform .2s}
.page-shell .module-card:nth-child(2){animation-delay:.07s}.page-shell .module-card:nth-child(3){animation-delay:.14s}.page-shell .module-card:nth-child(4){animation-delay:.21s}.page-shell .module-card:nth-child(5){animation-delay:.28s}.page-shell .module-card:nth-child(6){animation-delay:.35s}
.page-shell .module-card:hover,.page-shell .module-card:focus-visible{background:#f7f8ff;transform:translateY(-5px)}
.page-shell .module-card strong{display:block;font-size:17px;margin-bottom:10px}
.page-shell .module-card>span{display:block;color:#67748d;font-size:13px}
.page-shell .module-card b{position:absolute;top:12px;right:14px;color:#6373c9;font-size:18px;font-weight:400}
.page-shell .home-footer{position:relative;min-height:46px;padding:9px clamp(28px,6vw,112px);background:#e9eeff;color:#5f6f8e;font-size:12px}
.page-shell .home-footer>span{font-size:12px}
@keyframes surgery-backdrop-drift{from{transform:scale(1.035) translateX(-.8%)}to{transform:scale(1.075) translateX(.8%)}}
@keyframes surgery-scan-drift{from{opacity:.2;transform:translateX(-65px)}to{opacity:.65;transform:translateX(65px)}}
@keyframes surgery-tile-in{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:no-preference){.page-shell .hero h1,.page-shell .hero-summary,.page-shell .course-cta{animation:surgery-tile-in .8s both}.page-shell .hero h1{animation-delay:.12s}.page-shell .hero-summary{animation-delay:.25s}.page-shell .course-cta{animation-delay:.38s}}
@media(max-width:1100px){.page-shell .hero-copy{top:12%;width:66%}.hero-imaging-note{display:none}.page-shell .module-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.page-shell .module-card{min-height:74px;padding:12px}.page-shell .module-card strong{font-size:15px;margin-bottom:4px}.page-shell .module-card>span{font-size:12px}}
@media(max-width:700px){.page-shell{height:auto;min-height:100dvh;overflow:visible}.page-shell .site-header{height:68px;padding:12px 20px}.page-shell .brand>span{font-size:19px}.page-shell .hero{height:auto;min-height:0;padding:92px 20px 26px;overflow:hidden}.surgery-hero-image{inset:0;background-position:61% top;background-size:auto 650px;background-color:#edf2ff}.surgery-hero:after{background:linear-gradient(180deg,#f3f6ff44 0%,#f3f6ffb8 42%,#f3f6ff 75%)}.surgery-scan{left:78%;height:390px;bottom:auto}.page-shell .hero-copy{position:relative;left:auto;top:auto;width:100%;padding:0;min-height:355px}.page-shell .wordmark{font-size:clamp(31px,8vw,45px)}.page-shell .chinese{font-size:clamp(35px,8vw,54px)}.hero-summary{font-size:15px!important;max-width:25em;margin:20px 0!important}.page-shell .module-grid{position:relative;left:auto;right:auto;bottom:auto;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.page-shell .module-card{min-height:84px}.page-shell .home-footer{padding:12px 20px;display:block}.page-shell .home-footer>span{display:none}}
@media(max-width:370px){.page-shell .chinese{font-size:32px}.page-shell .module-card strong{font-size:14px}}

/* Keep the animal fully framed and the learning entrances central on small screens. */
@media(max-width:700px){.page-shell .hero{min-height:calc(100dvh - 114px);display:flex;flex-direction:column;justify-content:center;gap:22px;padding:32px 20px}.page-shell .hero-copy{min-height:0;flex:none}.page-shell .chinese{font-size:clamp(19px,5.3vw,27px);white-space:nowrap;letter-spacing:-.055em}.hero-summary{font-size:clamp(11px,2.8vw,14px)!important;white-space:nowrap;max-width:none;margin:16px 0 20px!important}.page-shell .module-grid{flex:none}.page-shell .wordmark{margin-bottom:16px}}
@media(max-width:370px){.page-shell .chinese{font-size:19px}}
/* Soft moving light over the image gives the first screen continuous motion. */
.surgery-hero:before{content:"";position:absolute;z-index:1;width:36vw;height:36vw;min-width:280px;min-height:280px;right:-10%;top:-24%;border-radius:50%;background:#b7c6ff45;filter:blur(34px);pointer-events:none;animation:surgery-light-drift 14s ease-in-out infinite alternate}
@keyframes surgery-light-drift{from{transform:translate(-18px,12px) scale(.9);opacity:.4}to{transform:translate(22px,-14px) scale(1.12);opacity:.75}}
@media(prefers-reduced-motion:reduce){.surgery-hero-image,.surgery-scan,.surgery-hero:before{animation:none!important}}

/* Six illustrated entrances form one centered learning panel. */
.page-shell .module-grid{top:56%;bottom:auto;left:50%;right:auto;transform:translateX(-50%);width:min(1500px,calc(100% - 100px));gap:12px}
.page-shell .module-card{min-height:164px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:18px 12px 15px;text-align:center;border-radius:12px}
.page-shell .module-card strong{font-size:17px;margin:9px 0 4px}
.page-shell .module-card>span:not(.module-icon){font-size:13px;color:#687792}
.page-shell .module-card b{top:13px;right:16px}
.page-shell .module-icon{display:grid;place-items:center;width:55px;height:55px;border-radius:17px;background:#e7edff;color:#6171c5;transition:transform .25s ease}
.page-shell .module-icon svg{width:29px;height:29px}
.page-shell .module-card:hover .module-icon,.page-shell .module-card:focus-visible .module-icon{transform:translateY(-3px) rotate(-4deg)}
.page-shell .module-card:nth-child(2) .module-icon{background:#e7f2ff;color:#547db6}
.page-shell .module-card:nth-child(3) .module-icon{background:#e8f7f4;color:#3c9385}
.page-shell .module-card:nth-child(4) .module-icon{background:#edf0ff;color:#6c6ebc}
.page-shell .module-card:nth-child(5) .module-icon{background:#fff0e8;color:#bd7653}
.page-shell .module-card:nth-child(6) .module-icon{background:#f1edff;color:#8470bd}
@media(max-width:1100px){.page-shell .module-grid{width:calc(100% - 56px)}.page-shell .module-card{min-height:104px;padding:10px}.page-shell .module-icon{width:38px;height:38px;border-radius:11px}.page-shell .module-icon svg{width:23px;height:23px}.page-shell .module-card strong{font-size:14px;margin:5px 0 2px}}
@media(max-width:700px){.page-shell .module-grid{position:relative;top:auto;left:auto;right:auto;bottom:auto;transform:none;width:100%;gap:9px}.page-shell .module-card{min-height:114px;padding:12px 8px}.page-shell .module-icon{width:42px;height:42px;border-radius:12px}.page-shell .module-icon svg{width:25px;height:25px}.page-shell .module-card strong{font-size:15px;margin:7px 0 2px}.page-shell .module-card>span:not(.module-icon){font-size:12px}}
.hero-bottom-action{position:absolute;z-index:2;left:50%;top:calc(56% + 186px);transform:translateX(-50%);white-space:nowrap}
@media(max-width:1100px) and (min-width:701px){.page-shell .module-grid{top:46%}.hero-bottom-action{top:calc(46% + 234px)}}
@media(max-width:700px){.hero-bottom-action{position:relative;top:auto;left:auto;transform:none;display:flex;justify-content:center;width:100%}}

/* Keep the modules directly beneath the introductory sentence. */
.page-shell .hero-content{position:relative;z-index:2;display:flex;flex-direction:column;gap:16px;height:100%;padding:clamp(48px,7vh,72px) clamp(28px,6vw,112px) 24px}
.page-shell .hero-copy{position:relative;top:auto;left:auto;transform:none;width:min(740px,100%)}
.page-shell .hero-summary{margin-bottom:8px!important}
.page-shell .module-grid{position:relative;top:auto;bottom:auto;left:auto;right:auto;transform:none;width:min(1500px,100%);align-self:center}
.page-shell .hero-bottom-action{position:relative;top:auto;left:auto;transform:none;align-self:center;white-space:nowrap}
@media(max-width:700px){.page-shell .hero{display:block;min-height:calc(100dvh - 114px);padding:0}.page-shell .hero-content{height:auto;min-height:calc(100dvh - 114px);justify-content:center;gap:16px;padding:32px 20px}.page-shell .hero-copy{width:100%}.page-shell .module-grid{width:100%}.page-shell .hero-bottom-action{width:100%;display:flex;justify-content:center}}

/* A soft veil keeps the heading readable while the clean surgical scene stays visible. */
.surgery-hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top;pointer-events:none}
.surgery-hero:after{background:linear-gradient(90deg,#f4f7ff 0%,#f4f7ff 42%,#f4f7ffdb 52%,transparent 66%),linear-gradient(180deg,#f4f7ff80 0%,transparent 14%,transparent 75%,#e7edffb0 100%)}
@media(max-width:700px){.surgery-hero-image{background:#edf2ff;animation:none}.surgery-hero-video{height:480px;object-position:70% top}.surgery-hero:after{background:linear-gradient(180deg,#f4f7ff9c 0%,#f4f7ff8c 30%,#f4f7ffbd 50%,#f3f6ff 82%)}}
@media(prefers-reduced-motion:reduce){.surgery-hero-video{display:none}}

/* Keep the learning entrances beside the animation on wider screens. */
@media(min-width:701px){
  .surgery-hero-video{left:auto;right:0;width:70%;object-position:center top}
  .page-shell .module-grid{align-self:flex-start;width:min(790px,53%);grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
  .page-shell .module-card{min-height:132px}
  .page-shell .hero-bottom-action{align-self:flex-start;width:min(790px,53%);display:flex;justify-content:center}
}