@font-face{font-family:EntranceSerif;src:url('./serif.woff2') format('woff2');font-display:swap}
@font-face{font-family:EntranceBody;src:url('./body.woff') format('woff');font-display:swap}
@font-face{font-family:EntranceScript;src:url('./script.woff') format('woff');font-display:swap}
/* Reference entrance: all dimensions are relative to the first viewport. */
#about.entrance{--tile:4vw;--step:4.4vw;isolation:isolate;height:100svh;min-height:480px;padding:0;overflow:hidden;background:#f5f4eb;color:#1e1e1e;font-family:EntranceBody,"PingFang SC","PingFang TC",-apple-system,BlinkMacSystemFont,"Microsoft YaHei",sans-serif}
#about.entrance::before,#about.entrance::after{display:none}
.entrance-pattern{position:absolute;inset:0;background:repeating-linear-gradient(90deg,#f5f4eb 0 3.3vw,#f0efe6 3.3vw 8vw);filter:blur(2px)}
.entrance-header{position:absolute;inset:22px 16px auto;z-index:5;display:flex;justify-content:center;color:#fff}
.entrance-nav{display:flex;gap:10px;opacity:0;visibility:hidden}
.entrance-nav-item{display:inline-flex;align-items:center;justify-content:center;min-width:88px;min-height:44px;padding:11px 25px;border:1px solid #d3e1ef;border-radius:12px;background:#f3f7fc;box-shadow:0 3px 12px #102b4c18;color:#244766;font:500 14px/1.4 "PingFang SC","PingFang TC",-apple-system,BlinkMacSystemFont,"Microsoft YaHei",sans-serif;letter-spacing:.12em;transition:background .2s,color .2s,border-color .2s}
.entrance-nav-item.is-current{background:#204b77;color:#fff;border-color:#204b77}
.entrance-nav-item:disabled{color:#244766;opacity:1;cursor:default;-webkit-text-fill-color:#244766}
.entrance-nav-item.is-current:hover{background:#163a60;border-color:#163a60}
.entrance-nav-item:focus-visible{outline:2px solid white;outline-offset:4px}
.entrance-script{font:400 clamp(16px,1.5vw,26px)/1.2 EntranceScript,"PingFang SC",sans-serif}
.entrance-topline{position:absolute;z-index:4;top:34px;left:50%;transform:translateX(-50%);white-space:nowrap;clip-path:inset(0 100% 0 0)}
.entrance-gallery{position:absolute;inset:0;z-index:1;pointer-events:none}
.entrance-tile{position:absolute;left:calc(50% + var(--i)*var(--step));top:50%;width:var(--tile);height:var(--tile);transform:translate(-50%,-50%);opacity:0;overflow:hidden}
.entrance-tile img{width:100%;height:100%;object-fit:cover}
.entrance-tile::after{content:"";position:absolute;inset:0;background:rgba(20,16,12,.46)}
.entrance-tile-label{position:absolute;inset:0;z-index:1;display:flex;align-items:center;justify-content:center;color:#fff;font:500 clamp(12px,1.15vw,21px)/1 "PingFang SC","PingFang TC",-apple-system,BlinkMacSystemFont,"Microsoft YaHei",sans-serif;letter-spacing:.06em;text-shadow:0 1px 4px #0006;white-space:nowrap}
.entrance-intro{position:absolute;z-index:2;left:0;right:0;bottom:12.5%;text-align:center;opacity:0;padding:0 20px}
.entrance-intro h2{font:400 clamp(28px,3.35vw,64px)/1.25 "PingFang SC","PingFang TC",-apple-system,BlinkMacSystemFont,"Microsoft YaHei",sans-serif;letter-spacing:.06em;margin:0;color:#1e1e1e}
.entrance-intro p{font:400 clamp(12px,.95vw,17px)/1.6 "PingFang SC","PingFang TC",-apple-system,BlinkMacSystemFont,"Microsoft YaHei",sans-serif;color:#8c8c8c;letter-spacing:.1em;margin-top:12px}
.entrance-scene{position:absolute;z-index:3;left:50%;top:50%;width:var(--tile);height:var(--tile);transform:translate(-50%,-50%);overflow:hidden;opacity:0}
.entrance-scene img{width:100%;height:100%;max-width:none;object-fit:cover;transform:scale(1);object-position:50% 50%}
.entrance-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,28,52,.12) 0%,rgba(9,28,52,.06) 40%,rgba(9,28,52,.28) 72%,rgba(9,28,52,.38) 100%)}
.entrance-caption{position:absolute;z-index:4;left:20px;right:20px;bottom:14.8%;width:max-content;max-width:calc(100% - 40px);margin-inline:auto;isolation:isolate;color:#fff;text-align:center;opacity:0;text-shadow:0 2px 8px rgba(4,20,40,.85)}
.entrance-caption::before{content:"";position:absolute;z-index:-1;inset:-22px -52px;pointer-events:none;background:radial-gradient(ellipse,rgba(8,30,58,.72) 0%,rgba(8,30,58,.54) 45%,rgba(8,30,58,0) 75%);filter:blur(12px)}
.entrance-caption .entrance-script{margin-bottom:2px;clip-path:inset(0 100% 0 0)}
.entrance-caption h1{font:500 clamp(32px,3.1vw,60px)/1.4 "PingFang SC","PingFang TC",-apple-system,BlinkMacSystemFont,"Microsoft YaHei",sans-serif;letter-spacing:.08em;margin:0 auto;max-width:12em}
body:has(.entrance)>.cursor,body:has(.entrance)>.cursor-ring,body:has(.entrance)>.scroll-cue{display:none}
@media(max-width:600px){#about.entrance{--tile:5.6vw;--step:6.1vw;min-height:440px}.entrance-tile-label{font-size:clamp(8px,2.2vw,13px);letter-spacing:0}.entrance-header{inset:18px 16px auto}.entrance-topline{top:41px;font-size:17px}.entrance-intro{bottom:16%}.entrance-intro h2{max-width:290px;margin:auto;font-size:34px}.entrance-intro p{font-size:12px}.entrance-caption{bottom:16%}.entrance-caption h1{font-size:34px}.entrance-caption .entrance-script{font-size:20px}.entrance-scene img{transform:scale(1)}.entrance-nav{gap:8px}.entrance-nav-item{min-width:76px;padding:10px 20px;font-size:13px;border-radius:11px}}

/* Revealed only after the entrance has completed. */
.entrance-scroll{position:absolute;z-index:5;left:50%;bottom:max(18px,env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 18px;background:transparent;color:#fff;font:500 12px/1.4 "PingFang SC","PingFang TC",-apple-system,BlinkMacSystemFont,"Microsoft YaHei",sans-serif;letter-spacing:.08em;opacity:0;visibility:hidden;transition:opacity .4s}
.entrance[data-ready="true"] .entrance-scroll{opacity:1;visibility:visible}
.entrance-scroll svg{width:20px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;animation:entrance-down 1.6s ease-in-out infinite}
.entrance-scroll:hover{background:transparent}
.entrance-scroll:focus-visible{outline:2px solid #fff;outline-offset:4px}
@keyframes entrance-down{0%,100%{transform:translateY(-2px)}50%{transform:translateY(3px)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.entrance-scroll svg{animation:none}.entrance-scroll{transition:none}}

/* Unified segmented navigation. */
.entrance-nav{gap:4px;padding:5px;border:1px solid rgba(255,255,255,.8);border-radius:16px;background:rgba(241,246,252,.94);box-shadow:0 6px 24px #102b4c20;backdrop-filter:blur(14px)}
.entrance-nav-item{border:0;border-radius:11px;background:transparent;box-shadow:none;min-width:88px}
.entrance-nav-item.is-current{background:#204b77;box-shadow:0 2px 6px #102b4c20}
.entrance-nav-item:focus-visible{outline:2px solid #204b77;outline-offset:1px}
@media(max-width:600px){.entrance-nav{gap:3px;padding:4px;border-radius:15px}.entrance-nav-item{min-width:76px;border-radius:10px}}

/* Warm unified navigation, shared by home and cases. */
.entrance-nav{background:rgba(250,247,240,.96);border-color:#e8dfd1;box-shadow:0 6px 24px #41291a14}
.entrance-nav-item,.entrance-nav-item:disabled{color:#1e1e1e;-webkit-text-fill-color:#1e1e1e}
.entrance-nav-item:not(.is-current):not(:disabled):hover{background:#eee7dc;color:#1e1e1e}
.entrance-nav-item.is-current{background:#c8302d;color:#fff;-webkit-text-fill-color:#fff;box-shadow:0 2px 8px #a3242226}
.entrance-nav-item.is-current:hover{background:#ad2725;border-color:#ad2725}
.entrance-nav-item:focus-visible{outline-color:#c8302d}