:root{--ink:#0c1113;--paper:#e9ece8;--cyan:#45e3df;--orange:#ff6b32;--line:rgba(255,255,255,.15)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:#f4f6f3;font-family:"Noto Sans TC",sans-serif}.concept{height:27px;display:grid;place-items:center;background:var(--cyan);color:#071011;font:600 10px "IBM Plex Mono";letter-spacing:.15em}nav{height:76px;position:absolute;top:27px;width:100%;z-index:4;padding:0 clamp(20px,5vw,76px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.logo{text-decoration:none;color:white;font:500 19px "IBM Plex Mono";letter-spacing:.06em}.logo i{font-style:normal;color:var(--cyan);margin-left:5px}.links{display:flex;gap:30px}.links a,footer a{color:#d1d5d4;text-decoration:none;font-size:12px}.nav-cta,.primary{display:inline-flex;background:var(--cyan);color:#071011;padding:13px 18px;text-decoration:none;font-weight:800;font-size:13px}.hero{height:min(900px,96vh);min-height:720px;position:relative;overflow:hidden}.hero>img{width:100%;height:100%;object-fit:cover}.grid{position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,10,12,.92) 0%,rgba(5,10,12,.68) 42%,rgba(5,10,12,.05) 77%),linear-gradient(rgba(69,227,223,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(69,227,223,.055) 1px,transparent 1px);background-size:auto,42px 42px,42px 42px}.hero-copy{position:absolute;left:clamp(22px,7vw,108px);top:25%;z-index:2;max-width:760px}.code,.section-title>p,.area>p{font:600 11px "IBM Plex Mono";letter-spacing:.18em;color:var(--cyan)}h1{font-size:clamp(48px,6.4vw,94px);line-height:1.03;letter-spacing:-.06em;margin:24px 0;font-weight:900}h1 em{font-style:normal;color:var(--cyan)}.hero-copy>p:not(.code){max-width:630px;color:#c4ccca;line-height:1.85}.actions{display:flex;gap:12px;margin-top:34px}.secondary{border:1px solid #65706f;color:white;text-decoration:none;padding:13px 18px;font-size:13px}.meter{position:absolute;right:5vw;bottom:40px;background:rgba(7,12,14,.86);border:1px solid var(--line);padding:20px 24px;width:280px;font:10px "IBM Plex Mono"}.meter span{color:var(--cyan)}.meter b{float:right}.meter div{height:5px;background:#293134;margin:14px 0}.meter i{display:block;width:72%;height:100%;background:linear-gradient(90deg,var(--cyan),var(--orange))}.meter small{color:#7e8988}.symptoms{padding:110px clamp(22px,7vw,106px);background:var(--paper);color:#111718}.section-title{display:flex;justify-content:space-between;align-items:end}.section-title h2,.method h2,.diagnose h2,.boundary h2,.area h2{font-size:clamp(38px,4.7vw,70px);line-height:1.08;letter-spacing:-.055em;margin:16px 0}.symptom-grid{display:grid;grid-template-columns:repeat(4,1fr);margin-top:65px;border-top:1px solid #aeb6b3}.symptom-grid article{padding:35px 28px 30px 0;border-right:1px solid #aeb6b3}.symptom-grid article+article{padding-left:28px}.symptom-grid b{font:500 12px "IBM Plex Mono";color:#65706f}.symptom-grid h3{font-size:21px;margin-top:50px}.symptom-grid p{color:#596260;line-height:1.75;min-height:90px}.symptom-grid span{font:500 9px "IBM Plex Mono";letter-spacing:.14em;color:#168c89}.method{padding:110px clamp(22px,7vw,106px);display:grid;grid-template-columns:.8fr 1.2fr;gap:9vw}.method-copy>p:last-child{color:#9ba5a3;line-height:1.8}.method ol{list-style:none;padding:0;margin:0}.method li{display:grid;grid-template-columns:70px 1fr;gap:18px;border-top:1px solid #394244;padding:22px 0}.method li>span{font:500 13px "IBM Plex Mono";color:var(--cyan)}.method h3{margin:0 0 6px}.method li p{margin:0;color:#96a09e;line-height:1.6}.diagnose{background:#101719;padding:110px clamp(22px,7vw,106px);display:grid;grid-template-columns:.75fr 1.25fr;gap:7vw}.diagnose-head>p:last-child{color:#96a09e;line-height:1.7}form{background:#e9ece8;color:#111718;padding:clamp(25px,4vw,50px);position:relative}.progress{height:4px;background:#c5ccca;margin-bottom:40px}.progress i{display:block;height:100%;width:25%;background:var(--orange);transition:.3s}fieldset{border:0;padding:0;margin:0}legend{font-size:21px;font-weight:800;margin-bottom:25px}label{display:block;margin:9px 0}label input{position:absolute;opacity:0}label span{display:block;border:1px solid #b3bcba;padding:15px 17px;cursor:pointer;transition:.15s}label input:checked+span{border-color:#111718;background:#111718;color:#fff}.form-actions{display:flex;justify-content:space-between;margin-top:22px}.form-actions button{padding:12px 16px;border:0;background:none;cursor:pointer}.form-actions #next{margin-left:auto;background:var(--orange);color:#111;font-weight:800}#result{border-left:4px solid var(--orange);padding-left:22px}#result h3{font-size:25px;margin:10px 0}#result p{line-height:1.7;color:#4e5957}#result a{display:inline-block;margin-top:12px;color:#005c5a;font-weight:800}.boundary{padding:100px clamp(22px,7vw,106px);background:#ff6b32;color:#111718}.boundary .code{color:#111718}.boundary>div{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#9b3e1d;margin-top:45px}.boundary>div p{background:var(--orange);margin:0;padding:28px;font-weight:700}.area{text-align:center;padding:100px 22px}.area span{display:block;color:#8c9795;word-spacing:12px;margin:25px 0 35px}.area .primary{display:inline-flex}footer{display:grid;grid-template-columns:1fr 2fr 1fr;gap:18px;align-items:center;padding:35px clamp(22px,5vw,76px);border-top:1px solid #30383a;color:#7f8a88;font-size:10px}footer>a:last-child{text-align:right;color:var(--cyan)}
@media(max-width:780px){nav{height:66px}.links{display:none}.nav-cta{padding:10px 12px}.hero{min-height:780px}.hero>img{object-position:66% center}.grid{background:linear-gradient(0deg,rgba(5,10,12,.98) 0%,rgba(5,10,12,.72) 62%,rgba(5,10,12,.1)),linear-gradient(rgba(69,227,223,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(69,227,223,.05) 1px,transparent 1px);background-size:auto,38px 38px,38px 38px}.hero-copy{top:24%;right:20px}.hero h1{font-size:52px}.meter{left:20px;right:20px;bottom:22px;width:auto}.symptoms,.method,.diagnose,.boundary{padding:80px 20px}.section-title,.method,.diagnose{display:block}.symptom-grid{grid-template-columns:1fr 1fr}.symptom-grid article{padding:28px 18px 28px 0;border-bottom:1px solid #aeb6b3}.symptom-grid article+article{padding-left:18px}.symptom-grid h3{margin-top:28px}.symptom-grid p{min-height:0}.method{display:grid;grid-template-columns:1fr;gap:40px}.diagnose{display:grid;grid-template-columns:1fr;gap:32px}.boundary>div{grid-template-columns:1fr}footer{grid-template-columns:1fr}footer>a:last-child{text-align:left}}@media(max-width:420px){.symptom-grid{grid-template-columns:1fr}.symptom-grid article+article{padding-left:0}.actions{flex-wrap:wrap}}
