:root {
  --paper:#e9e5dc;
  --paper-light:#f2eee6;
  --ink:#191916;
  --muted:#6f6a61;
  --rust:#a5442d;
  --line:rgba(25,25,22,.22);
  --serif:Georgia,"Times New Roman",serif;
  --systems:#52636a;
  --digital:#6f536b;
  --modeling:#7b633e;
  --campaign:#a85d49;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Arial,"Noto Sans TC","Microsoft JhengHei",sans-serif; font-size:16px; }
section[id] { scroll-margin-top:68px; }
a { color:inherit; text-decoration:none; }
button { color:inherit; font:inherit; }
img { display:block; max-width:100%; -webkit-user-drag:none; user-drag:none; }
.brand-mark,.site-header nav,.menu-toggle,img { -webkit-user-select:none; user-select:none; }
.skip-link { position:fixed; z-index:100; top:-60px; left:16px; padding:12px 16px; background:#fff; }
.skip-link:focus { top:12px; }
.sr-only { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }

/* Header */
.site-header { position:fixed; inset:0 0 auto; z-index:30; height:90px; display:flex; align-items:center; justify-content:space-between; padding:0 4vw; transition:height .3s ease,background .3s ease,border-color .3s ease; }
.site-header.is-scrolled { height:68px; background:rgba(233,229,220,.92); backdrop-filter:blur(14px); border-bottom:1px solid var(--line); }
.brand-mark { display:flex; align-items:center; gap:13px; text-transform:uppercase; letter-spacing:.14em; font-size:11px; font-weight:700; }
.brand-mark img { width:34px; height:34px; object-fit:contain; flex:none; }
nav { display:flex; gap:clamp(24px,3vw,48px); }
nav a { position:relative; display:flex; align-items:baseline; gap:9px; padding:9px 0; font-size:15px; font-weight:700; letter-spacing:.06em; }
nav a:after { content:""; position:absolute; left:0; right:100%; bottom:2px; border-bottom:1px solid; transition:right .3s ease; }
nav a:hover:after,nav a[aria-current="page"]:after { right:0; }
nav small { color:var(--rust); font-size:9px; }
nav em { color:var(--muted); font-size:9px; font-style:normal; font-weight:400; letter-spacing:.1em; text-transform:uppercase; }
.menu-toggle { display:none; border:0; background:none; }

/* Shared home typography */
.section-pad { padding:clamp(88px,8vw,142px) max(5vw,calc((100vw - 1640px)/2)); }
.eyebrow { margin:0; font-size:11px; font-weight:700; letter-spacing:.15em; }
.eyebrow span { color:var(--muted); font-size:9px; font-weight:400; text-transform:uppercase; }
.inline-link { display:inline-flex; align-items:center; gap:26px; margin-top:36px; padding:12px 0; border-bottom:1px solid; font-weight:700; }
.inline-link b { font-weight:400; }

/* Home hero */
.home-hero { position:relative; min-height:100svh; overflow:hidden; display:grid; grid-template-columns:minmax(0,48%) minmax(0,52%); grid-template-rows:1fr auto; padding:clamp(116px,12vh,150px) 4vw 34px; }
.home-hero:before { content:""; position:absolute; inset:0; opacity:.18; pointer-events:none; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitchTiles'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.12'/%3E%3C/svg%3E"); }
.home-hero__rule { position:absolute; top:0; bottom:0; left:53%; width:1px; background:var(--line); }
.home-hero__copy { position:relative; z-index:3; align-self:center; padding:24px 5vw 62px 1vw; }
.hero-kicker { display:flex; justify-content:space-between; gap:20px; max-width:760px; margin:0 0 clamp(44px,6vh,74px); padding-top:12px; border-top:1px solid var(--line); font-size:10px; font-weight:700; letter-spacing:.13em; }
.home-hero h1 { max-width:880px; margin:0; font:700 clamp(52px,5.7vw,108px)/1.04 "Noto Sans TC","Microsoft JhengHei",sans-serif; letter-spacing:-.06em; text-wrap:balance; }
.home-hero h1 span { color:var(--rust); }
.hero-lead { max-width:680px; margin:38px 0 0; color:#4f4b44; font-size:clamp(16px,1.15vw,20px); line-height:1.95; }
.hero-actions { display:flex; flex-wrap:wrap; gap:18px 42px; margin-top:38px; }
.hero-actions a { display:flex; align-items:center; justify-content:space-between; min-width:190px; padding:14px 0; border-bottom:1px solid; font-size:14px; font-weight:700; }
.hero-actions b { color:var(--rust); font-weight:400; }
.home-hero__stage { position:relative; min-height:650px; align-self:stretch; }
.hero-person { position:absolute; inset:0 0 8% 14%; margin:0; overflow:hidden; background:#292720; animation:maskReveal .72s .08s both; }
.hero-person>img { width:100%; height:100%; object-fit:cover; object-position:center 42%; filter:saturate(.78) contrast(1.02); transition:transform .8s ease; }
.hero-person:hover>img { transform:scale(1.018); }
.hero-person figcaption { position:absolute; right:0; bottom:0; padding:11px 14px; background:var(--paper); font-size:8px; letter-spacing:.16em; }
.hero-practice-strip { position:relative; z-index:4; grid-column:1/3; display:grid; grid-template-columns:repeat(4,1fr); margin-top:22px; border-top:1px solid var(--line); }
.hero-practice-strip span { padding:16px 15px 4px 0; color:var(--muted); font-size:9px; letter-spacing:.08em; text-transform:uppercase; }
.scroll-cue { position:absolute; z-index:5; right:4vw; bottom:35px; display:flex; align-items:center; gap:16px; font-size:10px; letter-spacing:.14em; }
.scroll-cue i { position:relative; width:56px; border-top:1px solid; }
.scroll-cue i:after { content:""; position:absolute; right:0; top:-3px; width:6px; height:6px; border-right:1px solid; border-bottom:1px solid; transform:rotate(45deg); }

/* Practices */
.practice-section { background:var(--paper-light); border-top:1px solid var(--line); }
.home-section-intro { display:grid; grid-template-columns:.55fr 1.45fr; gap:8vw; margin-bottom:clamp(64px,7vw,104px); }
.home-section-intro h2,.proof-heading h2,.approach-copy h2,.home-contact h2 { margin:0; font:700 clamp(38px,4.2vw,72px)/1.14 "Noto Sans TC","Microsoft JhengHei",sans-serif; letter-spacing:-.045em; text-wrap:balance; }
.home-section-intro>div>p { max-width:620px; margin:28px 0 0; color:var(--muted); font-size:17px; line-height:1.9; }
.practice-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); }
.practice-card { --practice:var(--rust); background:var(--paper); }
.practice-card--systems { --practice:var(--systems); }
.practice-card--digital { --practice:var(--digital); }
.practice-card--modeling { --practice:var(--modeling); }
.practice-card--campaign { --practice:var(--campaign); }
.practice-card a { display:grid; grid-template-columns:44% 56%; min-height:360px; }
.practice-card figure { position:relative; margin:0; overflow:hidden; background:#292720; }
.practice-card figure:after { content:""; position:absolute; inset:0; border:8px solid transparent; transition:border-color .35s ease; }
.practice-card:hover figure:after { border-color:var(--practice); }
.practice-card img { width:100%; height:100%; object-fit:cover; filter:saturate(.72); transition:transform .65s ease,filter .4s ease; }
.practice-card:hover img { transform:scale(1.025); filter:saturate(.92); }
.practice-card div { display:flex; flex-direction:column; align-items:flex-start; padding:38px; }
.practice-card small { color:var(--practice); font-size:9px; font-weight:700; letter-spacing:.12em; }
.practice-card h3 { margin:52px 0 18px; font-size:clamp(28px,2.4vw,42px); letter-spacing:-.035em; }
.practice-card p { max-width:430px; margin:0; color:var(--muted); font-size:15px; line-height:1.85; }
.practice-card span { margin-top:auto; padding-top:24px; border-top:1px solid var(--line); font-size:12px; font-weight:700; }

/* Evidence */
.proof-section { background:#1b1a17; color:#ece7dd; }
.proof-heading { display:grid; grid-template-columns:.55fr 1.2fr auto; gap:6vw; align-items:end; margin-bottom:80px; }
.proof-heading .eyebrow span { color:#948f85; }
.proof-heading>a { padding:12px 0; border-bottom:1px solid rgba(255,255,255,.35); font-size:13px; }
.proof-heading>a span { margin-left:24px; color:#c06347; }
.proof-layout { display:grid; grid-template-columns:1.35fr .65fr; gap:28px; }
.proof-feature,.proof-secondary>a { display:block; }
.proof-feature figure,.proof-secondary figure { margin:0; overflow:hidden; background:#292824; }
.proof-feature figure { aspect-ratio:4/2.55; }
.proof-secondary figure { aspect-ratio:16/7; }
.proof-feature img,.proof-secondary img { width:100%; height:100%; object-fit:cover; filter:saturate(.8) contrast(1.04); transition:transform .65s ease,filter .4s ease; }
.proof-feature:hover img,.proof-secondary>a:hover img { transform:scale(1.02); filter:saturate(1); }
.proof-feature>div { display:grid; grid-template-columns:.45fr 1fr auto; gap:24px; align-items:end; padding:28px 0; border-top:1px solid rgba(255,255,255,.25); }
.proof-feature small,.proof-secondary small { color:#c06347; font-size:9px; letter-spacing:.12em; }
.proof-feature h3,.proof-secondary h3 { margin:0; font-size:clamp(25px,2.4vw,40px); }
.proof-feature p { margin:0; color:#aaa49a; font-size:13px; line-height:1.75; }
.proof-feature b { font-size:12px; }
.proof-secondary { display:grid; gap:26px; }
.proof-secondary>a>div { padding:18px 0 4px; border-top:1px solid rgba(255,255,255,.25); }
.proof-secondary h3 { margin:10px 0 8px; font-size:24px; }
.proof-secondary span { color:#aaa49a; font-size:11px; }

/* Approach */
.approach-section { display:grid; grid-template-columns:.9fr 1.1fr; gap:9vw; align-items:center; background:#d8d2c7; }
.approach-visual figure { position:relative; margin:0; aspect-ratio:4/4.6; overflow:hidden; background:#292720; }
.approach-visual img { width:100%; height:100%; object-fit:cover; filter:saturate(.72); }
.approach-visual figcaption { position:absolute; right:0; bottom:0; padding:11px 14px; background:#d8d2c7; font-size:8px; letter-spacing:.13em; }
.approach-copy>p:not(.eyebrow) { max-width:660px; margin:32px 0 44px; color:#555047; font-size:17px; line-height:1.95; }
.approach-copy h2 { margin-top:38px; }
.approach-copy ol { margin:0; padding:0; list-style:none; border-top:1px solid var(--line); }
.approach-copy li { display:grid; grid-template-columns:60px 1fr; padding:18px 0; border-bottom:1px solid var(--line); }
.approach-copy small { color:var(--rust); font-size:9px; }
.approach-copy li span { font-size:16px; font-weight:700; }

/* Contact + Footer */
.home-contact { background:#b9b1a3; }
.home-contact>div { display:grid; grid-template-columns:1.15fr .85fr; gap:8vw; align-items:end; margin-top:62px; }
.home-contact>div>p { max-width:580px; margin:0; color:#514c44; font-size:17px; line-height:1.9; }
.home-contact a { grid-column:1/3; display:grid; grid-template-columns:1fr auto; align-items:center; margin-top:32px; padding:30px 0; border-top:1px solid; border-bottom:1px solid; }
.home-contact a span { font-size:clamp(24px,3vw,48px); overflow-wrap:anywhere; }
.home-contact a b { font-size:13px; }
footer { background:var(--ink); color:#d6d0c6; padding:58px 4vw; display:grid; grid-template-columns:2fr repeat(3,1fr); gap:5vw; font-size:10px; line-height:1.9; letter-spacing:.08em; text-transform:uppercase; }
.footer-name { display:flex; flex-direction:column; gap:9px; }
.footer-name strong { font:32px var(--serif); letter-spacing:-.03em; text-transform:none; }
.footer-name span { color:#9a958c; font-size:12px; }

[data-reveal] { opacity:0; transform:translateY(22px); transition:opacity .55s ease,transform .55s ease; }
[data-reveal].is-visible { opacity:1; transform:none; }
@keyframes maskReveal { from { clip-path:inset(0 0 100%); opacity:.7; } to { clip-path:inset(0); opacity:1; } }

@media (max-width:1100px) {
  .home-hero { grid-template-columns:52% 48%; }
  .home-hero__stage { min-height:590px; }
  .practice-card a { grid-template-columns:1fr; }
  .practice-card figure { aspect-ratio:16/8; }
  .practice-card div { min-height:290px; }
  .proof-heading { grid-template-columns:.55fr 1.45fr; }
  .proof-heading>a { grid-column:2; justify-self:start; }
}

@media (max-width:760px) {
  .site-header { height:68px; padding:0 20px; background:rgba(233,229,220,.92); border-bottom:1px solid var(--line); backdrop-filter:blur(14px); }
  .brand-mark img { width:32px; height:32px; }
  .menu-toggle { display:flex; align-items:center; gap:12px; padding:10px 0; font-size:11px; letter-spacing:.14em; }
  .menu-toggle i { width:24px; border-top:1px solid; }
  nav { position:fixed; inset:68px 0 auto; z-index:-1; display:flex; visibility:hidden; pointer-events:none; flex-direction:column; gap:3px; padding:24px 22px 34px; background:var(--paper); border-bottom:1px solid; transform:translateY(-130%); transition:transform .35s ease,visibility 0s linear .35s; }
  nav.is-open { visibility:visible; pointer-events:auto; transform:none; transition-delay:0s; }
  nav a { font-size:25px; line-height:1.2; }
  nav em { margin-left:6px; }
  .section-pad { padding:72px 20px; }
  .home-hero { min-height:0; display:block; padding:108px 20px 32px; }
  .home-hero__rule { left:73px; }
  .home-hero__copy { padding:0; }
  .hero-kicker { display:block; margin:0 0 34px; padding-left:66px; font-size:8px; line-height:1.8; }
  .hero-kicker span { display:block; }
  .home-hero h1 { max-width:355px; font-size:clamp(43px,13.2vw,56px); line-height:1.08; letter-spacing:-.065em; }
  .home-hero h1 br { display:none; }
  .hero-lead { margin-top:28px; font-size:15px; line-height:1.85; }
  .hero-actions { gap:8px 26px; margin-top:26px; }
  .hero-actions a { min-width:145px; font-size:12px; }
  .home-hero__stage { min-height:560px; margin:48px -20px 0; }
  .hero-person { inset:0 0 64px 72px; }
  .hero-person>img { object-position:52% center; }
  .hero-practice-strip { grid-template-columns:1fr 1fr; gap:0; margin-top:12px; }
  .hero-practice-strip span { min-height:38px; padding:10px 5px 4px 0; border-bottom:1px solid var(--line); font-size:7px; }
  .scroll-cue { display:none; }
  .home-section-intro { grid-template-columns:1fr; gap:30px; margin-bottom:48px; }
  .home-section-intro h2,.proof-heading h2,.approach-copy h2,.home-contact h2 { font-size:38px; line-height:1.2; }
  .home-section-intro>div>p { font-size:15px; }
  .practice-grid { grid-template-columns:1fr; }
  .practice-card a { display:block; min-height:0; }
  .practice-card figure { aspect-ratio:16/9; }
  .practice-card div { min-height:0; padding:28px 24px 30px; }
  .practice-card h3 { margin:28px 0 14px; font-size:30px; }
  .practice-card p { font-size:14px; }
  .practice-card span { margin-top:28px; }
  .proof-heading { display:block; margin-bottom:46px; }
  .proof-heading h2 { margin:30px 0; }
  .proof-layout { grid-template-columns:1fr; }
  .proof-feature figure { aspect-ratio:4/3; }
  .proof-feature>div { display:block; padding:20px 0 30px; }
  .proof-feature h3 { margin:12px 0; font-size:29px; }
  .proof-feature b { display:block; margin-top:18px; }
  .proof-secondary { gap:36px; }
  .proof-secondary figure { aspect-ratio:4/3; }
  .proof-secondary h3 { font-size:25px; }
  .approach-section { grid-template-columns:1fr; gap:50px; }
  .approach-visual figure { aspect-ratio:4/4.8; }
  .approach-copy h2 { margin-top:28px; }
  .approach-copy>p:not(.eyebrow) { font-size:15px; }
  .home-contact>div { display:block; margin-top:34px; }
  .home-contact>div>p { margin-top:28px; font-size:15px; }
  .home-contact a { grid-template-columns:1fr; gap:16px; margin-top:34px; padding:24px 0; }
  .home-contact a span { font-size:23px; }
  footer { grid-template-columns:1fr 1fr; padding:48px 22px; }
  .footer-name { grid-column:1/3; margin-bottom:18px; }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
  [data-reveal] { opacity:1; transform:none; }
}