@import"https://fonts.googleapis.com/css2?family=Iansui&family=Noto+Sans+TC:wght@400;500;700;900&display=swap";@font-face{font-family:jf-open-huninn;src:url(https://cdn.jsdelivr.net/gh/justfont/open-huninn-font@master/font/jf-openhuninn-2.1.ttf) format("truetype");font-style:normal;font-weight:400;font-display:swap}:root{color-scheme:light;--font-family: "Noto Sans TC", "Microsoft JhengHei", system-ui, sans-serif;--color-page: #f6f4ee;--color-surface: #ffffff;--color-text: #202124;--color-muted: #62676f;--color-line: #ddd7cd;--color-accent: #176b87;--color-accent-strong: #0f4c5c;--color-soft: #e6f1f4;--color-footer-text: var(--color-muted);--color-portfolio-surface: #fbfaf7;--radius-card: 12px;--radius-inner: 8px;--shadow-card: 0 18px 45px rgba(27, 35, 44, .1);--avatar-radius: 8px;--grid-gap: 10px;--grid-gap-wide: 12px;--section-padding: 18px;--section-padding-wide: 24px;--card-max-width: 560px;--portfolio-cols: 1;font-family:var(--font-family)}*{box-sizing:border-box}body{margin:0;background:var(--color-page);color:var(--color-text);line-height:1.6}img{display:block;max-width:100%}a{color:var(--color-accent-strong);text-underline-offset:.18em}.card-page{min-height:100vh;padding:24px 14px;background:var(--color-page);font-family:var(--font-family)}.card-page--with-site-nav{padding-top:calc(var(--site-nav-height) + 24px)}.card-page__inner{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--grid-gap);width:min(100%,var(--card-max-width));margin:0 auto;overflow:visible;background:transparent;border:0;border-radius:0}.section-shell,.section-shell--full,.section-shell--half{grid-column:span 2}.section-shell--half-mobile{grid-column:span 1}.section{height:100%;padding:var(--section-padding);background:var(--color-surface);color:var(--color-text);border:1px solid var(--color-line);border-radius:var(--radius-card);box-shadow:var(--shadow-card);text-align:center}.section h1,.section h2,.section h3,.section p{margin-top:0}.section h1{margin-bottom:12px;font-size:clamp(2rem,2rem + 1vw,3rem);line-height:1.12}.section h2{margin-bottom:18px;font-size:1.25rem;line-height:1.25}.section h3{margin-bottom:8px;font-size:1.05rem}.section p{color:var(--color-muted)}.profile-section{display:grid;gap:22px;align-items:center;justify-items:center}.profile-section__image{width:128px;max-width:100%;aspect-ratio:1;object-fit:cover;border-radius:var(--avatar-radius);background:var(--color-soft)}.profile-section__content h1{text-align:center;white-space:pre}.profile-section__content p{max-width:38rem;margin-bottom:0;font-size:1.08rem}.image-section{display:grid;gap:12px;align-content:center;justify-items:center;transition:border-color .2s ease,transform .2s ease,box-shadow .2s ease}.image-section__link-wrapper{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;color:inherit;text-decoration:none;cursor:pointer}.image-section:has(.image-section__link-wrapper:hover){border-color:var(--color-accent);box-shadow:0 8px 24px #0000001f;transform:translateY(-2px)}.image-section__image{width:min(100%,160px);aspect-ratio:1;object-fit:cover;border-radius:8px;background:var(--color-soft)}.image-section__caption{margin-bottom:0;font-weight:700}.service-section{display:flex;flex-direction:column;gap:12px;text-align:left}.service-section h2{margin:0;color:var(--color-text);font-size:1.5rem}.service-section p{margin:0;color:var(--color-muted);font-size:1rem;line-height:1.6}.text-section{text-align:left}:is(.section-shell--half,.section-shell--half-mobile) .text-section{display:flex;flex-direction:column;justify-content:center}:is(.section-shell--half,.section-shell--half-mobile) .text-section h2,:is(.section-shell--half,.section-shell--half-mobile) .text-section p{overflow-wrap:anywhere;word-break:break-word}.text-section p:last-child{margin-bottom:0}@media(max-width:719px){.embed-card--spotify .embed-card__frame,.embed-card--podcast .embed-card__frame{min-height:80px;aspect-ratio:auto}.profile-section__content{min-width:0;max-width:100%}.profile-section__content h1{overflow-wrap:anywhere;white-space:pre-wrap;word-break:break-word}.section-shell--half-mobile .profile-section{padding:clamp(10px,3vw,18px)}.section-shell--half-mobile .profile-section__content h1{font-size:clamp(.75rem,4.5vw,1rem);line-height:1.25}.section-shell--half-mobile .text-section{padding:clamp(12px,4vw,18px)}.section-shell--half-mobile .text-section h2{margin-bottom:clamp(8px,2.5vw,12px);font-size:clamp(1rem,4.8vw,1.25rem)}.section-shell--half-mobile .text-section p{font-size:clamp(.82rem,3.6vw,1rem);line-height:1.55}}.social-section{display:flex;flex-direction:column;justify-content:center}.social-list{display:grid;gap:10px;padding:0;margin:0;list-style:none}.social-list a{display:flex;align-items:center;justify-content:center;gap:12px;min-height:54px;padding:12px 14px;background:var(--button-background, var(--color-soft));border:1px solid var(--button-border-color, transparent);border-radius:var(--radius-inner);color:var(--button-text-color, var(--color-accent-strong));font-weight:700;text-decoration:none}.social-list a:hover{outline:2px solid var(--color-accent);outline-offset:2px}.social-list a:focus-visible{outline:3px solid var(--color-accent);outline-offset:3px}.social-list--icon{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px}:is(.section-shell--half,.section-shell--half-mobile) .social-list--icon{display:grid;grid-template-columns:repeat(2,max-content)}.social-list--icon a{width:54px;height:54px;min-height:54px;padding:0}.social-list--icon .social-list__icon{width:auto;height:auto;background:transparent;border:0;border-radius:0;color:inherit}.social-list--icon .social-icon{width:22px;height:22px}.social-list__identity{display:grid;grid-template-columns:34px minmax(0,1fr);width:min(100%,180px);min-width:0;align-items:center;justify-content:center;gap:12px;text-align:left}.social-list__identity>span:last-child{min-width:0;overflow:hidden;font-size:clamp(.6875rem,3.5vw,1rem);text-overflow:ellipsis;white-space:nowrap}.social-list__icon{display:grid;flex:0 0 auto;width:34px;height:34px;place-items:center;background:var(--color-surface);border:1px solid var(--color-line);border-radius:var(--radius-inner);color:var(--color-accent-strong)}.social-icon{width:20px;height:20px}.map-section__address{margin-bottom:16px}.map-section__frame,.embed-card__frame{display:block;width:100%;border:0;border-radius:var(--radius-inner);background:var(--color-soft)}.map-section__frame{min-height:280px;aspect-ratio:16 / 10}.map-section__link{display:inline-flex;margin-top:14px;font-weight:700}.embed-list{display:grid;gap:16px}.embed-card{padding:16px;background:var(--color-portfolio-surface);border:1px solid var(--color-line);border-radius:var(--radius-inner)}.embed-card__header{display:grid;gap:4px;margin-bottom:10px}.embed-card__header span{color:var(--color-muted);font-size:.78rem;font-weight:700;text-transform:uppercase}.embed-card__header h3{margin-bottom:0}.embed-card__frame{min-height:240px;aspect-ratio:16 / 9}.embed-card--spotify .embed-card__frame,.embed-card--podcast .embed-card__frame{min-height:180px;aspect-ratio:16 / 5}.portfolio-grid{display:grid;gap:16px}.portfolio-card{overflow:hidden;background:var(--color-portfolio-surface);border:1px solid var(--color-line);border-radius:var(--radius-inner)}.portfolio-card img{width:100%;aspect-ratio:16 / 9;object-fit:cover;background:var(--color-soft)}.portfolio-card__body{padding:18px}.portfolio-card__body p{margin-bottom:14px}.portfolio-card__body a{font-weight:700}.footer-section{padding:2px 0 0;margin-top:2px;background:transparent;border:0;border-radius:0;box-shadow:none;text-align:center}.footer-section p{margin:0;color:var(--color-footer-text);font-size:.9rem}.footer-link{color:inherit;text-decoration:underline;text-underline-offset:4px}@media(min-width:720px){.card-page{padding:48px 24px}.card-page--with-site-nav{padding-top:calc(var(--site-nav-height) + 48px)}.card-page__inner{gap:var(--grid-gap-wide)}.section-shell--half{grid-column:span 1}.section-shell--half .profile-section__content h1{font-size:clamp(1.5rem,4vw,2rem);line-height:1.2}.section{padding:var(--section-padding-wide)}.profile-section__image{width:160px}.image-section__image{width:min(100%,180px)}.portfolio-grid{grid-template-columns:repeat(var(--portfolio-cols),minmax(0,1fr))}}
