/* Approved fluid-color hero, October 2026. */
.hero.hero{margin-inline:0;border:0;isolation:isolate}
.hero.hero::before{inset:0;z-index:-1;background:linear-gradient(90deg,rgba(245,243,238,.14),rgba(245,243,238,.05) 55%,rgba(245,243,238,.2)),url('assets/hero-fluid-v1.png') center/cover no-repeat;mask-image:none;-webkit-mask-image:none}
.hero .hero-top{left:5%;right:5%}.hero .hero-bottom{padding-inline:5%;background:rgba(245,243,238,.35)}
.hero h1>span:not(.dot),.hero .art-type .word-line,.hero .word-line:nth-child(2)>span{color:#252521}
.hero .intro,.hero .text-link{background:rgba(245,243,238,.72);padding:8px 12px;width:fit-content}
@media(max-width:760px){.hero.hero::before{background-position:center;background-size:auto 100%}.hero .intro{width:180%}.hero .hero-top{left:5%;right:5%}}
/* Refined Japanese editorial treatment, September 2026. */
.language-switch{display:flex;gap:6px;align-items:center;white-space:nowrap;font-size:11px;margin-left:18px}
html[lang="ja"] .language-switch a[lang="ja"],html[lang="zh-Hant"] .language-switch a[lang="zh-Hant"]{color:var(--accent);text-decoration:underline;text-underline-offset:5px}
html[lang="ja"]{font-family:"Noto Sans JP","Yu Gothic","Hiragino Kaku Gothic ProN",sans-serif}
html[lang="ja"] h1,html[lang="ja"] h2,html[lang="ja"] h3{font-family:"Yu Mincho","Hiragino Mincho ProN",serif}
html[lang="ja"] nav{gap:18px}html[lang="ja"] nav a{font-size:12px}
html[lang="ja"] .service-grid h3{font-size:22px;overflow-wrap:anywhere}
html[lang="ja"] .contact-layout h2{font-size:clamp(28px,3.2vw,46px);letter-spacing:1px}
@media(max-width:1200px) and (min-width:761px){header{flex-wrap:wrap;gap:16px}header nav{margin-left:auto}.language-switch{margin-left:auto}}
@media(max-width:760px){.language-switch{margin-left:auto;font-size:10px;gap:4px}header{gap:10px}.header-wordmark{font-size:13px;letter-spacing:2px}html[lang="ja"] .hero-copy h1{font-size:42px}html[lang="ja"] .about-body h2{font-size:30px}html[lang="ja"] .profile-table>div{grid-template-columns:85px minmax(0,1fr)}html[lang="ja"] .profile-table dd{overflow-wrap:anywhere}}
:root{--paper:#f5f3ee;--ink:#282923;--accent:#ce542f;--muted:#727369;--line:#d8d7cf}
header{padding-inline:6%;border-bottom-color:var(--line)}
.header-wordmark{font-weight:500;letter-spacing:5px}nav small{letter-spacing:1.8px}nav a{font-weight:400}
.hero{border-inline:0;margin-inline:6%}.hero-copy{border-left:0}.hero-top{left:0;right:0}.hero-bottom{padding-inline:0}
h1{font-weight:600;letter-spacing:9px}.art-type{font-weight:700;font-size:clamp(68px,7.4vw,122px);letter-spacing:-.06em}.art-kicker,.art-caption{letter-spacing:2.5px}
.ticker{background:transparent;color:var(--muted);border-block:1px solid var(--line);padding:28px 0;font-size:clamp(16px,2vw,28px);font-weight:400;letter-spacing:3px;word-spacing:25px}.ticker span{color:var(--accent)}
.section{padding:120px max(7.5%,calc((100% - 1240px)/2))}.section-label{border-color:var(--line);padding-top:23px;letter-spacing:2px;color:var(--muted)}h2{font-weight:500;line-height:1.65;letter-spacing:3px}.about-body{margin-top:85px;gap:12%}.about-body h2{border-left:1px solid var(--accent);padding-left:30px}.about-body p{line-height:2.5}.about-body .lead{font-weight:500;font-size:26px;line-height:2}
.company-profile{margin-top:115px;display:grid;grid-template-columns:240px minmax(0,1fr);gap:55px}.profile-heading{flex-direction:column;align-items:flex-start;gap:18px}.profile-heading h3{font-family:'Noto Serif TC',serif;font-size:30px;font-weight:500;letter-spacing:4px}.profile-heading .mini-label{font-size:9px;letter-spacing:2.4px}.profile-table{border-top:1px solid var(--line)}.profile-table>div{grid-template-columns:120px minmax(0,1fr);gap:25px;padding:30px 0;line-height:2.2}.profile-table dt{font-size:12px;color:var(--muted);font-weight:400}.profile-table dd{font-size:13px}.profile-table a{border-bottom:1px solid #b4b4a8;padding-bottom:3px}.profile-table a:hover{color:var(--accent)}
.services{background:#eeece5}.service-grid article{padding-block:44px;border-color:var(--line)}.service-grid article:last-child{border-color:var(--line)}.service-grid h3{font-family:'Noto Serif TC',serif;font-weight:500}.service-grid article::before{font-size:30px}.service-grid article:hover{background:#f5f3ee}.section-heading{margin-block:65px}
.recruit{background:#30352f;color:#f4f1e8;padding:105px max(7.5%,calc((100% - 1240px)/2))}.recruit .section-label{color:#c8cbbf;border-color:#60665b}.recruit h2{font-weight:500;font-size:clamp(34px,4vw,60px);margin-top:55px}.recruit p{color:#d1d2c9;line-height:2.3}.recruit-art{border-color:#60665b;color:#c8cbbf}.recruit-art::before{color:#dadbc9;opacity:.18;font-weight:500}.light-button{background:transparent;border-bottom:1px solid #a0a694;padding:18px 0;gap:100px}.light-button:hover{background:transparent;color:#fda878}.recruitment-details{max-width:1240px;margin:auto;padding-inline:70px;background-color:var(--paper)}.recruitment-details .profile-heading{flex-direction:row;align-items:baseline;gap:25px}.recruitment-details .profile-table>div{grid-template-columns:180px minmax(0,1fr)}.recruit-intro{line-height:2.5;color:#606058;margin-bottom:60px}.job-title{font-family:'Noto Serif TC',serif;font-weight:500;letter-spacing:2px}.recruitment-details .profile-table li{padding-block:3px}.contact{background:#eeece5}.contact-layout{gap:12%;margin-top:75px}input,select,textarea{border-color:#b8bab0;padding-block:18px}.submit{padding-block:22px;background:#30352f}.submit:hover{background:#495044}footer{margin-inline:6%;padding-block:55px;border-color:var(--line)}
@media(max-width:1050px){.company-profile{grid-template-columns:180px minmax(0,1fr);gap:30px}.section{padding-inline:6%}.recruitment-details{padding-inline:6%}}
@media(max-width:760px){header{padding-inline:5%}.hero{margin-inline:5%}.hero-top{left:5px;right:5px}.art-type{font-size:clamp(35px,8vw,59px)}h1{font-size:46px;letter-spacing:6px}.hero-bottom{padding-inline:10px}.section{padding:75px 6%}.about-body{margin-top:45px;gap:35px}.about-body h2{padding-left:20px}.about-body .lead{font-size:22px}.company-profile{display:block;margin-top:65px}.profile-heading{gap:12px;margin-bottom:30px}.profile-heading h3{font-size:27px}.profile-table>div,.recruitment-details .profile-table>div{grid-template-columns:80px minmax(0,1fr);gap:17px;padding-block:24px}.profile-table dd{font-size:12px}.section-heading{margin-block:40px}.service-grid article{padding-block:30px}.recruit{padding:75px 6%}.recruit h2{font-size:34px;margin-top:35px}.recruitment-details .profile-heading{gap:15px}.contact-layout{margin-top:45px;gap:40px}footer{padding-block:40px}.ticker{font-size:17px;word-spacing:15px}}
/* Four quiet icon palettes, selected once per page load. */
:root{--pattern-filter:invert(35%) sepia(65%) saturate(700%) hue-rotate(335deg);--pattern-opacity:.10}
:root[data-pattern-color="sage"]{--pattern-filter:invert(35%) sepia(30%) saturate(650%) hue-rotate(65deg)}
:root[data-pattern-color="indigo"]{--pattern-filter:invert(30%) sepia(55%) saturate(700%) hue-rotate(175deg)}
:root[data-pattern-color="plum"]{--pattern-filter:invert(30%) sepia(40%) saturate(700%) hue-rotate(265deg)}
.about::before,.recruitment-details::before,.contact::before{filter:var(--pattern-filter);opacity:var(--pattern-opacity)!important}
/* Full-width recruitment background, keeping the original text column. */
.section.recruitment-details{max-width:none;width:100%;margin-inline:0;padding-inline:max(70px,calc((100% - 1100px)/2))}
@media(max-width:1050px){.section.recruitment-details{padding-inline:6%}}
/* Contact uses a plain background without decorative icons. */
.contact::before{display:none}
/* Quiet animated brand pattern beneath the content. */
.about,.recruitment-details,.contact{position:relative;isolation:isolate;overflow:hidden}.about>*,.recruitment-details>*,.contact>*{position:relative;z-index:1}.about::before,.recruitment-details::before,.contact::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;background:url('assets/ichigeki-seamless-fixed.png') 0 0/540px 540px repeat;opacity:.035;animation:brand-pattern-drift 100s linear infinite}.contact::before{opacity:.025}@keyframes brand-pattern-drift{from{background-position:0 0}to{background-position:540px 540px}}body:has(.hero.motion-paused) .about::before,body:has(.hero.motion-paused) .recruitment-details::before,body:has(.hero.motion-paused) .contact::before{animation-play-state:paused}@media(prefers-reduced-motion:reduce){.about::before,.recruitment-details::before,.contact::before{animation:none}}