/* Homepage: case-study typography and width, original portfolio palette. */
.home-page{--bg:#f4f4f4;--paper:#f4f4f4;--ink:#111110;--muted:#52524c;--line:#11111024;--orange:#ff5a1f;background:var(--paper)}
.home-page p,.home-page h1,.home-page h2{margin-top:0}

.home-page .hero{min-height:820px;min-height:min(880px,100svh);padding-top:calc(var(--header) + 90px);padding-bottom:100px;display:flex;flex-direction:column;justify-content:center;position:relative}
.hero-label{font-size:11px;letter-spacing:.12em;text-transform:uppercase;display:flex;align-items:center;gap:10px;margin-bottom:36px;color:var(--muted)}
.hero-label:before{content:"";width:7px;height:7px;background:var(--orange);border-radius:50%}
.hero-headline{font-size:clamp(42px,6.1vw,86px);line-height:1.05;letter-spacing:-3.8px;font-weight:800;margin-bottom:48px;max-width:1180px}
.hero-headline .pop{color:var(--orange)}
.hero-bottom{display:flex;justify-content:space-between;align-items:center;gap:28px}
.hero-sub{font-size:15px;color:var(--muted);margin:0}
.hero-cta{display:flex;gap:10px;flex-shrink:0}
.btn{display:inline-block;border:1px solid var(--ink);padding:12px 23px;font-size:12px;border-radius:4px}
.btn-primary{color:var(--paper);background:var(--ink)}
.btn:hover{background:var(--orange);border-color:var(--orange);color:var(--ink)}
.scroll-hint{position:absolute;bottom:30px;left:0;display:flex;align-items:center;gap:12px;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.15em}
.scroll-line{width:40px;height:1px;background:var(--ink)}
.ticker{padding:24px 0;overflow:hidden}
.ticker--top{background:var(--ink);color:var(--paper)}
.ticker--bottom{background:var(--orange);color:var(--ink)}
.ticker-track{width:min(var(--max),calc(100% - 64px));margin:auto}
.ticker-seg{display:block;font-family:var(--font-heading);font-weight:700;font-stretch:125%;font-size:clamp(12px,1.8vw,24px);letter-spacing:-.4px;line-height:1.7}
.section-label{font-size:11px;text-transform:uppercase;letter-spacing:.12em;margin-bottom:40px}
.idx-label{color:#ba3a0b;margin-right:10px}
#work>.container{padding-top:80px}
.work-item{display:block;position:relative;isolation:isolate;border-top:1px solid var(--line);overflow:hidden}
.work-item:last-child{border-bottom:1px solid var(--line)}
.work-row{display:grid;grid-template-columns:1.15fr .85fr;gap:72px;align-items:center;padding-top:48px;padding-bottom:48px;position:relative;z-index:1}
.work-fill{position:absolute;inset:0;background:var(--work-color);opacity:0;transition:opacity .25s ease}
.work-item--orange{--work-color:var(--orange)}.work-item--blue{--work-color:var(--blue)}.work-item--lime{--work-color:var(--lime)}
.work-item:hover .work-fill,.work-item:focus-visible .work-fill{opacity:1}
.work-item--blue:hover,.work-item--blue:focus-visible{color:#fff}
.work-item--blue:hover .work-desc,.work-item--blue:hover .tag,.work-item--blue:focus-visible .work-desc,.work-item--blue:focus-visible .tag{color:#fff;border-color:#ffffff70}
.work-num{position:absolute;top:16px;left:12px;font:800 110px/1 var(--font-heading);color:#11111007;pointer-events:none}
.work-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:18px}
.tag{font-size:9px;letter-spacing:.03em;border:1px solid #11111030;border-radius:20px;padding:4px 9px}
.work-title{font-size:clamp(30px,3.9vw,54px);font-weight:800;line-height:1.05;letter-spacing:-1.8px;margin-bottom:20px}
.work-desc{font-size:14px;line-height:1.75;max-width:490px;margin-bottom:0;color:#343431}
.work-media{height:250px;border-radius:12px;overflow:hidden;border:1px solid #11111012;background:#e5e5df}
.work-media img{object-fit:cover}
.work-media--placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:24px;text-align:center;background:#f0ece6;color:#23384b;border:1px dashed #b6bcb6}
.work-media--placeholder span:first-child{font:600 20px/1.3 var(--font-heading)}
.work-media--placeholder span:last-child{font-size:11px;letter-spacing:.04em}
.home-page .section{padding-top:104px;padding-bottom:110px}
.about-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:72px;align-items:start}
.about-statement{font-size:clamp(52px,6vw,80px);font-weight:800;line-height:1;letter-spacing:-3px;margin-bottom:28px}
.about-statement-sub{font-size:16px;line-height:1.7;max-width:470px;margin-bottom:28px}
.about-body{font-size:14px;line-height:1.85;max-width:540px;color:#51514b;margin-bottom:20px}
.skill-item{padding:21px 0;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:7px}
.skill-item:first-child{border-top:1px solid var(--line)}
.skill-name{font-size:15px;font-weight:700;display:flex;gap:10px;align-items:center}
.skill-name:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--orange)}
.skill-item:nth-child(3n+2) .skill-name:before{background:var(--blue)}.skill-item:nth-child(3n) .skill-name:before{background:#879f0d}
.skill-detail{font-size:12px;color:#60605a;padding-left:16px}
.contact-section{padding-top:90px;padding-bottom:100px;border-top:1px solid var(--line)}
.contact-status{font-size:11px;letter-spacing:.08em;text-transform:uppercase;display:flex;gap:12px;align-items:center;color:#a83208;margin-bottom:30px}
.status-dot{width:7px;height:7px;background:var(--orange);border-radius:50%}
.contact-clock{font-variant-numeric:tabular-nums;color:var(--muted);margin-left:auto}
.contact-headline{font-size:clamp(52px,8vw,108px);font-weight:800;line-height:1;letter-spacing:-4px;margin-bottom:35px}
.contact-mail{display:inline-block;font-family:var(--font-heading);font-size:clamp(16px,2.6vw,32px);font-weight:700;border-bottom:2px solid var(--orange);padding-bottom:8px;margin-bottom:28px;overflow-wrap:anywhere}
.contact-links{display:flex;gap:24px}.contact-link{font-size:12px;border-bottom:1px solid var(--line)}
.home-page footer{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:28px;padding-bottom:28px;font-size:10px;color:var(--muted)}
@media(max-width:980px){.home-page .hero{min-height:680px}.hero-headline{font-size:clamp(40px,6.7vw,68px);letter-spacing:-2px}.work-row,.about-grid{gap:36px;grid-template-columns:1fr 1fr}.work-title{font-size:34px}.work-media{height:220px}.ticker-track{width:calc(100% - 40px)}}
@media(max-width:620px){.home-page .hero{min-height:660px;padding-top:145px;padding-bottom:95px}.hero-headline{font-size:clamp(34px,8.4vw,52px);letter-spacing:-1.5px;line-height:1.13}.hero-bottom{align-items:flex-start;flex-direction:column;gap:26px}.hero-sub{font-size:13px}.hero-label{font-size:9px}.work-row,.about-grid{grid-template-columns:1fr;gap:28px}.work-row{padding-top:36px;padding-bottom:36px}.work-media{height:auto;aspect-ratio:1.6}.work-title{font-size:34px}.work-desc{font-size:13px}.work-num{display:none}.home-page .section{padding-top:76px;padding-bottom:76px}.about-grid{gap:36px}.about-statement{font-size:54px;letter-spacing:-2px}.contact-section{padding-top:70px;padding-bottom:76px}.contact-headline{letter-spacing:-2px}.contact-status{font-size:9px;gap:7px}.ticker{padding:18px 0}.ticker-seg{font-size:12px}.home-page footer{font-size:9px}}
@media(prefers-reduced-motion:reduce){.home-page *, .home-page *:before{transition:none!important;animation:none!important}}

/* Restore the original homepage navigation and interaction language. */







.home-page .ticker{padding:20px 0;white-space:nowrap}
.home-page .ticker-track{display:flex;width:max-content;margin:0;will-change:transform}
.home-page .ticker-seg{flex:none;font-size:clamp(28px,4vw,56px);line-height:1.6;letter-spacing:-.01em;padding-right:1.2em}
.home-page .ticker--bottom .ticker-seg{font-weight:800}
.skill-item{position:relative;isolation:isolate;overflow:hidden;padding:18px;transition:padding-left .3s var(--ease)}
.skill-item:before{content:"";position:absolute;inset:0;z-index:-1;background:var(--orange);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.skill-item:nth-child(3n+2):before{background:var(--blue)}
.skill-item:nth-child(3n):before{background:var(--lime)}
.skill-item:hover{padding-left:28px}
.skill-item:hover:before{transform:scaleX(1)}
.skill-item:hover .skill-name,.skill-item:hover .skill-detail{color:var(--ink)}
.skill-item:nth-child(3n+2):hover .skill-name,.skill-item:nth-child(3n+2):hover .skill-detail{color:white}
.skill-detail{opacity:.65;transform:translateX(12px);transition:opacity .3s,transform .35s var(--ease)}
.skill-item:hover .skill-detail{opacity:1;transform:none}
@media(hover:hover) and (pointer:fine){
  .work-media{opacity:0;transform:translateX(70px) scale(.9) skewX(6deg);transition:transform .6s var(--ease),opacity .5s ease}
  .work-item:hover .work-media,.work-item:focus-visible .work-media{opacity:1;transform:none}
}
@media(max-width:768px){}
@media(max-width:380px){}
@media(prefers-reduced-motion:reduce){.home-page .work-media{opacity:1;transform:none}.home-page .ticker-track{transform:none!important}}
